NộI Dung
- 01. Hướng dẫn Sao chép & Dán
- 02. Trình dọn dẹp phác thảo
- 03. Anima
- 04. React Sketch.app
- 05. Plugin Git Sketch
- 06. ImageOptim
- 07. Gương thần
- 08. Xuất nhiều hơn
- 11. Marketch
- 12. Vòng tròn được phân đoạn
- 13. Sketch Runner
- 14. Phông chữ Biểu tượng
- 15. Tìm và thay thế
Các plugin Sketch giúp làm cho Sketch tốt hơn nữa. Sketch là công cụ thiết kế web giao diện người dùng được nhiều người lựa chọn và một phần của điều làm nên điều tốt là cộng đồng những người làm việc để mở rộng chức năng và tính năng của nó bằng cách xây dựng các plugin tùy chỉnh.
Việc quản lý các plugin Sketch của bạn giờ đây dễ dàng hơn bao giờ hết. Các plugin cập nhật tự động và các plugin lỗi thời sẽ bị tắt. Làm cho hệ sinh thái plugin trở nên hữu ích hơn nữa là Sketch Cloud, một dịch vụ chia sẻ tệp mà bất kỳ ai cũng có thể đăng ký, nơi bạn có thể xem, tải xuống và nhận xét về các tài liệu Sketch đã được chia sẻ công khai hoặc riêng tư trực tiếp từ Sketch.
Vì vậy, chúng ta hãy xem xét các plugin Sketch tốt nhất xung quanh - những plugin có thể thay đổi đáng kể cách bạn thiết kế giao diện người dùng. Khi bạn đã phát hiện ra một plugin bạn muốn, hãy đọc về cách cài đặt các plugin Sketch. Nếu bạn yêu thích các công cụ web của mình, đừng bỏ lỡ các công cụ thiết kế web, trình tạo trang web và lưu trữ đám mây yêu thích của chúng tôi. Và hãy nhớ rằng, sự lựa chọn của bạn về nhà cung cấp dịch vụ lưu trữ web là rất quan trọng đối với sự thành công của trang web của bạn (hướng dẫn của chúng tôi sẽ hữu ích).
01. Hướng dẫn Sao chép & Dán
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Sao chép, dán hoặc xóa hướng dẫn khỏi bảng vẽ của bạn
Mỗi nhà thiết kế đều có mối quan hệ yêu / ghét với các hướng dẫn viên. Đôi khi chúng cực kỳ cần thiết và phần thời gian còn lại chúng chỉ cản đường bạn. Nếu bạn đang sử dụng hướng dẫn thay vì tùy chọn bố cục của Sketch, việc thay đổi chúng cho nhiều bảng vẽ có thể là một cơn ác mộng, nhưng với plugin này, bạn có thể dễ dàng sao chép, dán và xóa hướng dẫn khỏi tất cả các bảng vẽ của mình.
02. Trình dọn dẹp phác thảo
- Tải xuống ở đây
- Giá bán: $2
- Tóm lược: Làm cho các tệp thiết kế của bạn sạch sẽ như một chiếc còi
Bất kỳ thiết kế Sketch nào đã trải qua một vài lần lặp lại nhất định sẽ có một chút rác trong quá trình thực hiện, chẳng hạn như các lớp ẩn, vị trí đường viền không nhất quán và các kiểu lớp không được sử dụng.
Mặc dù không phải là ngày tận thế để có một tệp Sketch lộn xộn, nhưng nó có thể ảnh hưởng đến quá trình xử lý và nó sẽ giúp cuộc sống dễ dàng hơn cho bất kỳ ai hiểu rõ về nó. Thay vì xem xét mọi thứ bằng tay, hãy sử dụng Sketch Cleaner để tự động giải quyết tất cả các vấn đề phổ biến.
03. Anima
- Tải xuống ở đây
- Giá bán: Miễn phí trở lên
- Tóm lược: Tạo các nguyên mẫu đáp ứng, độ trung thực cao
Trước đây có sẵn dưới dạng các plugin miễn phí riêng biệt - Bố cục tự động và Bàn di chuột - Anima hiện là một plugin tất cả trong một được thiết kế để giúp bạn tạo bố cục đáp ứng với các ghim, ngăn xếp và đệm và các nguyên mẫu có độ trung thực cao phù hợp với tất cả các màn hình. Vẫn có một phiên bản miễn phí hỗ trợ một dự án; đối với các dự án không giới hạn, giá bắt đầu từ $ 25 mỗi tháng.
04. React Sketch.app
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Kết xuất các thành phần React vào Sketch
Quản lý tài sản thiết kế trong Sketch có thể khó khăn. Plugin Sketch tiện dụng này cung cấp một cách dễ dàng hơn, đáng tin cậy hơn để quản lý nội dung của bạn. Triển khai các thiết kế của bạn bằng mã dưới dạng các thành phần React, sau đó sử dụng plugin này để hiển thị chúng thành bản phác thảo. Nó cũng giúp tìm nạp và triển khai dữ liệu thực vào các tệp Sketch của bạn dễ dàng hơn.
React Sketch.app được Airbnb phát triển để sử dụng cho hệ thống thiết kế của mình, với mục đích giúp thu hẹp khoảng cách giữa nhà thiết kế và nhà phát triển.
05. Plugin Git Sketch
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Một ứng dụng khách Git được tích hợp vào Sketch
Plugin này nhằm mục đích đưa quyền kiểm soát phiên bản vào Sketch. Nó hoạt động bằng cách xuất hình ảnh cho mọi phần của thiết kế, sau đó tạo ra các khác biệt khá lớn để có thể biết rõ những thay đổi nào đã được thực hiện. Bằng cách ghi lại từng bước của quy trình thiết kế, mọi người trong nhóm có thể thấy quá trình thiết kế đã tiến triển như thế nào.
Git Sketch Plugin được tạo ra bởi Mathieu Dutour, người đã chuyển sang tạo ra một hệ thống kiểm soát phiên bản trả phí, toàn diện hơn được gọi là Kactus.
06. ImageOptim
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tối ưu hóa hình ảnh trong Sketch
Mặc dù Sketch cung cấp giải pháp riêng để tối ưu hóa tệp SVG, nhưng không có nhiều tùy chọn để nén hình ảnh JPG và PNG. Vì ImageOptim đã cung cấp một dịch vụ ổn định trong một số năm, nên việc đưa chức năng này vào Sketch là điều hợp lý.
Bất kỳ nhà thiết kế nào quan tâm đến thời gian tải và tối ưu hóa hình ảnh (đó là tất cả các nhà thiết kế) nên thêm ImageOptim vào hộp công cụ của họ. Lưu ý rằng cũng như plugin, bạn sẽ cần cài đặt ứng dụng ImageOptim cốt lõi (miễn phí) trên hệ thống macOS của mình và bạn vẫn cần đánh dấu các lớp là có thể xuất trong Sketch (điều hướng đến 'Xuất và Tối ưu hóa tất cả nội dung' để bắt đầu).
07. Gương thần
- Tải xuống ở đây
- Giá bán: Từ $ 4 / tháng
- Tóm lược: Công cụ chuyển đổi phối cảnh hình ảnh
Nếu bạn đang cố gắng tạo ra các mô hình sản phẩm ấn tượng nhưng phải tiếp tục nhảy vào Photoshop để đối phó với những thứ phức tạp, Magic Mirror có thể là một cứu cánh cho bạn. Đây là một công cụ chuyển đổi phối cảnh hình ảnh, cho phép bạn tạo mô hình phối cảnh và các hiệu ứng méo mó khác mà không cần rời Sketch.
08. Xuất nhiều hơn
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tự động tạo hình ảnh trình giữ chỗ
Thêm hình ảnh trình giữ chỗ vào thiết kế là một phần cần thiết của quá trình tạo mẫu, nhưng việc tìm kiếm hình ảnh thực tế có thể là một vấn đề khó khăn. Vì vậy, thay vì lãng phí bất kỳ thời gian nào vào nó, hãy để tất cả cho Day Player. Điều này cho phép bạn thêm hình ảnh trình giữ chỗ tùy chỉnh vào bất kỳ tài liệu Sketch nào, từ một số dịch vụ hình ảnh trình giữ chỗ khác nhau, vì vậy quyết định lớn nhất mà bạn phải đưa ra là bạn muốn sử dụng Bill Murray, Nicolas Cage hay mèo con.
11. Marketch
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tạo trang html có thể đo lường và nhận các kiểu CSS
Nếu bạn muốn truy xuất các kiểu CSS từ các thiết kế Sketch của mình thì một plugin như Marketch là hoàn toàn cần thiết. Nó cho phép bạn xuất các bản vẽ phác thảo của mình dưới dạng tệp zip chứa đầy tài liệu HTML mà sau đó bạn có thể trích xuất để lấy ra nhiều CSS hấp dẫn, sẵn sàng hoạt động.
12. Vòng tròn được phân đoạn
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tạo đồ họa hình tròn chính xác
Đây là một cách nhanh chóng để tạo các vòng tròn được phân đoạn cho các biểu đồ và sơ đồ. Plugin này có thể tạo ra nhiều kiểu sơ đồ hình tròn khác nhau bao gồm các vòng tròn có dấu gạch ngang và dấu tích, và độ dày được kiểm soát thông qua danh sách đơn giản các giá trị được phân tách bằng dấu phẩy.
13. Sketch Runner
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tiêu điểm cho tìm kiếm
Sketch rất được yêu thích vì quy trình làm việc bàn phím tối giản của nó. Điều đó đang được nói, luôn có hai hoặc ba phím tắt mà bạn dường như luôn quên hoặc nhầm lẫn với một ứng dụng thiết kế khác như Photoshop - và đừng quên những công cụ và tính năng ít phổ biến hơn không có phím tắt và ẩn sâu trong Menu phác thảo.
Sketch Runner giải quyết những vấn đề này và làm như vậy theo cách mà người dùng macOS quen thuộc - Sketch Runner là Spotlight của macOS, nhưng dành cho Sketch.
14. Phông chữ Biểu tượng
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Quản lý phông chữ biểu tượng
Phông chữ biểu tượng là một cách hiệu quả cao để sử dụng các biểu tượng trong thiết kế web của bạn mà không cần phải xuất và tối ưu hóa rất nhiều nội dung hình ảnh. Thông thường, chúng tôi tham chiếu các phông chữ biểu tượng trong đầu> của các trang web HTML, như chúng tôi làm với CSS và JavaScript. Tuy nhiên, việc sử dụng chúng trong Sketch phức tạp hơn một chút. Rất may, Icon Font làm cho nó dễ dàng.
Sau khi tải xuống và cài đặt Sketch IconFont, hãy tải xuống tệp phông chữ SVG hoặc tải xuống gói phông chữ này, bao gồm các tệp phông chữ cho FontAwesome, Biểu tượng thiết kế vật liệu, Biểu tượng ion và Biểu tượng dòng đơn giản. Khi bạn hoàn tất, hãy điều hướng đến Plugin> Icon Font> Install a Font-Bundle, chọn các phông chữ đã tải xuống từ hộp thoại Open File, sau đó điều hướng đến Plugins> Icon Font> Grid Insert> [font biểu tượng mong muốn của bạn] để chèn một biểu tượng.
Ngay cả khi bạn có ý định thiết kế một bộ biểu tượng tùy chỉnh cho thiết kế của mình, việc có các biểu tượng làm sẵn theo ý của bạn có thể giúp bạn tạo mẫu nhanh trong giai đoạn đầu của thiết kế, thêm một chút rõ ràng / trung thực hơn cho các mô hình có độ trung thực thấp của bạn .
15. Tìm và thay thế
- Tải xuống ở đây
- Giá bán: Miễn phí
- Tóm lược: Tìm và thay thế văn bản trong các lớp đã chọn
Trình chỉnh sửa văn bản không phải là nơi duy nhất bạn cần tìm và thay thế - nó cũng hữu ích trong Sketch. Plugin này có rất nhiều tùy chọn nâng cao và nó cho phép bạn tìm kiếm các bản sao của các từ hoặc cụm từ cụ thể trong văn bản trong các lớp đã chọn (và mọi thứ có bên trong), sau đó thay thế nó một cách dễ dàng.
Trang tiếp theo: Các plugin Sketch tiết kiệm thời gian hơn
