Desain UI/UX Web3 yang dibangun di sekitar tugas produk

Apa yang diungkapkan peta tugas Web3 sebelum layar digambar?

Peta tugas menunjukkan di mana pengguna membuat keputusan, memberikan informasi, atau meninggalkan produk. Ini memberi tim struktur yang dapat ditinjau sebelum wireframe dan gaya visual dimulai.

Kami mulai dengan audiens, tujuan produk, dan bukti yang ada. Itu dapat mencakup layar yang ada, prototipe, pertanyaan dukungan, dan kendala teknis yang diketahui. Peta alur menggunakan 4 titik pemeriksaan: masuk, keputusan, respons, dan pemulihan. Untuk setiap tugas, kami mencatat 6 bidang: tujuan pengguna, titik awal, informasi yang diperlukan, tindakan wallet, respons antarmuka, dan asumsi yang belum terpecahkan. Catatan ini mengungkap langkah yang hilang tanpa menganggap keakraban blockchain sebagai sesuatu yang pasti.

Peta ini berguna untuk dApp baru maupun antarmuka yang sudah ada. Untuk desain ulang, ini membedakan interaksi yang membingungkan dari aturan produk. Aturan itu mungkin memerlukan keputusan tim. Untuk produk baru, ini membantu pemangku kepentingan menyepakati apa yang harus dipahami pengguna pertama kali sebelum melanjutkan.

Bawalah deskripsi produk singkat, target pengguna, tugas prioritas, dan umpan balik pengguna yang tersedia. Jika visual yang menghadap publik juga perlu dikerjakan, hubungkan lingkup antarmuka dengan desain dan visual.

Status wallet dan transaksi mana yang memerlukan keputusan antarmuka?

Tinjauan status wallet membuat urutan yang terlihat oleh pengguna menjadi eksplisit: permintaan, keputusan, respons tertunda, konfirmasi, atau error. Desain harus memberi tahu pengguna apa yang terjadi dan tindakan apa yang masih tersedia.

Kami memetakan langkah koneksi bersamaan dengan tugas produk. Kemudian kami meninjau detail transaksi, pesan gas, umpan balik tertunda, konfirmasi keberhasilan, dan pemulihan error jika relevan. Layar harus menyatakan tindakan pengguna yang diminta. Layar harus menunjukkan apa yang diketahui antarmuka sekarang. Layar harus menunjukkan tindakan selanjutnya yang tersedia. Kami menandai celah di mana teks iklan produk atau perilaku teknis masih belum diputuskan.

Untuk tinjauan, kelompokkan layar menjadi 3 set: sebelum tindakan wallet, selama respons, dan setelah respons. Ini memudahkan tim produk dan teknik untuk menemukan status yang hilang. Pengujian kegunaan kemudian memiliki tugas konkret untuk diamati. Ini menghindari ketergantungan pada opini umum tentang antarmuka.

Bagikan perilaku wallet yang diketahui, bahasa transaksi saat ini, dan skenario error jika Anda memilikinya. Jika masukan tersebut tidak lengkap, kami mengidentifikasi alur mana yang dapat dirancang sekarang dan keputusan mana yang perlu konfirmasi. Bahasa antarmuka dapat dikoordinasikan dengan copywriting Web3.

Apa yang harus dapat diperiksa oleh tim Anda dari file Figma?

File Figma yang berguna memungkinkan pemangku kepentingan mengikuti tugas utama dan pengembang memeriksa status antarmuka yang dimaksud. Ini menghubungkan struktur, aturan visual, dan contoh interaksi dalam satu penyerahan yang dapat ditinjau.

Hasil kerja yang disepakati dapat mencakup temuan riset, alur pengguna, wireframe, desain visual, kit UI, pustaka komponen, dan prototipe yang dapat diklik. File harus membuat pola yang berulang mudah diidentifikasi dan menunjukkan bagaimana layar terhubung. Selama penyerahan, kami mengatur layar dan komponen yang relevan. Kami memperjelas status interaksi dan menandai pertanyaan implementasi yang memengaruhi pengalaman.

Gunakan prototipe untuk meninjau tugas dari awal hingga selesai. Periksa apakah tindakan selanjutnya terlihat, umpan balik muncul di titik yang tepat, dan error menawarkan jalan yang dapat dipahami ke depan. Pengujian kegunaan mengamati tugas yang disepakati. Temuan kemudian menjadi revisi desain atau pertanyaan terbuka untuk tim produk. Ini tidak menggantikan tinjauan teknis atau implementasi produksi.

