Hệ thống thiết kế là gì?

Ảnh chụp màn hình thiết kế Material Design của Google

Hệ thống thiết kế là gì?

Hệ thống thiết kế là một thư viện gồm các thành phần và nguyên tắc có thể tái sử dụng mà mọi người trong công ty có thể kết hợp thành các giao diện và tương tác. Những gì đi vào một hệ thống thiết kế và cách nó được thực hiện có thể khác nhau khá nhiều giữa các công ty, tùy thuộc vào quy mô và mức độ trưởng thành của thực hành thiết kế và nhu cầu của nhóm sản phẩm. 

Về cốt lõi, hệ thống thiết kế cung cấp các nguyên tắc tạo kiểu và tương tác nhất quán cho các nhóm. Ví dụ, một hệ thống thiết kế có thể có:

  • các phần tử tiêu chuẩn, như hộp nhập liệu, danh sách thả xuống và cấu trúc menu, để sử dụng trong giao diện.
  • danh sách các màu và phông chữ thương hiệu đã được phê duyệt, cùng với hướng dẫn về thời điểm sử dụng chúng.
  • các nút tiêu chuẩn và các khả năng tương tác khác.
  • hướng dẫn tương tác, chẳng hạn như sử dụng bảng điều khiển bên ngoài hoặc hỗ trợ mở rộng tính năng chụm để thay đổi kích thước hình ảnh.
  • một hệ thống lưới linh hoạt để các màn hình được bố trí nhất quán, bao gồm những thứ như kiểu thẻ hoặc dấu phân tách nội dung.
  • quy tắc về vị trí của các đối tượng nhất định – ví dụ: luôn giữ biểu tượng đăng nhập / đăng xuất và hồ sơ ở góc trên cùng bên phải của màn hình.
  • danh sách các biểu tượng và ý nghĩa của chúng.
  • hướng dẫn nội dung nêu rõ cách thức và thời điểm sử dụng nội dung – ví dụ: tất cả các mục trong menu phải là động từ hay danh từ hoặc liệu công ty đề cập đến người dùng ở ngôi thứ nhất hay thứ hai.
  • quy tắc về thời điểm sử dụng biểu tượng và khi nào sử dụng văn bản làm nhãn.
  • hướng dẫn trực quan về vị trí của một số loại nút gọi hành động.
  • quy tắc về việc có nên sử dụng những thứ như tự động lưu hay nút lưu / hủy rõ ràng hay không.

Có nhiều hướng dẫn khác mà một hệ thống thiết kế có thể có. Material Design của Google là một ví dụ về một hệ thống thiết kế khá nhất quán với rất nhiều loại phần tử khác nhau và có khá nhiều hướng dẫn về thời điểm và cách sử dụng từng phần tử. 

Ảnh chụp màn hình thiết kế Material Design của Google
Material Design của Google là một tài liệu tham khảo tuyệt vời về thiết kế toàn diện trông như thế nào và những ưu điểm mà nó mang lại.
© Google, Sử dụng Hợp pháp

Hệ thống thiết kế cũng có thể được tạo cho các công cụ không có yếu tố hình ảnh đối với chúng, chẳng hạn như hệ thống điều khiển bằng giọng nói. Tất nhiên, chúng sẽ có một bộ tính năng khác tập trung hơn vào những thứ như nội dung và hành vi, nhưng chúng có thể hữu ích như nhau. 

Điều quan trọng nhất cần biết về hệ thống thiết kế là những hệ thống hiệu quả nhất tiếp tục phát triển và thay đổi khi nhu cầu của một sản phẩm hoặc bộ sản phẩm thay đổi. Ngoài ra, các hệ thống thiết kế chỉ có hiệu quả khi việc sử dụng chúng được ủy quyền. 

