Zeplin là một phần mềm vẽ hiệu quả có thể giúp người dùng thiết kế và tạo ra hình ảnh tốt hơn. Nó cung cấp cho người dùng các chú thích, hướng dẫn về kiểu dáng, ghi chú và các chức năng cộng tác nhóm đơn giản. Nó cũng có thể tự động tạo chú thích kích thước, mã kiểu CSS, Xuất hình ảnh và hơn.

Tính năng của phần mềm

Điều này Sau đó, xuất tệp từ bản phác thảo bạn cần sử dụng.

Và đối với việc phân nhóm Zeplin, hãy thiết lập các chức năng để các thao tác liên quan có thể được hoàn thành nhanh chóng.

Hỗ trợ xem nhanh các kiểu CSS và xuất bản nháp thiết kế đã hoàn thành của bạn.

Hỗ trợ gõ những thay đổi bạn cần sử dụng vào file.

Nhận xét nhanh chóng tài liệu và hỗ trợ chức năng bình luận.

Các giá trị liên quan cũng có thể được hiển thị để nhanh chóng hoàn thành việc xem xét.

Giới thiệu chức năng

Trong Tài nguyên tùy chỉnh ở một nơi

Zeplin sẽ tự động tạo ra các thông số kỹ thuật, nội dung và đoạn mã chính xác từ các thiết kế được tùy chỉnh cho nền tảng mà bạn phát triển. Không còn bị lạc trong các tập tin thiết kế.

Xuất thiết kế chỉ bằng một cú nhấp chuột

Bạn không cần thay đổi phương pháp thiết kế của mình, chỉ cần xuất tệp bằng một cú nhấp chuột và sử dụng chúng với Sketch, Adobe XD CC, Figma và Phần bổ trợ Adobe Photoshop CC.

Thu hút mọi người trên cùng một trang.

Các dự án thiết kế cửa hàng và cửa hàng của Zeplin đều nằm trên đám mây, dưới một mái nhà. Nhanh chóng mời đồng đội, chia sẻ liên kết và xây dựng.

Giao tiếp trong thiết kế.

Thêm nhận xét trực tiếp vào thiết kế để truyền đạt ý tưởng, phản hồi hoặc yêu cầu chi tiết kỹ thuật. Để giữ mọi thứ ngăn nắp, hãy tô màu ghi chú của bạn và trả lời chúng khi bạn hoàn thành.

Tăng tốc quy trình làm việc của bạn bằng các tiện ích tích hợp.

Thêm ZePin vào kênh thư giãn hoặc bảng TelLo để tăng tốc quy trình làm việc của bạn và luôn cập nhật cho nhóm của bạn.

Xây dựng nền tảng kiến ​​thức thiết kế của nhóm

Thu thập và sắp xếp các dự án cũng như tài nguyên của nhóm, chẳng hạn như các thành phần, màu sắc và kiểu văn bản. Lưu trữ các phiên bản, dự án cũ và nhanh chóng tham khảo khi cần thiết.

Phương thức ứng dụng

Sau khi quá trình tải xuống hoàn tất, chúng ta mở Ứng dụng cục bộ và nhấp vào Tạo ở góc trên bên phải để tạo dự án mới. Nó có nhiều chế độ, Android, iOS và Web, sẽ được giới thiệu từng chế độ một bên dưới.

Ở đây chúng tôi chọn Web và bạn có thể thấy CSS và HTML.

Xuất tệp từ Sketch

Hãy mở Sketch và chọn Menu -> Plugins -> Zeplin -> Xuất các Artboard đã chọn...

Cửa sổ nhập Zeplin sẽ bật lên, chọn dự án để nhập.

Bạn có thể nhận thấy rằng có một dòng chữ "Thay thế tệp có cùng tên" ở góc dưới bên trái, điều đó có nghĩa là nếu dự án đã được nhập nhưng bản phác thảo thiết kế trong bản phác thảo của chúng tôi đã được sửa đổi và bản phác thảo thiết kế trên Zeplin cần được cập nhật, bạn có thể Thay thế file gốc bằng cách tích vào nó.

Nhóm và cài đặt của Zeplin

Sau khi quá trình nhập hoàn tất, Ứng dụng Zeplin sẽ tự động bật lên và chúng ta có thể thấy rằng tất cả các tệp đều có trong Zeplin. Di chuột về phía bên trái của tệp đầu tiên và một biểu tượng tương tự như biểu tượng chia sẽ xuất hiện. Nhấp vào nó và chúng ta có thể tạo một nhóm cho các tệp này.

Ở đây chúng tôi gọi nó là "liên quan đến sản phẩm". Nhìn sang bên phải tên file có biểu tượng hình tam giác nhỏ, bấm vào đó để dễ dàng thu gọn hoặc mở rộng nhóm file.

Ngoài ra còn có một nút để thực hiện nhiều hành động khác bên cạnh. Chúng ta có thể thêm mô tả cho nhóm, đổi tên nhóm, di chuyển nhóm hoặc xóa nhóm chỉ bằng một cú nhấp chuột.

Xem các kiểu CSS

Chúng tôi nhập bản phác thảo thiết kế của Zeplin và nhấp vào một khu vực, như hiển thị bên dưới. Chúng ta có thể thấy kích thước px của khu vực này cũng như khoảng cách của nó với các phần tử khác.

Nhìn vào phía bên phải của bảng điều khiển, chúng ta cũng sẽ thấy các giá trị liên quan đến CSS của nó, chẳng hạn như box-shadow.

Xuất hình ảnh phác thảo thiết kế

Zeplin còn có một chức năng hay đó là xuất hình ảnh. Hình ảnh vector có thể được bao gồm ở định dạng PNG và SVG.

Nhưng đừng quên, trước tiên bạn cần thiết lập xuất cho hình ảnh này trong Sketch.

Gắn thẻ cho các tệp

Vì vậy, chúng ta hãy xem các thẻ của các hàm Zeplin. Bạn có thể thấy rằng tài liệu này đã có thẻ "Chủ đề". Chúng ta cũng có thể chọn nhãn khác cho nó hoặc nhập nhãn mới. Bạn cũng có thể xóa các thẻ này.

Sau đó quay lại bảng điều khiển chính. Chúng ta có thể nhận thấy rằng có hai hàng nhãn ở trên cùng. Ví dụ: nếu chúng tôi chọn "Chủ đề", chúng tôi sẽ thấy tất cả tài liệu có nhãn "Chủ đề".

Ban đầu, Zeplin không tạo ra khả năng phân nhóm nên chúng tôi sử dụng thẻ để phân loại tệp. Bây giờ chúng ta có thể sử dụng thẻ để xây dựng các bộ lọc chi tiết hơn.

Ghi chú hoặc bình luận

Sau đó nhìn vào chức năng bình luận. Chúng ta có thể trả lời bình luận, đổi màu bình luận, xóa bình luận.

Bạn cũng có thể thêm nhận xét. CMD+click vào chỗ trống và nhập nhận xét của bạn.

Hãy chú ý. Ở góc dưới bên phải của tài liệu có một chú khỉ nhỏ với con mắt ghi chú. Nếu bạn nhấp vào nó, bạn có thể ẩn tất cả các bình luận trên trang.