10 Hasil Kerja UX yang Digunakan Desainer Teratas

Dengarkan versi audio dari artikel ini

Pekerjaan seorang desainer UX terjadi di banyak lingkungan yang berbeda—dari startup ramping dan lingkungan Agile di mana tim bekerja dengan sedikit dokumentasi, hingga keterlibatan konsultasi untuk pihak ketiga, atau perusahaan besar dan entitas pemerintah dengan persyaratan dokumentasi yang ketat. Terlepas dari sifat keterlibatan atau lingkungan (dan satu hal yang mengikat semuanya), adalah kebutuhan bagi para profesional UX untuk secara efektif mengkomunikasikan ide-ide desain mereka, temuan penelitian dan konteks proyek ke berbagai audiens.

Selama proses desain UX, desainer akan menghasilkan berbagai macam "artefak" dan hasil proyek sebagai bagian dari metodologi desain UX mereka. Ini dapat mengambil banyak bentuk: kiriman membantu desainer UX berkomunikasi dengan berbagai pemangku kepentingan dan tim, mendokumentasikan pekerjaan, dan menyediakan artefak untuk pertemuan dan sesi ide. Mereka juga membantu menciptakan “satu-satunya sumber kebenaran” — panduan dan spesifikasi untuk implementasi dan referensi.

Berikut adalah 10 kiriman UX yang biasanya dihasilkan oleh perancang UX selama pertunangan. (Daftar ini sama sekali tidak komprehensif dan berpotensi lebih panjang tergantung pada sifat perikatan.)

1. Tujuan Bisnis dan Spesifikasi Teknis

Ini adalah langkah mendasar. Untuk seorang profesional UX, semuanya dimulai dengan pemahaman tentang visi produk, yaitu alasan keberadaan produk dari perspektif bisnis. Ditulis dalam istilah yang sederhana, pernyataan tersebut harus mencakup masalah yang sedang ditangani, solusi yang diusulkan, dan gambaran umum dari target pasar. Ini juga harus menjelaskan platform pengiriman dan menyentuh secara ringan sarana teknis dimana produk akan dikirimkan.

Tidak perlu lebih dari satu halaman, tetapi harus menggambarkan inti dari What, Why dan How. Berikut ini contohnya: “Fantastic App Co. telah mengidentifikasi celah dalam aplikasi pemberian hadiah pada platform seluler untuk pasar Milenial (iOS dan Android). Sejumlah besar Milenial mengalami kesulitan mengingat tanggal khusus, mengidentifikasi hadiah terbaik, kemudian menemukan dan membeli hadiah tersebut. Solusi kami dirancang untuk mengurangi stres itu. Menggunakan desain antisipatif dan teknologi AI terbaru, Aplikasi ini memberikan pengalaman pengguna yang berguna dan hampir ajaib.”

2. Laporan Analisis Kompetitif

Bagi siapa pun yang mulai merancang produk baru, sangat penting untuk memastikan bahwa produk tersebut cocok dengan pasar. Yang terpenting, sebagai bagian dari strategi UX, produk juga harus memiliki keunggulan kompetitif yang menarik dan UX yang lebih unggul dari yang lain di pasar.

Analisis kompetitif berarti: “Mengidentifikasi pesaing Anda dan mengevaluasi strategi mereka untuk menentukan kekuatan dan kelemahan mereka relatif terhadap produk atau layanan Anda sendiri.”

Salah satu tugas awal seorang desainer UX adalah meneliti produk atau layanan apa yang saat ini digunakan oleh pelanggan target untuk menyelesaikan masalah. Apakah ada produk atau layanan yang setara di luar sana? Apakah ada solusi alternatif yang digunakan orang yang cukup baik tetapi tidak sempurna? Band-Aid—vitamin tapi bukan obat penghilang rasa sakit? Bagaimana UX yang lebih baik dapat membuat perbedaan?

Sebuah komponen penelitian pengalaman pengguna, laporan analisis kompetitif mengidentifikasi lima pesaing teratas dan memeriksa apa yang mereka lakukan dengan benar, serta apa yang mereka lakukan salah. Langkah ini akan membantu menetapkan arah desain di mana tujuan yang jelas ditentukan dan elemen yang menjadi fokus dijabarkan.

3. Laporan Penelitian Persona dan UX

Desainer UX perlu memastikan pemangku kepentingan memahami kebutuhan pelanggan produk. Membuat persona untuk merangkum dan mengomunikasikan pola perilaku pengguna dan melakukan riset pengguna adalah cara yang terbukti benar untuk melakukannya. Persona mewakili pengguna khas suatu produk—dengan memasukkan tujuan, kebutuhan, dan minat mereka, mereka membantu tim yang mengerjakan proyek mengembangkan empati terhadap pengguna.

