Trước khi ra mắt: lên kế hoạch thiết kế UI/UX cho sản phẩm Web3

Điều gì nên có trong một cuộc trao đổi thiết kế riêng tư?

Một cuộc trao đổi đầu tiên hữu ích sẽ xác định sản phẩm, người dùng và hành trình quan trọng nhất. Bạn không cần một đặc tả hoàn chỉnh; một mô tả rõ ràng về nhiệm vụ của người dùng sẽ cho chúng tôi một điểm bắt đầu thực tế.

Một người liên hệ được chỉ định từ Premium Promotions điều phối cuộc thảo luận và giữ các tài liệu làm việc ở chế độ riêng tư. Trước khi bắt đầu công việc giao diện, chúng tôi xác nhận ai có thể xem các tệp, ai tổng hợp phản hồi và quyết định nào cần có sự phê duyệt bằng văn bản của bạn. Không có gì được chia sẻ ngoài nhóm dự án đã thỏa thuận nếu không có sự chấp thuận của bạn.

Một ghi chú chuẩn bị ngắn có thể bao gồm:

• Mô tả về sản phẩm và người dùng dự kiến.
• Hành động chính mà người dùng cần hoàn thành.
• Các màn hình hiện có, nguyên mẫu hoặc sản phẩm staging, nếu có.
• Các ràng buộc kỹ thuật và người chịu trách nhiệm phê duyệt.

Điều này đủ để phân biệt một hành trình đơn lẻ với một hệ thống giao diện rộng hơn. Nếu sản phẩm đã có nhận diện hình ảnh, chúng tôi có thể làm việc trong khuôn khổ đó. Các vấn đề liên quan về thiết kế và hình ảnh có thể được xem xét cùng với giao diện, nhưng vẫn là một quyết định riêng.

Một tệp làm việc riêng tư, với các quyết định được giữ ở chế độ hiển thị

Tệp làm việc cung cấp cho các đồng nghiệp về sản phẩm, thiết kế và kỹ thuật một nơi để xem xét cùng một hành trình. Nó tập hợp các ghi chú nghiên cứu, luồng người dùng, wireframe và các trạng thái giao diện khi thiết kế hình thành.

Chúng tôi giữ các bản nháp đầu tiên trong nhóm dự án đã thỏa thuận. Bạn thấy hướng đi được đề xuất trước khi nó được coi là đã duyệt; phê duyệt bằng văn bản ghi lại các quyết định sẽ hướng dẫn giai đoạn tiếp theo. Tệp cũng có thể ghi chú các câu hỏi mở cho trưởng bộ phận sản phẩm hoặc kỹ thuật của bạn, để sự không chắc chắn được hiển thị thay vì ẩn bên trong các màn hình trau chuốt.

Việc xem xét có thể bao gồm:

• Nghiên cứu người dùng và đánh giá đối thủ cạnh tranh để hiểu bối cảnh.
• Các luồng hiển thị quyết định, nhánh và đường quay lại.
• Wireframe để xác định cấu trúc trước khi tinh chỉnh hình ảnh.
• Các thành phần giao diện và ghi chú cho các hành trình người dùng đã thỏa thuận.
• Một nguyên mẫu có thể click để xem trước.

Nhóm của bạn có thể xem xét từng phần trong bối cảnh thay vì nhận một chồng các màn hình không được giải thích. Đối với ngôn ngữ hỗ trợ, copywriter Web3 có thể đi kèm với công việc giao diện. Người liên hệ được chỉ định giữ sự phối hợp đó một cách kín đáo và chuyển các quyết định đến đúng người xem xét.

Các hành trình wallet và giao dịch, được xem xét trong bối cảnh

Các hành trình Web3 cần làm cho hành động tiếp theo và ý nghĩa của nó trở nên dễ hiểu trước khi người dùng tiến hành. Chúng tôi ánh xạ trình tự trước, sau đó hiển thị cách giao diện phản hồi tại từng điểm liên quan.

Đối với kết nối wallet, thiết kế có thể giải thích lý do tại sao kết nối được yêu cầu và điều gì xảy ra tiếp theo. Đối với một giao dịch, sản phẩm có thể cần một bước xem xét rõ ràng, trạng thái đang chờ, thông báo hoàn thành hoặc đường khôi phục. Onboarding cho những người mới làm quen với crypto được hưởng lợi từ ngôn ngữ giải thích hành động mà không giả định sự quen thuộc trước đó. Các thông báo lỗi nên giúp người dùng hiểu bước tiếp theo có sẵn.

Một nguyên mẫu hữu ích làm cho quyết định trở nên rõ ràng trước khi sản phẩm được xây dựng.

Nguyên mẫu là một công cụ hỗ trợ trao đổi làm việc, không phải là sự thay thế cho việc triển khai. Chúng tôi mời những người xem xét từ bộ phận sản phẩm và kỹ thuật kiểm tra các trạng thái chính trong khi các thay đổi vẫn dễ dàng thảo luận. Nếu sản phẩm cũng cần một lời giải thích công khai về mục đích của nó, tạo nội dung Web3 có thể hỗ trợ công việc đó mà không làm lu mờ các quyết định giao diện.

