Cách xây dựng hệ thống thiết kế với một nhóm nhỏ

Minh họa bởi Chris Gilleard

Đêm qua, nhóm nhỏ của tôi và tôi đã bắt đầu làm một mạng nhỏ và tìm hiểu về Hệ thống thiết kế. Vì đó là từ thông dụng của năm 2017, chúng tôi rất háo hức tìm hiểu làm thế nào chúng ta có thể tự tạo ra.

Chúng tôi đã nghe tất cả những lợi ích tuyệt vời của việc tạo ra một hệ thống thiết kế: tiết kiệm thời gian, giảm tranh luận, hợp tác, áp dụng và nhiều hơn nữa. Tôi rất hào hứng!

Tất cả các cuộc nói chuyện về cách tạo ra một hệ thống thiết kế. Tuy nhiên, đây là những đội lớn hoặc họ có tài nguyên chuyên dụng, thậm chí là nhóm DesignOps (từ thông dụng thứ 2 năm 2017) để xây dựng và duy trì hệ thống thiết kế.

Vào cuối buổi tối, chúng tôi đã có một chút nản lòng. Nhưng chúng tôi không đơn độc. Trong buổi hỏi đáp, nhiều người đã hỏi:

Làm thế nào tôi có thể xây dựng một hệ thống thiết kế như một nhà thiết kế duy nhất?

Tôi là nhà thiết kế duy nhất, bạn có lời khuyên nào cho tôi?

Nhưng đội của tôi và tôi đã quyết định chúng tôi sẽ để điều này ngăn cản chúng tôi. Chúng tôi vẫn sẽ tạo ra hệ thống thiết kế của riêng mình. Trước khi tôi đi sâu vào vấn đề đó, ở đây, một chút nền tảng.

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

Một hệ thống thiết kế cung cấp một thư viện về phong cách trực quan, các thành phần và các mối quan tâm khác được tài liệu và phát hành bởi một cá nhân, nhóm hoặc cộng đồng dưới dạng mã và các công cụ thiết kế để việc áp dụng các sản phẩm có thể hiệu quả và gắn kết hơn.

Nói một cách đơn giản, một hệ thống thiết kế là một tập hợp các thành phần có thể tái sử dụng để gắn kết toàn bộ sản phẩm lại với nhau.

Nhiều người đã viết các bài báo và sách chuyên sâu về các hệ thống thiết kế. Dưới đây là một số bạn có thể thấy hữu ích:

Hướng dẫn phong cách so với hệ thống thiết kế

Có thể bạn đang nghĩ, thật tuyệt nhưng chỉ là một hướng dẫn phong cách?

Hướng dẫn phong cách là một tạo tác của quá trình thiết kế. Một hệ thống thiết kế là một sản phẩm sống, được tài trợ với lộ trình & tồn đọng, phục vụ một hệ sinh thái.

Ngoài ra, một hệ thống thiết kế là một loạt các thành phần (hoặc phân tử) có kích thước khác nhau có thể được kết hợp với nhau theo những cách vô tận để tạo ra một loạt các thành phần lớn hơn. Brad Frost khuyết nguyên tử thiết kế là nguồn cảm hứng cho thiết kế thành phần.

Lợi ích của hệ thống thiết kế

Thử thách mà chúng ta gặp phải ngày nay là các công cụ không giao tiếp với nhau rất tốt, các chi tiết rơi vào vết nứt, có một khoảng cách lớn giữa thiết kế và kỹ thuật và chúng ta cần thực hiện nhiều công việc thủ công để đảm bảo chúng ta luôn luôn trên tất cả mọi thứ.

Là một nhóm nhỏ làm việc trên phần mềm doanh nghiệp B2B, chúng tôi đã đi sâu vào việc tạo ra một hệ thống thiết kế với thời gian, ngân sách và nguồn lực hạn chế. Tôi muốn nhắc nhở nhóm của chúng tôi về những lợi ích.

Nhìn chung, nhóm của chúng tôi sẽ tiết kiệm thời gian vì:

  • Giảm tranh luận - Không cần lãng phí thời gian để xem xét lại các quyết định thiết kế cho cùng một thành phần
  • Linh kiện tái sử dụng làm cho quy mô có thể
  • Tăng cường hợp tác - cải thiện làm việc từ xa và trong các văn phòng khác nhau

Tôi có một lý do ích kỷ cho việc muốn xây dựng một hệ thống thiết kế. Tôi nhanh chóng nhận ra, nếu thành công, chúng tôi có thể tự động hóa nhiều nhiệm vụ cho phép chúng tôi có thời gian để làm điều gì đó tôi yêu thích, giải quyết các vấn đề của người dùng! Đó là cốt lõi của UX.

Thiết kế cấu trúc hệ thống

Để tạo ra một hệ thống thiết kế, chúng ta cần chia nhỏ nó và hiểu các phần của nó:

Pin UX - Hệ thống thiết kế

Một chút tìm kiếm linh hồn cũng được tham gia. Một số câu hỏi khi tạo một hệ thống thiết kế:

  • Làm thế nào để hệ thống làm việc ngày hôm nay và trong tương lai?
  • Tầm nhìn của chúng ta là gì?
  • Những vấn đề chúng ta đang cố gắng giải quyết?
  • Vấn đề này ảnh hưởng đến ai nhất?
  • Những tác động nào chúng ta muốn một hệ thống thiết kế có ảnh hưởng đến cách chúng ta làm việc?

Làm thế nào những người khác đang cố gắng tiếp cận điều này:

Làm thế nào nhóm nhỏ của chúng tôi có thể làm cho một hệ thống thiết kế?

Bạn bắt đầu từ đâu khi bạn don có đủ tài nguyên, thời gian hay ngân sách?

