Trong bài hướng dẫn này, bạn sẽ sử dụng một thiết kế giỏ hang mua sắm điện thoại di động để thực hành hai tính năng rất quan trọng trong Sketch. Chúng ta sẽ chú ý đến “ biểu tượng “ và “phác thảo chung “.
Sketch biểu tượng
Biểu tượng cho phép bạn sao chép các thành phần thiết kế của bạn và được phép tái sử dụng chúng. Bất kỳ thay đổi nào của bạn sẽ được phản ánh trên tất cả các trường hợp của biểu tượng đó.
Để tạo ra một biểu tượng với một cụm các biểu tượng được chọn. Nhấn vào “ Create Symbol”
Có hai hướng dẫn quan trọng để sự dụng hiệu các biểu tượng. Đầu tiên, hãy đảm bảo rằng các biểu tượng không quá khó hiểu. Hãy lấy ví dụ về biểu tượng trên phần tiêu đề như hình dưới:
Bạn sẽ thấy phông nề, thanh trạng trái, các nhãn tiêu đề và biểu tượng, tất cả được hiển thị đầy đủ trong thư mục con trong phạm vị các biểu trượng trên “header-bar”.
Thanh tiến trình (the progress bar) sẽ không được bao gồm trong các thanh biểu tượng bởi vì thanh trạng thái nó thay đổi trên mỗi màn hình .
Việc thứ hai là để kiểm tra các tùy chọn không bao gồm các văn bản giá trị từ biểu tượng của mỗi lớp văn bản. Bằng cách này có thể chỉnh sửa văn bản trong những biểu tượng đôi trên nền tảng cá nhân.
Sketch phác thảo chung
Các “ shared styles” là tính năng thẳng về phía trước như “ biểu tượng”. Nó rất hữu ích về sự thay đổi cho sự xuất hiện của nhiều yếu tố qua biểu tượng khác nhau và các đối tượng chỉ trong lần nhấp chuột duy nhất. Hãy nhìn vào tiêu đề và thanh tiến trình một lần nũa. ở đây bạn có thể thấy thay đổi nền của thanh tiến trình nhưng nó vẫn chưa cân xứng với nền tiêu đề.
Để tránh việc thay đổi mỗi nền thanh tiến trình đơn bằng tay, có thể thiết lập môt phong cách chung. Ở đây, chúng ta đang áp dung kiểu header-gb mà tôi đã chuẩn bị trước đó, bằng cách nhấn “ create new shared “ cho đến khi thanh nền tiêu đề được chọn.
Kết luận
Với hai tính năng trên trong bộ công cụ của bạn, thiết kế ứng dụng giao diện người dùng của bạn trên Sketch sẽ tiết kiệm được thời gian hơn rất nhiều.