Riset pengguna juga merupakan komponen integral dalam proses desain UX. Ini melibatkan berbagai teknik yang digunakan untuk mengekstrak pola perilaku, menambahkan konteks dan memberikan wawasan ke dalam proses desain. Ada banyak jenis alat dan teknik riset pengguna yang tersedia—ini semua tentang memilih "lensa" yang tepat untuk situasi yang tepat.

Sebelum memulai penelitian pengguna, penting untuk meluangkan waktu untuk mengembangkan rencana penelitian . Ini adalah dokumen yang akan membantu mengkomunikasikan tujuan dan metode penelitian serta mendapatkan dukungan dari para pemangku kepentingan. Ini juga merupakan alat hebat yang dapat digunakan untuk membantu semua orang tetap pada jalurnya selama proyek penelitian.

Pada akhir fase penelitian pengguna, sebuah laporan yang menerjemahkan temuan penelitian menjadi item yang dapat ditindaklanjuti dihasilkan. Tim UX kemudian diatur untuk merancang produk di sekitar item tersebut.

4. Peta Situs dan Arsitektur Informasi

Peta situs adalah model yang terorganisir secara visual dari semua komponen dan informasi yang terkandung dalam produk digital. Ini mewakili organisasi konten Aplikasi atau situs. Seiring dengan wireframes, mereka adalah salah satu yang paling mendasar dari hasil UX dan jarang dilewati dalam proses desain UX.

Peta Situs membantu menata arsitektur informasi—seni dan ilmu pengorganisasian dan pelabelan komponen produk—untuk mendukung navigasi, kemudahan ditemukan, dan kegunaan; mereka juga membantu Anda menentukan taksonomi dan antarmuka pengguna.

Peta Situs adalah referensi praktis untuk dimiliki sebagai sumber daya dan disesuaikan saat produk berkembang berdasarkan pembuatan prototipe berulang dan pengujian pengguna. Selama alur kerja desain, sistem penomoran sering digunakan untuk menjaga semua orang pada halaman yang sama ketika mendiskusikan konten produk.

5. Pengalaman Peta, Perjalanan Pengguna, dan Alur Pengguna

Sebuah peta pengalaman adalah representasi visual yang menggambarkan aliran pengguna dalam produk atau layanan-tujuan mereka, kebutuhan, waktu yang dihabiskan, pikiran, perasaan, reaksi, kecemasan, harapan-yaitu pengalaman keseluruhan selama interaksi mereka dengan produk. Biasanya diletakkan pada garis waktu linier yang menunjukkan titik kontak antara pengguna dan produk.

Perjalanan pengguna dan alur pengguna lebih tentang serangkaian langkah yang diambil pengguna, dan menunjukkan cara pengguna saat ini berinteraksi—atau berpotensi berinteraksi dengan suatu produk. Mereka menunjukkan perilaku, fungsionalitas, dan tugas utama yang mungkin dilakukan pengguna. Dengan memeriksa dan memahami "aliran" berbagai tugas yang mungkin dilakukan pengguna, Anda dapat mulai berpikir tentang jenis konten dan fungsi apa yang harus disertakan dalam antarmuka pengguna, dan jenis UI apa yang dibutuhkan pengguna untuk menyelesaikannya.

Sebagian besar UX adalah tentang memecahkan masalah bagi pengguna. Saat menyusun perjalanan pengguna, perancang perlu memahami kepribadian, tujuan pengguna, motivasi, poin kesulitan saat ini, dan tugas utama yang ingin mereka capai.

Apa perbedaan antara perjalanan pengguna dan alur pengguna ? Pikirkan alur pengguna sebagai pengguna yang mengerjakan satu tugas atau tujuan melalui produk atau layanan Anda, misalnya memesan mobil di Lyft; perjalanan pengguna menggambarkan gambaran yang lebih besar. Perjalanan pengguna meluas melampaui tugas, dan melihat bagaimana interaksi pelanggan tertentu cocok dengan konteks yang lebih besar.

6. UX Wireframes

Pokok metodologi desain UX, wireframe adalah ilustrasi "cetak biru" dua dimensi dari kerangka kerja desain dan elemen antarmuka, dan menunjukkan apa yang terjadi. Terutama alat tata letak, mereka membantu menentukan arsitektur informasi, jarak konten, fungsionalitas, desain interaksi dan perilaku pengguna yang dimaksudkan.

Wireframes adalah roti dan mentega untuk desainer UX dan salah satu hasil paling umum pada sebuah proyek. "Tunjukkan gambar rangka Anda" mungkin lebih sering terdengar daripada apa pun selama wawancara seorang desainer UX.