1. Don mệnh bắt đầu lại từ đầu

Nếu bạn muốn làm bánh táo từ đầu, trước tiên bạn phải phát minh ra vũ trụ.

Nhóm của chúng tôi đang xem xét các hệ thống thiết kế hiện có ngoài tự nhiên để chúng tôi có thể - như Austin Kleon nói:

Ăn cắp thích và Nghệ sĩ - Austin Kleon

Nhiều công ty đã công khai hệ thống thiết kế của họ và thậm chí đã chia sẻ các tệp phác thảo. Tôi đã chia sẻ một danh sách dưới đây. Thực tế này, và nhiều tài nguyên phác họa khác, làm cho nó không có trí tuệ để sử dụng Phác thảo làm công cụ lựa chọn của chúng tôi.

Ngoài ra, có những công cụ có thể giúp bạn nhanh chóng tạo đường cơ sở cho hệ thống thiết kế của bạn:

2. Biết những gì bạn làm việc với

Chúng tôi đã quyết định rằng phải hoàn thành Kiểm toán giao diện người dùng của tất cả các trang web và tài sản của chúng tôi. Chúng tôi có thể phải gọi một vài ưu đãi để thực hiện điều này. Nhưng vì nó chỉ là tài liệu cho những gì tồn tại, nên tranh thủ sự giúp đỡ từ những người khác có thể không quá khó khăn. Điều này sẽ tốn thời gian, nhưng cuối cùng nó sẽ có giá trị. Chúng tôi sẽ có thể thiết kế toàn diện khi tạo các thành phần mới.

Điều này có thể hữu ích cho việc học cách tiến hành kiểm toán UI:

3. Xây dựng khi bạn đi

Một hệ thống thiết kế là một tài liệu sống. Nhận ra rằng công việc không bao giờ được thực hiện, chúng tôi quyết định nhảy vào và xây dựng khi chúng tôi đi. Khi chúng tôi lặp đi lặp lại các dự án của mình, chúng tôi sẽ thiết kế với các thành phần trong tâm trí và cuối cùng sẽ có một hệ thống thiết kế. May mắn thay, có một vài người trong số chúng tôi, cho phép chúng tôi hợp tác và trộm ăn trộm nhau.

Mẹo nhanh: Xây dựng các biểu tượng trong Phác thảo. Tôi biết, nó có vẻ tốn thời gian, nhưng một khi bạn thấy sức mạnh của các biểu tượng, bạn sẽ đánh giá cao câu nói cũ:

Bạn phải đi chậm để đi nhanh.

4. Biết giới hạn của bạn

Khởi đầu nhỏ.

Một số hệ thống thiết kế bao gồm các đoạn mã. Đó là mục tiêu cuối cùng, bởi vì nó sẽ tăng sự chấp nhận trên toàn công ty và tạo ra trải nghiệm người dùng nhất quán. Tuy nhiên, đội nhỏ của tôi có thể làm được điều đó. Chưa, đó là.

Chúng tôi đang lên kế hoạch để bắt đầu với một tập tin phác thảo của các thành phần đơn giản. Khi chúng tôi đủ xa, chúng tôi sẽ làm việc với các nhà phát triển frontend của chúng tôi để tạo CSS. Việc cho phép các nhà phát triển sử dụng ‘vũ khí lựa chọn của họ khi nói đến mã có thể cho phép hệ thống thiết kế tồn tại. Và với các cơ sở mã thay đổi trên những gì dường như là một cơ sở hàng ngày, giữ cho chúng ta tránh xa nó có thể là tốt nhất.

5. Giữ ngăn nắp

Nghe có vẻ đơn giản, nhưng với các dự án chồng chất và sắp hết thời hạn, sẽ dễ dàng thực hiện mọi việc hơn, cách thức nhanh chóng và bẩn thỉu. Giữ tổ chức sẽ mất thời gian và không bao giờ được thực hiện, nhưng nó giữ cho mọi người tỉnh táo và làm giảm email hoặc làm chậm sự lộn xộn của các tập tin bay qua lại. Khi chúng tôi bắt đầu làm việc với những thứ mới bằng cách sử dụng bộ giao diện người dùng mà chúng tôi sẽ xây dựng với một trong những công cụ được liệt kê ở trên, chúng tôi cần theo dõi. Nếu không, chúng tôi sẽ kết thúc nơi chúng tôi bắt đầu - phong cách khác nhau ở mọi nơi!

Phiên bản tài liệu thiết kế là một giấc mơ cho tất cả các nhà thiết kế. Không một sản phẩm nào nhận được đúng 100%. Chúng tôi sẽ cung cấp cho Tóm tắt và Plant thử xem làm thế nào nó có thể giúp chúng tôi đi đúng hướng. Làm việc cho một doanh nghiệp, nền tảng trực tuyến duy nhất chúng tôi có thể sử dụng để lưu trữ tệp là One Drive. Google drive và Dropbox là những lựa chọn khác nếu bạn không bị hạn chế.

Đây là những bước đầu tiên mà nhóm của tôi và tôi sẽ cố gắng khi bắt đầu hành trình này. Ngón tay vượt qua chúng tôi làm một số đầu. Tôi rất thích nghe từ các đội nhỏ khác, thậm chí là ‘đội một người, để tìm hiểu cách họ giải quyết thử thách này.

Thiết kế thư mục hệ thống

Như đã hứa, đây là một số hệ thống thiết kế để lấy cảm hứng hoặc cho trộm ăn cắp như một nghệ sĩ:

Thư viện mẫu / Hướng dẫn phong cách

Nếu bạn thấy điều này hữu ích, bạn biết phải làm gì bây giờ. Theo dõi tôi để có thêm bài viết và hướng dẫn về nguồn cấp dữ liệu của bạn.