UI UX -Defining Product Before Design.pptx

design

1. Defining Product Before Design cara memahami tujuan (objective) dari sebuah produk , mendalami user beserta masalahnya By Rahmania Kumalasari

2. Memahami Project Objective Tujuannya sebagai pemandu utama yang akan membimbing seluruh perjalanan pengembangan dan desain produk ibaratakan sebuah kompas yang mengarahkan langkah Bisa dimulai dengan identiikasi tujuan utama Menyediakan solusi baru Meningkatkan efisiensi Memberikan pengalaman yang belum ada sebelumnya

3. Definisikan User Siapa yang akan menjadi pengguna utama produk kita ? Identifikasi dan pahami calon pengguna dengan baik . Apa kebutuhan dan keinginan mereka ? Ini akan membantu meyelaraskan tujuan produk dengan apa yang diinginkan pengguna .

4. Tidak hanya mementingkan user saja ! BISNIS VS PENGGUNA PentIng untuk membedakan antara tujuan bisnis ( profil , jumlah traffic , jumlah pengguna , jumlah transaksi dll ) dan tujun pengguna Bagamana tujuan produk akan mendukung pertumbuhan bisnis ? Dan sejauh mana itu akan memenuhi kebutuhan dan harapan pengguna ?

5. Menciptakan Nilai Tambah Bagaimana produk tau bisnis bisa memberikan manfaat ekstra yang tidak hanya memenuhi harapan tetapi juga menginspirasi kepuasan yang lebih besar

6. Mulai dengan Product Requirment Document PRD (Product Requirment Document ) yang diciptakan product manager terdiri dari baground , objective , user , fitur untuk menjelakan kenapa produk ini harus di buat dan alasan harapannya apa . PRD membantu kita memhami asal usul produk hingga masalah yang akan diselesaikan dan konteks di mana produk akan digunakan

7. Cangkupan PRD "PRD akan mencakup segala hal yang harus ada dalam produk supaya dianggap selesai . Meskipun PRD bisa memberi petunjuk bagaimana produk akan dibuat untuk menggambarkan contohnya , PRD tidak akan menentukan detailnya sampai ke langkah paling kecil .

8. Mengenal user Profile

9. Bagaimana Caranya ? OBSERVASI WAWANCARA Berbicara langsung dengan pengguna untuk tahu masalah mereka dan apa yang mereka butuhkan Mengamai bagamana mereka menggunakan produk serupa apa yang sulit dan apa yang mereka suka juga medengarkan apa yang merek pikirkan tentang produk yang sudah ada atau ide ide baru

10. Menentukan Prioritas Menentukan prioritas antara kebutuhan pengguna dan tujuan bisnis adalah proses yang tidak mudah . Tetapi dengan komunikasi yang baik dan fokus pada dampak serta urgensi , kita bisa mengambil keputusan yang terbaik bagi semua pihak . Saat membuat produk kita perlu putuskan mana yang dilakukan terlebih dahulu Tujuan bisnis Memenuhi kebutuhan pengguna

11. Contoh ... Kebutuhan Pengguna : pengguna yang ingin memesan makanan dengan cepat setelah bekerja . Kebutuhan pengguna adalah untuk memiliki aplikasi yang mudah digunakan , menu yang jelas , dan pengiriman yang tepat waktu . Tujuan Bisnis : Di sisi lain, tujuan bisnis adalah meningkatkan jumlah pemesanan melalui aplikasi , meningkatkan omzet restoran , dan memperluas pelanggan .

12. Contoh ... Berarti ... Kebutuhan Pengguna : kemudahan dan efisiensi dalam memesan makanan . Tujuan Bisnis : menghasilkan keuntungan lebih banyak dengan meningkatkan jumlah pemesanan melalui aplikasi . Dengan memahami kedua hal ini , kita bisa merancang fitur-fitur aplikasi yang tidak hanya memenuhi kebutuhan pengguna namun juga mendukung pertumbuhan bisnis restoran .

13. Bagaimana memiilihnya ?

14. Case Study Kamu adalah seorang calon UX Designer untuk aplikasi Grab. Saat ini, kamu diminta untuk menganalisa fitur GrabBike. Lakukan analisis lengkap mengenai tujuan dari fitur GrabBike, Masalah dan Motivasi dari usernya, Model bisnisnya, dan indikator kesuksesan dari fitur ini.

15. Tujuan Fitur GrabBike Motivasi & Masalah Pengguna Model Bisnis GrabBike Alur Penggunaan GrabBike Indikator Kesuksesan Case Study

16. User Experience Factors By Rahmania Kumalasari

17. What makes a good UX Design ? "Good UX design means thinking like a user and providing a clear pathway to aid users in achieving goals when interacting with the product." Berpikir seperti pengguna (Thinking like a user): Memahami kebutuhan , harapan , dan kebiasaan pengguna , Menciptakan desain dari sudut pandang pengguna , bukan pembuat produk . Contoh : Bahasa yang digunakan harus mudah dipahami oleh target pengguna Memberikan jalur yang jelas (Clear pathway): Panduan yang mudah diikuti untuk mencapai tujuan,Navigasi intuitif dan tidak membingungkan,Elemen interaktif mudah ditemukan ( seperti tombol , menu, dsb )