Fase utama dalam proses desain UX, wireframing adalah cara hemat biaya untuk mengeksplorasi ide dan menghasilkan konsep inovatif yang memenuhi tujuan pelanggan. Mereka adalah alat yang hebat untuk dengan cepat membuat ide di luar sketsa, dan mereka datang dalam banyak rasa yang berbeda — dari kesetiaan rendah (tanpa gaya, kotak hitam dan putih, teks Yunani) hingga kesetiaan tinggi (bergaya penuh, warna, sangat detail).

Kadang-kadang disebut sebagai "kabel" di tempat kerja, gambar rangka dapat menghemat banyak waktu dan uang karena sangat lentur dan cepat diproduksi. Mereka berfungsi sebagai pusat untuk melakukan percakapan dengan pemangku kepentingan dan anggota tim sambil mencari tahu arah desain.

Wireframe adalah dasar, dan dengan demikian berperan penting dalam membantu mendefinisikan desain secara struktural, dan bagaimana alur pengguna bekerja melalui Aplikasi atau situs di bawah skenario kasus penggunaan yang berbeda. Ada beberapa tikungan menarik pada gambar rangka seperti "peta gambar rangka" yang dibahas dalam bagian sebelumnya di sini di Blog Desain Toptal dan "arus kawat:" sebuah kiriman UX untuk alur kerja dan Aplikasi dari NNGroup.

7. Prototipe Interaktif

Hasil lain yang dominan selama proses desain yang berpusat pada pengguna, prototipe interaktif menghembuskan kehidupan ke dalam suatu produk. Prototipe dasar menghemat banyak waktu dan uang—prototipe ini mendemonstrasikan bagaimana segala sesuatunya akan bekerja dalam skenario kasus penggunaan yang sebenarnya, dan memungkinkan iterasi desain dan pengujian pengguna yang cepat. Mereka juga membantu seorang desainer mengkomunikasikan desain mereka secara efektif pada berbagai tahap proses desain UX.

Prototyping dapat terjadi pada setiap titik dalam perjalanan penemuan melalui iterasi. Dari prototipe kertas hingga desain yang sangat halus, tinjauan internal prototipe produk memungkinkan semua orang di tim melihat bagaimana segala sesuatunya akan bekerja ketika pengguna yang sebenarnya berinteraksi dengannya.

Sketsa dan gambar rangka statis tidak menghidupkan produk seperti yang dapat dilakukan oleh prototipe interaktif. Hampir secara ajaib, terlihat dan dirasakan bagaimana produk akan berperilaku—bagaimana semuanya terhubung. Desain dan fitur yang berbeda dapat dieksplorasi; ide-ide baru mungkin muncul. Titik-titik masalah dapat terlihat dan interaksi canggung terungkap.

Prototipe interaktif sangat membantu pengujian pengguna. Daripada memandu orang melalui halaman statis, calon pengguna dapat menguji produk yang terasa 100% nyata, memberikan ide, dan memberikan umpan balik yang berharga.

Saat ini, alat prototyping untuk desainer datang dalam berbagai bentuk dan ukuran. Berikut adalah 21 alat prototyping interaktif untuk desain UX.

8. Desain Visual

Desain visual adalah "lapisan cat terakhir" pada produk. Namun, bukan hanya itu: desain visual dapat sangat memengaruhi UX suatu produk, dan karenanya harus didekati dengan sangat hati-hati. Mudah-mudahan, banyak desain interaksi dan heuristik kegunaan dikerjakan selama langkah-langkah sebelumnya dari proses desain UX sehingga desainer dapat fokus pada visual. Ini adalah satu kesempatan terakhir untuk membawa produk ke tingkat berikutnya.

Desain visual adalah langkah terakhir sebelum diserahkan ke pengembang dan fase di mana panduan gaya dan spesifikasi akhir dibuat. Ini bukan hanya tentang "membuat sesuatu menjadi cantik," tetapi kesempatan untuk mendefinisikan, atau menerapkan skema warna merek dan memengaruhi kegunaan dengan tata letak, kontras, dan hierarki visual.

9. Styleguide dan Spesifikasi untuk Pengembang

Langkah terakhir dalam alur kerja desain UX adalah menyusun spesifikasi dan panduan gaya untuk pengembang. Styleguides adalah suatu keharusan jika desain produk ingin berhasil dalam jangka panjang.

Panduan gaya adalah untuk memastikan desain diterapkan secara konsisten di seluruh merek, gaya visual, warna, font, dan tipografi. Ini juga digunakan untuk pola desain, bahasa, aturan (seperti pintasan keyboard dan aturan tampilan data), dan menentukan perilaku UI (seperti penanganan kesalahan).

Beberapa panduan gaya dan spesifikasi disatukan secara manual, dan yang lainnya dibuat secara otomatis. Menyusun panduan gaya secara manual adalah proses yang membosankan dan seringkali dapat memakan waktu enam bulan, jadi alat otomatisasi apa pun adalah penghemat waktu yang disambut baik.

