⌘ K
Bahasa Indonesia
Alur kerja desain

Cara menemukan inspirasi UI aplikasi seluler dan mengubahnya menjadi brief desain

Alur kerja praktis untuk mengumpulkan referensi UI aplikasi seluler, mempelajari urutan layar yang lengkap, dan mengubah pengamatan visual menjadi brief desain yang orisinal serta dapat diuji.

Tim editorial ScreenKits6 menit baca
Galeri antarmuka seluler konseptual dengan kartu gambar, peta, dan dasbor.
Karya visual editorial konseptual; bukan antarmuka aplikasi yang direkam.

Folder berisi layar aplikasi yang menarik mudah dikumpulkan tetapi sulit dimanfaatkan. Tanpa pertanyaan yang memandu pencarian, referensi visual dapat menarik desain ke arah peniruan sementara tugas pengguna yang sebenarnya tetap belum terpecahkan.

Gunakan tangkapan layar sebagai pemicu penyelidikan. Alur kerja yang berguna dimulai dari sebuah tugas, membandingkan alur lengkap, mencatat keputusan di balik tampilan visual, lalu mengubah pengamatan tersebut menjadi brief yang dapat Anda buat prototipe dan evaluasi.

Poin utama

  • Tentukan pengguna, tugas, dan ketidakpastian desain sebelum mengumpulkan referensi.
  • Pelajari urutan layar dan status interaksi, bukan hanya tampilan visual yang terpisah.
  • Tuliskan prinsip yang dapat diterapkan di tempat lain, lalu buat keputusan orisinal untuk produk Anda dan validasi bersama orang-orang.
  • Periksa aksesibilitas dan kesesuaian platform saat brief masih mudah disesuaikan.

1. Mulailah dengan pertanyaan desain

Sebelum menjelajah, tulis satu kalimat tentang orang dan momen yang Anda rancang. Misalnya: “Seseorang yang baru belajar memasak di rumah perlu memilih resep makan malam untuk hari kerja dan memahami langkah berikutnya.” Lalu sebutkan ketidakpastiannya: apakah bagian tersulitnya memindai pilihan, memercayai rekomendasi, atau memulai resep dengan beberapa langkah?

Pertanyaan itu memberi batas pada pencarian. Tentukan platform, area produk, dan tugas yang relevan. Jika Anda mengeksplorasi pengalaman penggunaan pertama, jelajahi contoh onboarding; jika masalahnya pemilihan paket, lihat layar paywall; untuk entri data, bandingkan pola formulir. ScreenKits memungkinkan Anda menjelajahi layar aplikasi nyata berdasarkan kategori. Simpan aplikasi yang berguna sebagai bookmark peramban agar Anda dapat kembali ke layarnya saat menyintesis temuan.

  • Siapa orang yang dituju, dan apa yang sedang ia coba capai?
  • Pilihan desain apa yang belum pasti: hierarki, urutan, navigasi, konten, atau umpan balik?
  • Kendala apa yang penting, seperti platform, aksesibilitas, ukuran perangkat, atau aturan bisnis?

2. Kumpulkan sedikit referensi dengan tujuan jelas

Kumpulkan beberapa contoh yang membahas tugas yang sama atau sangat berkaitan. Sertakan lebih dari satu pendekatan: jalur langsung, jalur terpandu, mungkin juga versi yang menangani kesalahan atau keadaan kosong. Untuk tiap kandidat, simpan aplikasinya dan catat layar atau momen yang ingin Anda tinjau kembali. Kumpulan ringkas lebih mudah dibandingkan daripada papan inspirasi yang tidak disaring.

Lihat lintas kategori ketika masalah dasarnya sama. Aplikasi penjadwalan dan aplikasi belanja bahan makanan mungkin sama-sama perlu membantu seseorang memilih tanggal dan mengonfirmasi perubahan. Hubungan yang berguna adalah struktur keputusannya, bukan tema visual permukaannya. Jangan anggap kemiripan audiens atau industri sebagai bukti bahwa antarmukanya menyelesaikan masalah spesifik Anda.

  • Pilih referensi berdasarkan alasan yang dapat Anda jelaskan, misalnya “menunjukkan bagaimana opsi terpilih mengubah ringkasan.”
  • Sertakan solusi yang berbeda agar contoh pertama yang terlihat rapi tidak otomatis menjadi jawaban baku.
  • Gunakan bookmark peramban agar aplikasi terpilih tetap tersedia untuk dibandingkan saat Anda menulis brief.

3. Baca alurnya, bukan hanya tangkapan layarnya

Layar yang berdiri sendiri menunjukkan susunan, warna, teks, dan kontrol pada satu momen. Layar itu tidak mengungkap apa yang membawa pengguna ke sana, apa yang terjadi setelah ketukan, atau apakah tugas berhasil. Telusuri setiap layar yang relevan secara berurutan. Catat titik masuk, keputusan, tindakan, umpan balik, dan status berikutnya. Sertakan alternatif seperti kesalahan validasi, penutupan, dan kembali untuk mengubah pilihan ketika status tersebut memengaruhi tugas.