Lý tưởng nhất, các phần tử khác nhau của một hệ thống thiết kế thực sự là các đoạn mã mà các nhà phát triển có thể đưa vào các giao diện để xây dựng một tính năng nhanh hơn hoặc nguyên mẫu nhanh hơn. Những lần khác, chúng chỉ đơn giản là thiết kế các phần tử trong một công cụ tạo mẫu mà các nhà thiết kế có thể sử dụng lại. 

Ưu điểm của Hệ thống thiết kế

Hệ thống thiết kế, khi được thực hiện đúng cách, sẽ tăng tốc quá trình thiết kế lên một chút. Họ cũng làm cho nó để các nhà thiết kế và phần còn lại của nhóm sản phẩm có thể tập trung nhiều hơn vào luồng và logic của một tính năng hoặc màn hình mới hơn là thiết kế trực quan. 

Không phải là thiết kế hình ảnh không quan trọng! Nó có thể. Nhưng hệ thống thiết kế có nghĩa là chúng ta không phải thiết kế từng yếu tố riêng lẻ trên mỗi màn hình bằng tay từ đầu. Điều đó cũng có nghĩa là, khi chúng tôi đưa ra một yếu tố giao diện mới, nó có thể được chia sẻ bởi toàn bộ nhóm thiết kế một cách hiệu quả. 

Nếu được sử dụng đúng cách, các hệ thống thiết kế khuyến khích tính nhất quán hơn trong các giao diện của chúng tôi. Các nút kêu gọi hành động luôn được tạo kiểu giống nhau và đặt ở cùng một vị trí trên các màn hình khác nhau, vì vậy người dùng không phải tìm kiếm mọi thứ. Menu hoạt động nhất quán, vì vậy người dùng không bị lạc. Trên thiết bị di động, các cử chỉ giống nhau hoạt động theo cùng một cách từ màn hình này sang màn hình khác.  

Hình minh họa của một nhà thiết kế đang xem xét bảy kiểu nút Lưu khác nhau và nói: Chúng tôi không cần sáu kiểu nút này!
Hệ thống thiết kế có thể giúp bạn đạt được sự nhất quán trong thiết kế của mình, giúp bạn tránh phải đau đầu khi cần sử dụng lại các kiểu hoặc cập nhật một kiểu cụ thể.
© Daniel Skrok và Tổ chức thiết kế tương tác, CC BY-SA 3.0

Tìm hiểu thêm về Hệ thống thiết kế

Bạn có thể tìm hiểu thêm về hệ thống thiết kế cũng như các phương pháp và kỹ thuật khác được sử dụng bởi các nhóm nhanh nhẹn tại đây: https://www.interaction-design.org/courses/ux-management-strategy-and-tactics

Blog Thiết kế Bên trong cung cấp hướng dẫn toàn diện về Hệ thống Thiết kế:
https://www.invisionapp.com/inside-design/guide-to-design-systems/

Khám phá Thiết kế Vật liệu của Google để xem toàn bộ tiềm năng của Hệ thống Thiết kế:
https://material.io/

Xem thêm các ví dụ về Hệ thống thiết kế tại đây:
https://uxdesign.cc/10-great-design-systems-and-how-to-learn-and-steal-from-them-4b9c6f168fa6?gi=94f3c15a3eef

Tìm hiểu thêm về Hệ thống thiết kế

Tìm hiểu sâu hơn về Hệ thống thiết kế với khóa học Phương pháp nhanh cho thiết kế UX của chúng tôi .

Agile, bằng hình thức này hay hình thức khác, đã tiếp quản thế giới phát triển phần mềm và sẵn sàng chuyển sang hầu hết các ngành khác. Vấn đề là rất nhiều nhóm và tổ chức tự gọi mình là “nhanh nhẹn” dường như không có nhiều điểm chung với nhau. Điều này có thể cực kỳ khó hiểu đối với một thành viên mới trong nhóm, đặc biệt nếu trước đây bạn đã từng làm việc trong một nhóm “nhanh nhẹn” có định nghĩa hoàn toàn khác về “sự nhanh nhẹn”!

