Làm sao để xây dựng một trang web có thiết kế tốt? Không nghi ngờ gì, học các kỹ năng lập trình tốt hoặc tìm kiếm các mẫu thiết kế đẹp là những bước cần thiết để xây dựng trang của bạn. Tuy nhiên, trong bài viết này, tôi giới thiệu một khía cạnh khác của thiết kế cũng sẽ rất cần thiết cho tất cả các nhà phát triển.
Thiết Kế Nguyên Tử là gì
Thiết kế nguyên tử là một khái niệm về cấu trúc thiết kế được đề xuất bởi Brad Frost. Ông so sánh các trang web với những thứ tự nhiên bao gồm các hạt mịn bằng cách chia một trang web thành 5 giai đoạn.
Các Nguyên Tử
Các trang web được tạo thành từ số lượng các yếu tố cơ bản như các nguyên tử không thể tách rời thành các đối tượng nhỏ hơn. Các yếu tố đơn giản nhất như thẻ HTML, nút hoặc trường đầu vào trong hầu hết các trường hợp không hữu ích lắm. Nhưng trong bối cảnh của một thư viện mẫu, chúng phục vụ như một tài liệu tham khảo cho phong cách toàn cầu của trang web của bạn.
Phân tử
Các phân tử được đặt lại với nhau từ các nguyên tử. Nút, đầu vào và nhãn chỉ hoạt động dưới dạng biểu mẫu khi chúng được kết hợp với nhau. Là một hợp chất của các nguyên tử, các phân tử có các tính chất độc đáo của riêng chúng và các chức năng hoạt động nhiều hơn. Nên duy trì các thành phần ở cấp độ này theo nguyên tắc trách nhiệm duy nhất: "làm một việc và làm tốt". Giữ chúng đơn giản, nhất quán và có thể tái sử dụng.
Sinh vật
Các sinh vật có thể bao gồm các phân tử tương tự hoặc khác nhau. Tiêu đề bao gồm các loại phân tử khác nhau như logo trang web, menu điều hướng và biểu mẫu tìm kiếm. Bên cạnh đó, một danh sách các sản phẩm trong các trang web thương mại điện tử bao gồm một loạt các lưới hình ảnh tương tự. Trong cả hai trường hợp, nhiều thành phần được tổ chức như một phần của giao diện người dùng xây dựng bối cảnh nơi khách hàng truy cập trang tìm kiếm đối tượng. Đối với các nhà thiết kế và nhà phát triển, việc cung cấp bối cảnh của UI được kết hợp một cách hữu cơ và giữ cho chúng độc lập, di động, có thể tái sử dụng là xứng đáng để tiêu hao năng lượng.
Các Khung Mẫu
Các thành phần chúng tôi đã tạo cho đến nay được tích hợp vào bối cảnh bố cục trang, một khung mẫu. Thoát khỏi sự tương đồng trừu tượng của hóa học, chúng ta nên sử dụng ngôn ngữ phù hợp để giao tiếp với các bên liên quan và khách hàng. Khung mẫu thể hiện cấu trúc cơ bản của trang web của chúng ta mà không có nội dung cụ thể. Chúng rất hữu ích cho chúng ta để kiểm tra, ví dụ, kích thước hình ảnh và độ dài ký tự về tỷ lệ hoặc tính nhất quán của trang.
Trang
Các trang là giai đoạn cuối cùng và cụ thể nhất của thiết kế nguyên tử như là một ví dụ được tạo từ các khung mẫu. Nội dung cụ thể được kết xuất động và đi kèm với bố cục. Mặc dù các trang cung cấp cho người dùng giao diện mà họ có thể tương tác, nhưng đó là nơi các nhà thiết kế và nhà phát triển có thể kiểm tra tính hiệu quả của thiết kế mẫu cũng như hệ thống thiết kế của chúng tôi.
Phần kết luận
Những bước này của thiết kế nguyên tử không phải là một cách tuyến tính đơn giản. Chúng ta có thể phải phối hợp các bước khác nhau bằng cách quay đi quay lại hoặc theo dõi sát sao chúng cùng một lúc. Theo B. Frost, "Một trong những lợi thế lớn nhất của thiết kế nguyên tử cung cấp là khả năng chuyển đổi nhanh chóng giữa trừu tượng và cụ thể." Cái nhìn sâu sắc của anh ấy cho chúng ta một mô hình tinh thần trong quá trình sáng tạo giữa các UI cuối cùng và các hệ thống thiết kế cơ bản của họ, và cũng là ngôn ngữ để thảo luận về chúng giữa các thành viên của một nhóm.