Sebelum persetujuan desain, sebutkan orang yang memiliki keputusan produk dan orang yang akan mengimplementasikan pekerjaan. Perbedaan itu menjaga umpan balik visual tetap terpisah dari kelayakan teknis. Jika antarmuka juga memerlukan penjelasan pendukung di seluruh saluran, koordinasikan dengan pembuatan konten Web3.

Bagaimana tinjauan desain dApp bergerak menuju penyerahan?

Urutan tinjauan mengubah pertanyaan produk terbuka menjadi keputusan sebelum tim berinvestasi dalam layar detail. Kami mengonfirmasi lingkup, masukan yang tersedia, peninjau, dan tugas yang harus didukung antarmuka.

Pertama, riset dan tinjauan pesaing menginformasikan peta tugas. Wireframe kemudian memungkinkan tim memeriksa navigasi dan urutan informasi. Setelah pilihan itu selaras, kami mengembangkan sistem visual, layar inti, dan prototipe yang dapat diklik. Pengujian kegunaan dan revisi menyusul jika termasuk dalam lingkup yang disepakati. Penyerahan Figma akhir mencatat status interaksi dan pertanyaan implementasi yang relevan bagi pengembang.

Irama tinjauan praktis memiliki 2 titik keputusan sebelum desain visual: persetujuan alur tugas dan persetujuan struktur wireframe. Umpan balik selanjutnya harus mengidentifikasi tugas atau aturan produk yang terpengaruh, bukan hanya perubahan gaya yang disukai. Minta peninjau untuk menggabungkan komentar dan memisahkan koreksi yang diperlukan dari preferensi opsional.

Waktu ditetapkan setelah tinjauan lingkup. Jumlah dan kompleksitas alur membentuk jadwal. Demikian pula kesiapan materi produk dan ketersediaan peninjau. Kami mengonfirmasi urutan sebelum pekerjaan dimulai, kemudian menjaga setiap tinjauan tetap fokus pada hasil kerja yang sedang dibahas. Untuk pekerjaan sosial dan konten yang lebih luas, lihat Media sosial dan konten.

Perilaku wallet apa yang harus dikonfirmasi oleh tim teknik?

Penyerahan harus membedakan umpan balik antarmuka yang dirancang dari perilaku yang dikonfirmasi oleh tim implementasi. Pemisahan itu membantu pengembang menguji kondisi yang tepat daripada menyimpulkan perilaku teknis dari layar statis.

Kami mendokumentasikan status wallet dan transaksi yang disediakan dalam ringkasan produk. Tim kemudian dapat memeriksa respons mana yang diwakili, redaksi apa yang dilihat pengguna, dan opsi pemulihan apa yang muncul setelah error. Jika suatu status tidak memiliki perilaku produk yang dikonfirmasi, kami menandainya sebagai pertanyaan terbuka alih-alih menyajikannya sebagai mapan. Ini sangat berguna ketika desain mencakup permintaan koneksi, penjelasan gas, umpan balik tertunda, atau konfirmasi transaksi.

Penyedia wallet dan respons jaringan dapat bervariasi, jadi prototipe Figma tidak dapat menetapkan bagaimana setiap permintaan atau transaksi eksternal akan berperilaku. Kami mencatat status yang ditentukan dan dependensi yang belum terpecahkan untuk tinjauan teknik; implementasi harus mengonfirmasi respons yang sebenarnya.

Untuk memulai, kirimkan gambaran produk, target pengguna, antarmuka atau prototipe saat ini, dan tugas prioritas. GeoMarketing Experts akan meninjau materi tersebut, mengidentifikasi keputusan yang hilang, dan mengusulkan urutan desain yang terlingkup. Jika label antarmuka atau penjelasan onboarding juga memerlukan penulisan khusus, sertakan dalam diskusi.

Cara kerja

1. 1. Bagikan konteks produkKirim gambaran produk, audiens target, antarmuka saat ini, dan tugas prioritas. Sertakan kendala teknis dan umpan balik pengguna yang ada.
2. 2. Konfirmasi lingkup dan masukanKami memperjelas alur, riset, layar, dan pekerjaan prototipe yang diperlukan. Kami menyepakati siapa yang meninjau keputusan dan materi apa yang harus tersedia.
3. 3. Tinjau alur dan wireframeKami memetakan perjalanan pengguna dan menyajikan struktur antarmuka untuk umpan balik sebelum desain visual dimulai.
4. 4. Desain dan ujiKami membangun sistem visual dan prototipe, kemudian menguji tugas yang disepakati dan menyempurnakan pengalaman berdasarkan temuan.
5. 5. Siapkan penyerahan ke pengembangKami mengatur hasil kerja Figma dan memperjelas status interaksi serta pertanyaan implementasi terbuka untuk tim produk Anda.