Kể từ khi phát hành Tuyên ngôn Agile vào năm 2001, các phương pháp luận nhanh nhẹn hầu như không được công nhận trong nhiều tổ chức, ngay cả khi chúng đã trở nên cực kỳ phổ biến. 

Để hiểu những thách thức trong thế giới thực và các phương pháp hay nhất để làm việc dưới sự ràng buộc của các nhóm nhanh nhẹn, chúng tôi đã nói chuyện với hàng trăm chuyên gia có kinh nghiệm làm việc trong môi trường nhanh nhẹn. Nghiên cứu này đã giúp chúng tôi tạo ra các Phương pháp Agile cho Thiết kế UX .

Trong khóa học này, chúng tôi mong muốn cho bạn thấy nhanh nhẹn thực sự là gì và các phương pháp luận nhanh nhẹn có thể áp dụng cho thiết kế chặt chẽ như thế nào. Bạn sẽ học cả lý thuyết và cách triển khai trong thế giới thực của nhanh nhẹn, các hương vị khác nhau của nó và cách bạn có thể làm việc với các phiên bản khác nhau của các nhóm nhanh nhẹn.

Bạn sẽ tìm hiểu về các nguyên tắc chính của sự nhanh nhẹn, ví dụ về các đội thực hiện tất cả các “nghi thức” nhanh nhẹn nhưng không thực sự nhanh nhẹn và ví dụ về các đội bỏ qua các nghi lễ nhưng thực sự thể hiện tinh thần.

Bạn sẽ học về các kỹ thuật nhanh cụ thể để nghiên cứu và thiết kế, chẳng hạn như thiết kế những thứ nhỏ hơn, thực hành khám phá liên tục, cấu trúc lại thiết kế và lặp lại.

Bạn cũng sẽ nhận được những lời khuyên thiết thực để làm việc tốt hơn với nhóm của bạn và cải thiện các quy trình tại công ty của bạn để bạn có thể nhận được một số lợi ích của sự nhanh nhẹn thực sự.

Khóa học này hướng đến những người đã biết cách thiết kế hoặc nghiên cứu (hoặc những người muốn làm việc với các nhà thiết kế và nhà nghiên cứu) nhưng những người muốn học cách vận hành tốt hơn trong một môi trường cụ thể. Có rất nhiều công cụ mà các nhà thiết kế sử dụng trong một môi trường nhanh nhẹn không khác gì các công cụ mà họ sẽ sử dụng ở bất kỳ nơi nào khác và chúng tôi sẽ không đề cập đến cách sử dụng các công cụ đó nói chung, nhưng chúng ta sẽ nói về cách phân phối nhanh nhẹn có thể khác với những bạn sẽ tìm thấy ở một nhóm UX truyền thống hơn. 

Người hướng dẫn khóa học của bạn là chuyên gia thiết kế trải nghiệm người dùng và quản lý sản phẩm, Laura Klein. Laura là tác giả của Xây dựng Sản phẩm và UX tốt hơn cho các công ty khởi nghiệp tinh gọn và là người đồng tổ chức podcast Điều gì sai với UX?

Với hơn 20 năm kinh nghiệm trong lĩnh vực công nghệ, Laura chuyên giúp các công ty đổi mới một cách có trách nhiệm và cải thiện quy trình phát triển sản phẩm của họ, và cô ấy đặc biệt thích làm việc với các công ty khởi nghiệp tinh gọn và các nhóm phát triển nhanh nhẹn.

Trong khóa học này, bạn cũng sẽ được nghe từ các chuyên gia trong ngành Teresa Torres (Huấn luyện viên Khám phá Sản phẩm tại Product Talk), Janna Bastow (Giám đốc điều hành và Đồng sáng lập của ProdPad) và Adam Thomas (nhà chiến lược và tư vấn quản lý sản phẩm).

Start typing and press Enter to search

Shopping Cart