Các bàn giao Figma, được sắp xếp xung quanh hành trình đã thỏa thuận

Bàn giao Figma kết nối các màn hình đã duyệt với các luồng và thành phần đằng sau chúng. Chúng tôi thống nhất các bàn giao xung quanh các hành trình đã chọn, để tệp vẫn hữu ích cho những người xây dựng sản phẩm.

Nội dung chính xác tuân theo phạm vi thiết kế đã được phê duyệt. Khi thích hợp, bàn giao có thể hiển thị kết nối wallet, các hành động đang chờ, hoàn thành và phản hồi lỗi. Chúng tôi sắp xếp tệp Figma để các nhà phát triển có thể kiểm tra cách các màn hình liên quan với nhau, đồng thời làm rõ các câu hỏi sản phẩm chưa được giải quyết. Nếu cùng một nhóm đang chuẩn bị các truyền thông rộng hơn, mạng xã hội và nội dung có thể được phối hợp riêng.

Một nhịp độ xem xét có cấu trúc, với các ranh giới rõ ràng

Một nhịp độ xem xét có cấu trúc giúp các founder và trưởng bộ phận sản phẩm đưa ra quyết định mà không cần phải giải thích các màn hình không rõ ràng. Người liên hệ được chỉ định giữ một cuộc trao đổi mở, tập hợp phản hồi đã tổng hợp và ghi lại những thay đổi nào đã được bạn phê duyệt.

Chúng tôi thường thiết lập 2 điểm xem xét: một cho hành trình đã được ánh xạ và một cho hướng hình ảnh hoặc nguyên mẫu. Nhóm của bạn có thể xác định người ra quyết định ngay từ đầu, sau đó xem xét hành vi cũng như hình thức. Thời gian được thống nhất sau khi số lượng hành trình, nhu cầu nghiên cứu và sắp xếp xem xét đã rõ ràng. Các dịch vụ mạng xã hội và nội dung có thể được phối hợp với công việc sản phẩm, nhưng không làm thay đổi các quyết định thiết kế.

Một thiết kế có thể ghi lại hành vi sản phẩm mà nhóm của bạn kiểm soát, nhưng nó không thể xác định cách một wallet bên ngoài trình bày xác nhận hoặc cách các điều kiện mạng ảnh hưởng đến thời gian và phí giao dịch. Chúng tôi đánh dấu các phụ thuộc đó để xác thực kỹ thuật thay vì coi chúng là hành vi giao diện đã được giải quyết.

Ghi chú thiết kế đầu tiên và ba quyết định tiếp theo

Một ghi chú ngắn về hành trình bạn muốn cải thiện là một khởi đầu đủ tốt. Sau khi nghe từ bạn, người liên hệ được chỉ định chuẩn bị một bản đồ hành trình đầu tiên, với người dùng dự kiến, hành động chính và các ràng buộc đã biết được tập hợp tại một nơi.

Sau đó, trao đổi ban đầu sẽ giải quyết ba quyết định:

1. Hành trình bắt đầu: nơi người dùng bắt đầu và những gì họ cần hoàn thành.
2. Vòng xem xét: ai có thể xem xét các bản nháp và cung cấp phản hồi tổng hợp.
3. Bàn giao đầu tiên: liệu công việc nên bắt đầu bằng nghiên cứu, một luồng, một nguyên mẫu hay một hệ thống giao diện rộng hơn.

Trình tự đó giữ cho cuộc thảo luận mở đầu kín đáo và thực tế. Bạn giữ quyền phê duyệt hướng đi trước khi các bản nháp giao diện tiến triển. Nếu có sẵn tài liệu thương hiệu hoặc màn hình hiện có, người liên hệ có thể đưa chúng vào bản đồ ban đầu; nếu không, cuộc trao đổi có thể xác định những gì vẫn cần thiết. Một ghi chú ngắn nêu tên hành trình được hoan nghênh và người liên hệ được chỉ định của bạn sẽ chuẩn bị bản đồ đầu tiên đó cho một cuộc thảo luận riêng tư.

Cách hoạt động

1. Chia sẻ bối cảnh sản phẩmMô tả sản phẩm, người dùng và hành trình đang được xem xét. Các màn hình hiện có và ràng buộc kỹ thuật đã biết có thể giúp thiết lập bối cảnh.
2. Thống nhất phạm vi thiết kếNgười liên hệ được chỉ định làm rõ những hành trình, người xem xét và bàn giao nào thuộc về công việc. Bạn phê duyệt hướng đi trước khi các bản nháp giao diện tiến hành.
3. Ánh xạ và tạo nguyên mẫu hành trìnhChúng tôi phát triển các luồng, wireframe và thiết kế hình ảnh, sau đó kết nối các màn hình đã thỏa thuận trong một nguyên mẫu Figma có thể click.
4. Xem xét và bàn giaoNhóm của bạn kiểm tra các trạng thái chính, cung cấp phản hồi tổng hợp và nhận các tệp Figma đã thỏa thuận với ghi chú triển khai.