Pisahkan pengamatan dari interpretasi. “Tindakan utama tetap berada dekat bagian bawah selama tiga langkah” adalah pengamatan; “ini pasti lebih mudah digunakan” adalah klaim yang belum Anda buktikan. Tangkapan layar dapat menginspirasi hipotesis, tetapi bukan bukti kegunaan. NN/g menjelaskan prototipe dan pengujian pengguna sebagai cara mengidentifikasi kemungkinan masalah kegunaan dan mempelajari bagaimana orang berinteraksi dengan antarmuka yang diusulkan.

CatatContoh dari alur pemilihan resep
Tujuan penggunaMemilih resep makan malam yang sesuai dengan waktu yang tersedia malam ini.
Pola yang diamatiFilter waktu dan pola makan muncul sebelum daftar resep.
Prinsip yang mungkinTempatkan batasan yang paling berpengaruh sebelum menjelajahi hasil.
Pertanyaan terbukaApakah orang tahu filter mana yang opsional?
Keputusan produkTampilkan dua filter penting, dengan pilihan tambahan tersedia bila diperlukan.

4. Ubah pengamatan menjadi brief yang orisinal

Pada tahap sintesis, referensi mulai menjadi berguna. Tarik prinsip yang dapat diterapkan di tempat lain, seperti “tunjukkan konsekuensi pilihan sebelum konfirmasi.” Lalu tentukan bagaimana prinsip itu seharusnya bekerja dalam produk Anda berdasarkan tugas, konten, dan kendalanya. Jangan menyalin ilustrasi bermerek, redaksi persis, atau tata letak khas hanya karena tampak menarik dalam suatu contoh.

Untuk contoh resep, kumpulan referensi mungkin menyarankan agar waktu ditampilkan sejak awal dan perubahan akibat filter terpilih dapat dilihat sebelumnya. Brief yang orisinal dapat menentukan jalur perencanaan makan malam yang singkat, batas waktu yang terlihat, status filter yang jelas, dan langkah tinjauan sebelum menyimpan. Keputusan tersebut menjawab tujuan produk; bukan menciptakan ulang layar aplikasi lain.

  • Audiens dan konteks: siapa yang memerlukannya, serta di mana atau kapan mereka akan menggunakannya?
  • Tujuan dan keberhasilan pengguna: apa yang seharusnya dapat mereka selesaikan atau pahami?
  • Alur: apa langkah utama, keputusan, dan status alternatif penting?
  • Prinsip desain: apa yang harus dibuat jelas atau mudah oleh antarmuka?
  • Kendala dan pertanyaan terbuka: hal apa yang harus dipenuhi, dan apa yang perlu diteliti?
  • Rencana evaluasi: tugas apa yang akan Anda berikan kepada seseorang menggunakan prototipe, dan apa yang akan Anda amati?

5. Buat prototipe, periksa aksesibilitas, dan sempurnakan

Ubah brief menjadi wireflow kasar sebelum memoles gaya visual. Buat prototipe untuk keputusan utama dan umpan baliknya, lalu minta seseorang yang mewakili audiens sasaran menyelesaikan tugas realistis. Perhatikan keraguan, pilihan tak terduga, dan kesalahan. Revisi alur dan ulangi; panduan riset NN/g memandang desain iteratif dan evaluasi prototipe sebagai bagian dari pembelajaran, bukan menganggap draf pertama sudah final.

Lakukan tinjauan aksesibilitas bersamaan dengan pekerjaan tersebut. Human Interface Guidelines Apple menekankan interaksi yang dapat dipersepsi dan disesuaikan serta pertimbangan berbagai metode input. Periksa pembesaran teks, kontras, ukuran dan jarak kontrol, label yang jelas, serta apakah makna hanya bergantung pada warna. Periksa juga apakah alur menyesuaikan teks yang lebih panjang dan dapat dipahami dengan teknologi bantu. Panduan aksesibilitas Material Design berguna sebagai pelengkap bila produk Anda mengikuti konvensi Android.

  • Berikan instruksi tugas, bukan tur antarmuka, lalu amati apakah orang dapat melanjutkan.
  • Uji versi awal dengan detail rendah ketika perubahan struktur masih mudah dilakukan.
  • Tinjau panduan platform yang relevan dengan perangkat dan sistem desain yang Anda dukung.
  • Kembali ke referensi hanya untuk menyelidiki pertanyaan; jangan jadikan kemiripan visual sebagai pengganti bukti.

Daftar periksa dari referensi ke brief

Sebelum menyerahkan brief, pastikan isinya menggambarkan keputusan produk, bukan sekadar papan suasana visual. Seseorang yang tidak ikut mengumpulkan referensi harus dapat memahami tugas yang dituju, alur yang diusulkan, pilihan yang belum diputuskan, dan cara tim akan mengetahui apakah desainnya berhasil.

  • Pengguna dan tugas asal dijelaskan secara eksplisit.
  • Setiap referensi memiliki catatan yang menjelaskan pertanyaan atau pola yang dibantu untuk dieksplorasi.
  • Pengamatan dipisahkan dari asumsi dan klaim tentang kegunaan.
  • Brief menjelaskan alur orisinal dan alasan yang khusus untuk produk.
  • Aksesibilitas, perilaku platform, dan status alternatif penting disertakan.
  • Tugas prototipe dan rencana tinjauan berbasis pengamatan telah ditentukan.

Sumber & bacaan lanjutan

Ubah inspirasi menjadi alur Anda berikutnya.

Jelajahi layar nyata, bandingkan pola, dan lihat bagaimana semuanya saling terhubung.

Jelajahi layar aplikasi