18. What makes a good UX Design User Experience Design adalah proses bertahap untuk menciptakan sebuah poduk atau layanan Melibatkan proses riset , perancangan informasi , wireframing protoptyping hingga usability test. Garis besarnya adalah bagaimana menciptakan interaksi dan pengalaman lewat riset & perencanaan matang

19. 3 Thing to Remember About UX Design User experience is what users think and feel The user experience depends on the context in which the product is used. The user experience with the product may change over time. 1 2 3

20. 10 Key benefits of UX design Provides the best solution Boosts customers Engagement  Improves credibility Helps build a brand image Increases sales Encourages word of mouth Helps beat you competitors Improves performance Can reduce development and support costs Provides more accurate prototyping

21. Contoh Good UX Spotify Tiap detil kecil dalam desain Spotify mengikuti bentuk & behavior yang konsisten . Mulai dari menyimpan lagu , menyukai lagu , hingga menyembunyikannya , Spotify akan memberikan tanggapan yang sama

22. Airbnb Ux di airbnb sangat seius memperhatikan nya , meciptakan font sendiri dan desain mereka yang clean minimalis tapi informasinya tepat sasaran

23. Duolingo Populer karena desain UX yang menarik . Duolingo berhasil memecah proses panjang menjadi bagian-bagian kecil dengan tambahan visual menarik . Hal ini meningkatkan clarity dan juga mengurangi cognitive load pengguna .

24. Good usability = Good UX keterjangkauan dan kemudahan penggunaan produk (usability) sangat mempengaruhi pengalaman pengguna secara keseluruhan (UX) . Jadi , hubungan antara keduanya : Jika sebuah produk memiliki usability yang baik ( mudah digunakan , efisien ), maka pengalaman pengguna (UX) secara keseluruhan akan cenderung lebih positif .

25. 7 faktor UX

26. Useful Produk yang berguna adalah yang memiliki tujuan . Apabila tidak ada tujuan maka tidak akan menarik untuk dicoba oleh para calon pegguna Usable Produk yang mudah digunakan , intuitif dan memliki waktu adaptasi yang singkat akan mejadi andalan bagi tiap pengguna baru

27. Findable Sebuah produk haruslah mudah ditemukn , begitu juga dengan fitur di dalamnya . Apa yang kamu jual dalam marketing mu haruslah mudah dicari di dalam produkmu Credible UX yang baik akan membantu memberikan kredibilitas pada brand atau produk yang dipasarkan , begtu juga sebaiknya apa yang djual di pasar haruslah sejalan dengan UX yang baik pada produk

28. Desirable Gambar , idetitas visual dan elemen desan lainya harus dapat mencipakan emosi positif bagi pengunanya Accessible Aksesibilitas artinya sebuah platform sebaiknya dapat dengan mudah digunakan oleh semua kalangan termasuk para disabilitas Valuable Baik kepada pengguna dan juga bisnisnya sendiri Sebuah produk dapat memberikan manfaat . Baik ke penggua dan bisnisnya .

29. Mengenal Usabilty Adalah bagaimana cara kita mengukur seberapa baik user dapat menggunakan produk kita dengan efektif , efisiien dan memuaskan dlam kontes yang spesifik . Proses ini biasanya dilakukan mulai dari wireframe hingga desain akhir untuk mecapai hasil maksimal .

30. Elemen penting dalam Usability Usability dalam sebah desain , berganung pada seberapa bak fitur yang kita buat dapat membantu kebutuhan user sesuai konteksnya . Beberapa elemen yang perlu diperhatikan : Effectiveness Efficiency Engagement Error Tolerance Ease of Learning

31. Effectiveness Membantu user dalam menyelesaikan aktivitas dengan akurat Calm Flow berlangganan dari aplikasi Calm menujukkan cara yang efektif yang memproritaskan kenyamanan user dan memandu proses yang mudah

32. Efficiency User dapat menyelesaikan aktivitas dengan cepat melalui proses singkat Google maps Desain UX dari Google Maps yang efisien berfokus pada memberikan navigasi yang cepat dan mudah pada users, sehingga mempersingkat waktu yang diperlukan user untuk mencapai tujuan .

33. Engagement User merasa produk mudah menyenangkan saat digunakan Tiktok UX dari Tiktok menciptakan behavior yang membuat user ingin terus aktif dan berinteraksi dengan produknya , baik itu menonton , berkomentar , atau bahkan membuat video. Hal ini didapatkan dari personalisasi konten yang juga interaktif .

