Daftar Isi :
Dalam pembuatan website, terdapat dua komponen penting yang perlu diperhatikan, yakni User Interface (UI) dan User Experience (UX). Masih banyak yang menganggap keduanya sama. Padahal, UI UX berbeda, baik dari pengertian maupun fungsinya. Apakah yang membedakan UI dan UX? Nah, agar kamu paham perbedaan keduanya, di bawah ini adalah penjelasan lebih lengkap mengenai UI UX.
User Interface (UI) merupakan desain antarmuka yang fokus pada keindahan dari sebuah tampilan, dan pemilihan warna yang baik. Tujuannya, untuk membuat tampilan situs lebih enak dipandang mata dan pengunjung pun jadi betah berlama-lama. UI menciptakan ikatan emosional dengan pengguna melalui desain yang menarik dan indah. Biasanya, UI akan diimplementasikan atau dikerjakan setelah UX selesai menentukan desain layout, logo, warna, dan typography untuk mempercantik situs yang kamu miliki.
User Experience (UX) merupakan proses meningkatkan kepuasan pengguna situs atau aplikasi tertentu melalui kegunaan dan kesenangan yang diberikan dalam interaksi antara pengguna dan produk. UX design inilah yang memungkinkan suatu situs bisa digunakan dengan mudah, sehingga tidak membingungkan pengguna. UX mencakup keseluruhan elemen dari suatu website. Termasuk di dalamnya, memastikan website tersusun dengan baik, dan pengguna mudah berpindah dari satu halaman ke halaman lain.
Secara singkat, UI dan UX memang saling berkaitan. Namun, perbedaan UI dan UX dapat dilihat dari lingkup fokusnya.
UI berfokus pada elemen antarmuka yang tampak secara visual seperti tipografi, ilustrasi, warna, bilah menu, dan lain lain. Sementara UX berfokus pada pengalaman pengguna dan experience mereka ketika menggunakan produk.
Cara mudah untuk menggambarkan perbedaan antara UI dan UX adalah dengan analogi sederhana berikut. "Bayangkan ketika kamu sedang memasak makanan, UX akan menjadi resepnya, sedangkan UI adalah bahan baku masakannya".
Setelah mengetahui apa itu UI dan UX, apakah sekarang Anda sudah mengetahui perbedaan UI dan UX? Jika belum, tenang saja. Berikut ini kami akan paparkan apa saja sebenarnya perbedaan UI dan UX.
1. Tujuan Desain
Hal yang mendasar tentang perbedaan UI dan UX adalah tujuan desainnya. Fokus pembuatan desain UI UX sangatlah berbeda. Desain UI pada sebuah produk bertujuan untuk mempercantik tampilan produk. Sementara desain UX dirancang untuk memberikan pengalaman yang menyenangkan saat menggunakan produk.
Fokus desain UI yaitu keindahan tampilan, sementara UX berfokus pada kepuasan pengguna produk. Sederhananya, desain UI akan mempengaruhi kesan pertama pengguna melihat produk Anda. Sementara itu, UX mempengaruhi bagaimana pengalaman pengguna saat menggunakan produk.
2. Proses Desain
Masih berkaitan dengan perbedaan UI dan UX sebelumnya, tujuan desain yang berbeda juga mempengaruhi prosesnya. Oleh sebab itu, proses merancang UI UX design pun berbeda.
Karena berfokus pada user experience, proses desain UX berlandaskan riset pengguna sehingga menghasilkan produk yang disukai dan dibutuhkan oleh target pengguna. Prosesnya pun melalui banyak tahap dan membutuhkan peran banyak pihak, salah satunya yaitu UX researcher. Setelah melakukan riset, desainer merancang sketsa desain dengan wireframe dan prototype.
Sementara itu, desain UI juga memerlukan riset. Namun, riset yang dilakukan merupakan riset desain untuk membuat desain yang menarik dan sesuai dengan konsep. Di sini, desainer UI juga perlu merancang model desain yaitu dengan membuat mockup terlebih dahulu.
3. Komponen Desain
Perbedaan UI dan UX berikutnya yaitu komponen desain. Komponen yang membangun Desain UI berfokus pada keindahan tampilan produksi. komponen UI tersebut di antaranya meliputi warna, gambar dan video animasi, typography, buttons, dan visual interaksi lainnya.
Sementara itu, komponen desain UX meliputi hampir seluruh komponen pada suatu produk seperti fitur-fitur, struktur desain, dan navigasi. Termasuk juga tampilan interface, copywriting, hingga branding, sehingga diperlukan kolaborasi tim untuk menghasilkan desain produk yang baik.
4. Tools yang Digunakan
Karena proses pembuatan yang berbeda, perbedaan lainnya dari UI UX adalah kebutuhan akan tools yang berbeda. Untuk desainer UI, keindahan gambar sangatlah penting. Jadi mereka membutuhkan aplikasi yang mendukung pembuatan desain interface yang detail.
Ada banyak aplikasi desain UI yang tersedia seperti Flinto, Principle, Frames X, Adobe illustrator, dll. Aplikasi tersebut dilengkapi beberapa tools pendukung desainer UI seperti tools menambahkan unique interaction icon, easy transitions, UI assets and kits, dll.
Sementara itu, desainer UX lebih membutuhkan aplikasi prototyping desain agar mudah mendapatkan feedback dari pengguna. Beberapa aplikasi prototyping desain yang mendukung desainer UX adalah: Sketch, InVision, Figma, Adobe XD, Axure, dll.
Beberapa fitur yang tersedia seperti tersedia fitur collaboration, real-time editing, easy to test design, dll. Fitur tersebut akan memudahkan desainer UX mendapatkan feedback untuk menghasilkan produk yang user-friendly
5. Skill yang Dibutuhkan
Perbedaan UI dan UX juga pada skill individu yang menjalankannya. Menjadi desainer UI dan desainer UX membutuhkan skill tersendiri. Beberapa skill yang dibutuhkan seorang desainer UI adalah desain grafis, design branding, creative thinking, dan convergent thinking. Skill tersebut harus dimiliki oleh desainer UI dalam mendesain tampilan produk agar terlihat menarik dan mudah untuk interaksi.
Sementara seorang desainer UX bertanggung jawab membuat desain produk dengan pendekatan pengguna agar mudah digunakan. Oleh sebab itu, mereka harus memiliki skill melakukan riset, analytical thinking, problem solving, critical thinking, dan creative thinking.
.png)
Keberadaan dari user interface maupun user experience tentu saja tidak dapat dipisahkan. Masing – masing memiliki keterkaitan yang erat dalam memberikan pengalaman kepada pengguna dalam mengakses aplikasi. Terdapat beberapa komponen dalam UI/UX yang berperan dalam mengarahkan perilaku dari user dalam menggunakan aplikasi tersebut.
Informasi arsitektur adalah struktur dari segala bentuk informasi yang ditampilkan kepada pengguna. Sebelum membahas rancangan aplikasi, kita harus tahu terlebih dahulu apa yang dibutuhkan oleh user. Berikut ini, kami akan menjelaskan metode apa saja yang dibutuhkan dalam mengorganisir informasi arsitektur.
Metode pengorganisasian informasi secara hierarki ini menggunakan konsep teori psikologi. Dalam hal ini, sangat diperhatikan dalam fungsionalitas dan penyusunan setiap elemen dari sebuah aplikasi yang akan dibuat. Contohnya, pembuatan navigasi yang dibuat di paling atas dan berfungsi sebagai penunjuk.
Metode sekuensial ini lebih menekankan pada proses break-down setiap
informasi menjadi beberapa tahapan yang nantinya akan digunakan oleh user. Fungsi dari metode ini, agar pengguna dapat mengingat lebih baik informasi yang diberikan. Contohnya, menu pada e – commerce yang memiliki produk informasi.
Metode matriks ini banyak melimpahkan tanggung jawab kepada sisi pengguna. Tanggung jawab disini, dalam mengorganisir informasi. Sebagai contoh, sorting merupakan fitur yang menggunakan metode matriks.
Aplikasi dibuat tidak hanya untuk dipandang dan dinikmati saja tampilannya. Tetapi, interaksi dari aplikasi tersebut juga sangat berperan penting. Interaksi juga didukung dengan desain yang baik pula.
Interaksi pada desain dapat berupa cara mengklik, menggeser, menekan fitur maupun tombol dalam aplikasi. Interaksi desain sangatlah penting untuk mengetahui kebiasaan (behavior) dari pengguna.
Fungsionalitas (usability) merupakan komponen penting dalam desain UI/UX. Ukuran dari fungsionalitas ini dinilai dari seberapa mudah penggunaan dari aplikasi tersebut. Selain itu, ketepatan dan fitur yang mendukung bagi pengguna merupakan hal yang penting bagi tampilan website maupun mobile.
Setelah menyusun ketiga komponen di atas, selanjutnya yang perlu dilakukan adalah membuat sebuah prototype kasar berupa Wireframe. Output dari prototype tersebut akan dijadikan layout. Yang mana, nantinya akan diserahkan kepada tim pengembang untuk proses pembuatan software.
Setelah hasil wireframe telah dibuat, barulah bagi seorang visual designer untuk membuat tampilan visual dari rancangan tersebut. Dengan penambahan dan perubahan pada warna, style, font, dll. Fungsinya supaya memberikan gambaran yang lebih jelas mengenai desain awal dari aplikasi yang akan dibuat.
Tools yang digunakan dalam pembuatan desain visual ini adalah Adobe XD, Figma, dll. Anda bisa menggunakan salah satu tools tersebut sesuai dengan kebutuhan anda. Dengan menggunakan Figma, anda dapat mengerjakan proyek secara online tanpa perlu menginstall terlebih dahulu software seperti pada Adobe XD.
KONSULTASI GRATIS
0857-7612-5559 CS 1
0858-9165-8512 CS 2
0882-9037-8482 CS 3
Alamat Kantor :
CQCH+VMQ, Jl. Terapi Raya, RT.03/RW.19, Menteng, Kec. Bogor Bar., Kota Bogor, Jawa Barat 16111
.png)
.png)
.png)
Comments
Post a Comment