Cara otomatis bervariasi tergantung pada alat yang digunakan. Mereka adalah cara yang lebih gesit dan bertahap untuk menyerahkan desain vs. panduan gaya yang dibuat dalam waktu yang lama. Mereka dapat dianggap lebih seperti "Alkitab gaya" di rak yang dapat dirujuk oleh semua orang di tim.

Jika Anda bekerja di Sketch, ada kiriman dewa seperti Zeplin. Zeplin adalah alat kolaborasi untuk desainer UI dan pengembang front-end. Ini melampaui alur kerja desain dan membantu tim dengan hand-off desain.

Selain itu, panduan gaya desain dapat dibuat dalam beberapa detik dari plugin Sketch dengan Craft, atau pengukuran dan CSS yang diambil dari desain dengan membuat file HTML dengan plugin Marketch seperti yang diuraikan dalam artikel ini.

Berikut adalah 50 contoh panduan gaya yang bagus. Juga satu dari BBC, dan satu dari IBM, keduanya menghosting panduan mereka secara online yang memudahkan semua orang untuk melihatnya.

10. Pengujian Kegunaan dan Laporan Analisis Penggunaan

Pekerjaan seorang desainer UX tidak pernah selesai. Bahkan setelah rilis produk, ada peluang untuk mengumpulkan umpan balik, mengumpulkan data tentang penggunaan, menyempurnakan, merilis, dan memulai siklus dari awal lagi.

Uji kegunaan akan memberi tahu Anda apakah pengguna target Anda dapat menggunakan produk Anda. Ini membantu mengidentifikasi masalah yang dialami orang dengan UI tertentu, dan mengungkapkan tugas yang sulit diselesaikan dan bahasa yang membingungkan.

Laporan pengujian kegunaan biasanya dikirimkan selama fase pembuatan prototipe, tetapi bukan hal yang aneh untuk menguji produk yang ada dengan pengguna untuk melihat di mana mungkin ada ruang untuk perbaikan.

Memahami data yang dikumpulkan selama pengujian kegunaan—mengumpulkan, menyortir, dan membuat laporan, menjadi tugas yang semakin umum di kalangan praktisi UX—bahkan, ini menjadi keterampilan UX yang penting. Berikut adalah template laporan pengujian kegunaan.

Setelah produk dilepaskan ke alam liar, kumpulan data lainnya—metode kuantitatif —akan memberi tahu tim desain bagaimana kinerja produk dengan pengguna dalam skala massal.

Ada banyak alat dan cara untuk menangkap perilaku pengguna dan menganalisisnya. Dari pelacakan mata hingga pelacakan klik dan peta panas (yang menunjukkan klik, ketuk, dan perilaku menggulir) hingga penandaan elemen UI yang melacak jejak digital setiap pengguna di perangkat seluler dan web.

Laporan Analytics menunjukkan fitur mana yang digunakan pelanggan, berapa banyak waktu yang mereka habiskan di Aplikasi atau situs seluler Anda, tren dari waktu ke waktu—dan laporan tersebut menggabungkan hasil di seluruh geografi, akun, pengguna, dan segmen khusus. Mereka memberikan visibilitas penuh tentang bagaimana fitur digunakan dan oleh siapa.

Perusahaan analitik biasanya secara otomatis menghasilkan laporan yang disesuaikan sesuai permintaan. Laporan ini sangat berguna dan dapat memberikan wawasan yang mengejutkan tentang penggunaan produk Anda. Fitur luar biasa yang Anda pikir akan memenangkan semua pelanggan Anda ternyata hampir tidak pernah digunakan. Di sisi lain, fungsi kecil dan tidak signifikan di UI mungkin terbukti banyak digunakan dan Anda mungkin memutuskan sudah waktunya untuk fokus pada perluasan fungsi tertentu.

Misi desainer UX adalah memberdayakan perusahaan untuk membuat produk dan layanan berdasarkan pemahaman mendalam tentang perilaku, tujuan, dan motivasi manusia. 10 hasil UX di atas adalah beberapa yang paling umum diproduksi oleh Desainer UX karena mereka menciptakan pengalaman hebat bagi pengguna sebagai bagian dari "pemikiran desain" dan proses desain yang berpusat pada pengguna.

• • •

Bacaan lebih lanjut di Blog Desain Toptal:

• eCommerce UX – Tinjauan Praktik Terbaik (dengan Infografis)
• Pentingnya Desain yang Berpusat pada Manusia dalam Desain Produk
• Portofolio Desainer UX Terbaik – Studi Kasus dan Contoh yang Menginspirasi
• Prinsip Heuristik untuk Antarmuka Seluler
• Desain Antisipatif: Cara Membuat Pengalaman Pengguna yang Ajaib