34. Error Tolerance Seberapa mudah user dapat kembali ketika menemui kesalahan Google Search Memaksimalkan kecanggian algoritma yang dimilikinya , google search mengantisipasi banyak jenis error yang mungkin terjadi hingga memberikan hasil yang sesuai konteks tiap penggunanya seperti menyesuaikan bahasa dan mendeteksi typo

35. Ease of Learning User baru dapat dengan mudah mempelajar produk Duolingo Bertujuan untuk membuat pembelajaran bahasa menjadi menarik dan mudah , Duolingo berhasil menggabungkan interaktivitas , pengurangan beban kognitif , dan umpan balik yang jelas . Pengguna pun dapat belajar dengan ritme mereka sendiri tanpa harus terburu-buru

36. Law UI Design By Rahmania Kumalasari

37. Fitts ’ Law Hukum Fitts merupakan prinsip penting dalam desain UI, yang membantu menciptakan antarmuka yang efisien dan mudah digunakan . Fitts’s Law menerangkan bahwa target yang berukuran lebih besar dan jaraknya lebih dekat akan lebih mudah dan lebih cepat dicapai daripada target yang lebih kecil dan lebih jauh . Dalam UI Design, bila seorang designer ingin membuat elemen UI yang lebih mudah diakses oleh user, maka harus mempertimbangkan dua faktor utama berikut , yaitu   target size   dan   distance to target . Berikut ini adalah beberapa aplikasi utama Hukum Fitts dalam desain UI:

38. The Thumb Zone Fitts ' Law membantu desainer memahami bagaimana pengguna berinteraksi dengan UI pada perangkat mobile. Dengan mempertimbangkan "The Thumb Zone," desainer dapat membuat aplikasi yang lebih ergonomis , nyaman , dan efisien dalam penggunaannya .

39. Kenapa Penting ? Elemen interaksi palingbaik di tegah kebawah , tujuan desain yang inklusif ( semua orang bisa coba ) Main CTA ditaruh di tempat yanggambang di jangkau contoh ; daftar akun

40. Tertiary ( Oranye - Bagian Atas ) Area ini berisi fungsi tambahan yang biasanya disembunyikan di balik menu. Contoh : ikon profil , menu hamburger, ikon pencarian . Tidak sering digunakan dalam interaksi utama . Primary ( Hijau - Bagian Tengah) Area utama di mana konten dan fungsionalitas utama ditampilkan . Contoh : daftar video di YouTube, feed tweet di Twitter. Pengguna berinteraksi dengan bagian ini paling sering . Secondary ( Biru - Bagian Bawah ) Berisi tombol aksi utama dan navigasi . Contoh : tab navigasi di bagian bawah layar (Home, Trending, Subscription di YouTube). Mudah dijangkau dengan ibu jari , sehingga penting untuk menempatkan tombol yang sering digunakan di sini .

41. Design dengan Fitts ’ Law

42. Prinsip

43. Apa itu Hick’s Law ? VS

44. Desain dengan Hick’s Law Membiarkan opsi lebih sedikit dengan tambahan “others” jika tidak ada opsi yang sesuai

45. 60-30-10 ( memilih warna untuk desain UI) Langkah 1. 60% Ini adalah warna dominan atau warna primer. Ini adalah warna yang paling menonjol . Saat memilih warna ini , penting untuk mengetahui maknanya . Warna ini harus mencerminkan pesan merek .

46. Langkah 2 30% Ini adalah warna sekunder atau warna pelengkap . Menggunakan setengah dari warna ini seperti yang Anda gunakan pada warna utama . Ini digunakan pada elemen utama seperti teks , korsel , dan fitur penting lainnya . Warna sekunder mendukung warna utama tetapi masih cukup berbeda untuk menciptakan kontras .

47. 10% Ini adalah warna aksen . Warna ini dapat digunakan pada tombol , pop-up, sorotan , dsb . Warna-warna cerah dan cemerlang merupakan cara yang bagus untuk menambah daya tarik visual. Warna-warna tersebut dapat membantu menarik perhatian ke area tertentu pada halaman atau membuatnya terasa lebih hidup secara keseluruhan .

48. Desain dengan 60-30-10 Main Color 60% [Background, main elemen ] Secondary Color 30% [level kedua , icon , text] Accent 10 [button]

49. Tugas Tugas berkelompok (3–5 orang) untuk membuat laporan tertulis dan presentasi karya tulis dan presentasi Penjelasan lengkap mengenai : UI dan UX ( pengertian , fungsi , contoh ) Perbedaan dan keterkaitan UI dan UX Pentingnya UI/UX dalam proses desain produk digital Penjabaran 4 tren UI/UX terkini : contoh ; Dark Mode dan Accessibility , dll Berikan 1 contoh nyata atau studi kasus dari aplikasi mobile/web populer Sertakan gambar , ilustrasi , atau tangkapan layer untuk mendukung penjelasan nya tiap point tugas Cantumkan sumber referensi (minimal terdapat 2 paper internasional dan 2 paper nasional ) dan 1 buku tentang ui ux