Sebuah tim pengembang sedang merancang aplikasi “SehatKita”, platform layanan kesehatan digital yang menyediakan fitur pendaftaran pasien, konsultasi daring, dan akses riwayat medis. Pada tahap awal, tim diminta membuat wireframe digital sebagai rancangan antarmuka utama. Menurut Anda, bagaimana cara desainer menentukan tata letak, hierarki informasi, dan elemen navigasi agar wireframe tersebut tidak hanya fungsional, tetapi juga mudah dipahami dan menarik bagi pengguna dari berbagai usia?
Forum Pertemuan 7 (Dosen : Anita Ratnasari)
Number of replies: 54Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by MUHAMMAD JABBAR SYAHRIAL REZA -Misalnya, pada fitur Pendaftaran Pasien, kita gunakan white space, bukan hanya untuk memberi jarak, tapi untuk memecah formulir yang panjang dan rumit menjadi langkah-langkah kecil yang terasa ringan di tiap layar. Ini langsung mengurangi rasa "berat" atau intimidasi saat mendaftar.
Kemudian, untuk Konsultasi Daring, hierarki interaksi sangat jelas: begitu login, tombol "Mulai Konsultasi" harus jadi elemen visual paling dominan di dashboard. Ini penting karena pengguna mungkin sedang cemas atau sakit dan butuh akses super cepat ke fitur utama. Fitur lain seperti artikel harus secara visual "mengalah".
Terakhir, pada Akses Riwayat Medis, wireframe harus menunjukkan navigasi bawah yang jelas—ikon wajib disertai label teks "Riwayat". Di dalamnya pun, kita harus terapkan kejelasan dengan sub-navigasi atau filter yang jelas seperti "Resep Obat" atau "Hasil Lab", agar pengguna dari usia berapa pun tidak perlu "berburu" informasi penting mereka.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by RADITYA NAUFAL IRSYAD -Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -dengan langkah:
1. Pahami Siapa Penggunanya, Bukan "Semua Orang"
2. Tentukan "Mana yang Paling Mendesak" (Hierarki Informasi)
3. Buat design yang Familiar dan Anti Nyasar (Navigasi & Tata Letak)
4. Fokus pada Fungsi, Bukan Warna (Inti dari Wireframe)
yang pada akhirnya kunci dari wireframe digital yang sukses untuk aplikasi "SehatKita" bukanlah estetika atau kekinian. Kuncinya adalah kejelasan dan kemudahan.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Langkah awal yang bisa dilakukan adalah menentukan tata letak dengan mengutamakan alur penggunaan yang mudah diikuti. Elemen-elemen penting seperti menu pendaftaran, konsultasi, dan riwayat medis sebaiknya ditempatkan di posisi yang mudah dijangkau, misalnya di bagian tengah atau bawah layar untuk pengguna ponsel. Tampilan yang rapi dan konsisten akan membantu pengguna memahami fungsi setiap bagian tanpa perlu banyak penjelasan.
Dalam hal hierarki informasi, desainer perlu menonjolkan informasi utama dengan ukuran tulisan, warna, atau posisi yang berbeda. Misalnya, tombol untuk memulai konsultasi bisa dibuat lebih besar atau berwarna kontras agar langsung menarik perhatian pengguna.
Kemudian untuk navigasi, gunakan ikon dan istilah yang familiar bagi semua umur. Hindari istilah teknis medis yang rumit, cukup gunakan kata-kata sederhana seperti chat dokter, daftar pasien, atau riwayat. Setelah itu, lakukan uji coba kepada pengguna dari berbagai usia. Dari hasil uji ini, desainer bisa mengetahui bagian mana yang perlu diperbaiki agar tampilan lebih mudah dipahami.
Tata letak perlu disusun secara rapi dan seimbang menggunakan grid, dengan ruang kosong yang cukup agar tampilan tidak terasa padat. Elemen penting seperti tombol pendaftaran atau konsultasi sebaiknya ditempatkan di posisi yang mudah terlihat, misalnya di bagian atas atau tengah layar.
Hierarki informasi harus jelas, dengan ukuran teks, warna, dan posisi yang membedakan antara informasi utama dan tambahan. Fitur yang paling sering digunakan, seperti “Konsultasi” atau “Riwayat Medis”, harus lebih menonjol agar pengguna langsung tahu fokus utama aplikasi.
Sementara itu, elemen navigasi perlu dibuat sederhana dan konsisten di setiap halaman, menggunakan ikon dan label teks yang mudah dikenali. Hal ini penting agar pengguna dari berbagai usia tidak bingung saat berpindah fitur.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Desainer bisa mulai dengan membuat user flow yang simpel untuk paham langkah-langkah yang bakal dilalui pengguna, contohnya dari login hingga konsultasi. Setelah itu, buat sketsa awal tata letak pakai aplikasi kayak Figma supaya bisa lihat posisi elemen penting seperti menu, tombol, dan form. Untuk nentuin hierarki informasi, desainer perlu taruh fitur utama di bagian yang paling gampang terlihat, sementara info tambahan bisa ditempatkan di bawahnya. Navigasi dibuat pake ikon dan teks yang konsisten di setiap halaman agar pengguna tidak bingung. Terakhir, lakukan uji coba ke beberapa orang dari berbagai usia untuk pastiin tampilan wireframe mudah dipahami dan nyaman digunakan.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by MUHAMMAD ZIDHAN FADILLAH -Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Selain itu, informasi di dalam aplikasi perlu disusun berdasarkan tingkat kepentingannya. Teks yang lebih besar atau berwarna kontras bisa digunakan untuk hal-hal utama, seperti nama fitur atau jadwal konsultasi, sedangkan detail tambahan dibuat lebih kecil. Setiap fitur juga sebaiknya memiliki ikon dan label yang mudah dikenali agar pengguna tahu fungsi masing-masing tombol tanpa harus menebak.
Untuk navigasi, sebaiknya gunakan menu bawah (bottom navigation bar) dengan ikon yang umum seperti rumah untuk beranda, kalender untuk jadwal, dan profil untuk data pasien. Tombol-tombol ini harus cukup besar dan disertai teks agar mudah digunakan, terutama oleh pengguna lanjut usia. Bahasa yang digunakan juga harus sederhana dan tidak banyak istilah medis yang membingungkan.
Dengan cara seperti itu, wireframe “SehatKita” tidak hanya berfungsi dengan baik, tetapi juga terasa ramah dan mudah dipahami semua kalangan, sehingga pengguna bisa mengakses layanan kesehatan digital dengan nyaman dan tanpa kebingungan.
saya memiliki pandangan agak berbeda terkait hal ini, untuk aplikasi "SehatKita", kita sebaiknya tidak berfokus pada usia pengguna, melainkan pada kondisi psikologis mereka. Alasan saya, fokus pada usia seringkali menjebak kita pada stereotype. kita berasumsi pengguna muda pasti melek teknologi dan pengguna lansia pasti bingung. Padahal dalam konteks kesehatan, seorang pengguna berusia 25 tahun yang sedang panik mencari pertolongan darurat, bisa memiliki keterbatasan kognitif yang sama dengan pengguna 65 tahun yang kebingungan. Saat cemas atau sakit, kemampuan kognitif dan kesabaran semua orang akan menurun, berapapun usianya.
Karena itu, bagi saya, di aplikasi kesehatan hanya ada dua kondisi utama: pengguna sedang cemas atau sakit, atau pengguna sedang tenang (misalnya, mendaftar atau cek riwayat). Cara pandang ini akan langsung menentukan desainnya. Hierarki informasinya harus langsung menonjolkan fitur untuk pengguna cemas; tombol "Mulai Konsultasi" harus menjadi elemen visual paling dominan di layar. Untuk tata letak, seperti pada fitur pendaftaran, kita harus memecah formulir yang panjang menjadi langkah-langkah yang sangat singkat per layar agar tidak membebani. Terakhir, navigasinya harus menerapkan prinsip "nol tebakan". Menggunakan navigasi bawah (tab bar) yang familiar, dan yang terpenting, wajib sertakan label teks di bawah setiap ikon agar tidak ambigu.
Bagi saya, mendesain untuk 'pengguna panik' adalah stress test terbaik untuk wireframe aplikasi kesehatan. Jika desain kita bisa menuntun orang yang sedang cemas, maka desain itu secara otomatis akan terasa sangat mudah dan aman bagi pengguna tenang dari kalangan manapun.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Jika saya yang merancangnya, saya akan memastikan wireframe "SehatKita" memprioritaskan kejelasan dan aksesibilitas universal dengan menerapkan tata letak yang bersih dan konsisten yang memanfaatkan white space untuk mengurangi beban kognitif. Hierarki informasi akan dibuat sangat lugas, menempatkan fitur inti seperti "Mulai Konsultasi" sebagai elemen visual yang paling dominan di layar. Sementara itu, navigasi akan mengikuti pola standar industri (seperti bottom tab bar) dengan label teks yang eksplisit dan non-jargon, memastikan kemudahan penggunaan bagi pengguna dari berbagai latar belakang usia.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -Kalau dari sisi idealis mah ya, wireframe itu bukan cuma urusan bikin kotak dan garis doang — tapi soal gimana desain bisa bikin orang ngerasa nyaman dan percaya diri. Desain yang keren tuh nggak harus ribet; cukup bersih, pakai ikon yang gampang dipahami, dan bahasa yang hangat. Jadi pas orang buka aplikasi “SehatKita”, mereka langsung ngerti cara pakainya tanpa harus mikir keras. Biar kesannya bukan aplikasi “serius banget kek Pemerintah”, tapi lebih ke temen digital gitu yang bantu jaga kesehatan dengan cara yang santai tapi tetap profesional.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by BRIGITA JUNIATI MENDROFA -Pertama, pada bagian tata letak, desainer sebaiknya menggunakan struktur yang sederhana dan konsisten agar pengguna dapat dengan mudah memahami posisi setiap elemen. Penggunaan grid layout akan membantu menjaga kerapian, sementara penerapan white space memberikan ruang agar tampilan tidak terlihat padat. Elemen-elemen penting seperti menu utama atau tombol aksi sebaiknya diletakkan di area yang mudah dijangkau mata pengguna.
Kedua, dalam menentukan hierarki informasi, desainer harus mampu menonjolkan elemen yang paling penting dengan mengatur ukuran, warna, dan posisi secara proporsional. Misalnya, tombol “Konsultasi Daring” dapat dibuat lebih besar atau menggunakan warna kontras agar langsung menarik perhatian. Selain itu, penggunaan ikon dan label yang jelas juga penting untuk membantu pengguna, terutama bagi yang sudah berusia lanjut, agar dapat memahami fungsi setiap fitur tanpa kebingungan.
Selanjutnya, untuk elemen navigasi, desainer perlu menerapkan sistem navigasi yang intuitif dan mudah digunakan. Contohnya, penggunaan bottom navigation bar dengan ikon-ikon universal seperti rumah untuk beranda atau dokter untuk konsultasi akan memudahkan pengguna berpindah antarhalaman. Navigasi yang konsisten di setiap halaman akan menciptakan pengalaman yang nyaman dan mengurangi potensi kesalahan pengguna.
Selain itu, desainer juga perlu mempertimbangkan aspek aksesibilitas dengan memilih kombinasi warna yang memiliki kontras tinggi, ukuran huruf yang mudah dibaca, serta bahasa yang sederhana dan tidak terlalu teknis. Hal ini penting agar aplikasi dapat digunakan oleh semua kalangan, baik anak muda maupun pengguna lanjut usia. Terakhir, proses usability testing perlu dilakukan untuk memastikan bahwa rancangan wireframe benar-benar mudah dipahami dan sesuai dengan kebutuhan pengguna.
nah, jadi dengan menerapkan prinsip clarity (kejelasan), consistency (konsistensi), dan simplicity (kesederhanaan), desain wireframe aplikasi “SehatKita” akan menjadi lebih fungsional, menarik, dan ramah bagi seluruh pengguna.
Re: Forum Pertemuan 7 (Dosen : Anita Ratnasari)
by ANITA RATNASARI -1. Mengutamakan tujuan utama pengguna
2. Mengatur informasi secara bertingkat agar tidak membingungkan
3. Menggunakan navigasi sederhana yang konsisten
4. Menyesuaikan ukuran teks, warna, dan bahasa agar ramah untuk semua usia
5. Melakukan uji coba cepat untuk melihat apakah wireframe benar-benar dipahami pengguna
Dengan pendekatan ini, wireframe “SehatKita” tidak hanya fungsional, tetapi juga nyaman dan mudah digunakan oleh siapa pun.