Anda di halaman 1dari 14

Your Picture Here And Send To Back

User Interface (UI)


dan User Experience (UX)
User Interface (UI)
UI adalah bagian dari UX yang berupa tampilan visual
design sebuah sistem. Tampilan tersebut memungkinkan
pengguna terhubung dan berinteraksi dengan suatu produk. 
Selain berfungsi sebagai penghubung, UI juga berfungsi
untuk memperindah tampilan sehingga dapat meningkatkan
kepuasan pengguna. Namun, tak hanya harus indah, UI juga
harus mudah digunakan. 

Beberapa komponen UI diantaranya adalah komponen


tombol, ikon tipografi, tema, layout, animasi yang tampil
pada produk, dan visual interaktif lainnya. Semua komponen
UI tersebut didesain dengan berfokus pada keindahan dan
kemudahan pengguna. Jadi, pengguna dapat menikmati
produk Anda. 
User Experience (UX)
User Experience (UX) merupakan proses mendesain suatu
produk melalui pendekatan pengguna. Dengan pendekatan
ini, Anda jadi bisa menciptakan produk yang sesuai dengan
kebutuhan dan keinginan pengguna.

Adapun, komponen UX ini meliputi bagaimana fitur-fitur


yang disediakan pada produk, struktur desain, navigasi
penggunaan produk, aspek visual design, dan seluruh
aspek interaksi dengan pengguna. UX juga meliputi
bagaimana Anda menentukan branding, konten, dan
copywriting yang sesuai dengan target pengguna Anda. 
Perbedaan
User Interface (UI) dan
User Experience (UX) 
Tujuan Desain :
01 Desain UX dirancang untuk memberikan pengalaman yang menyenangkan
saat menggunakan produk.
Desain UI pada sebuah produk bertujuan untuk mempercantik tampilan produk.

Proses Desain:
02 Proses desain UX berlandaskan riset pengguna sehingga menghasilkan produk
yang disukai dan dibutuhkan oleh target pengguna. desain UI juga memerlukan
riset. Namun, riset yang dilakukan merupakan riset desain untuk membuat
desain yang menarik dan sesuai dengan konsep.

Tujuan Komponen Desain:


Desain 03
Komponen desain UX meliputi hampir seluruh komponen pada suatu produk
seperti fitur-fitur, struktur desain, dan navigasi. Komponen yang
membangun Desain UI berfokus pada keindahan tampilan produksi. komponen
Proses UI tersebut di antaranya meliputi warna, gambar dan video animasi,
Skill yg
Desain typography, buttons, dan visual interaksi lainnya. 
dibutuhkan
Tools yg digunakan:
04
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. Sementara untuk aplikasi desain UI yang tersedia seperti Flinto,
Principle, Frames X, Adobe illustrator, dll. 
Komponen
Tools yg Skill yg dibutuhkan:
Desain 05
digunakan 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. 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. 
Workflow Desain User Interface (UI) dan
User Experience (UX) 
2
Membuat 3
1 Information Membuat
Riset UX Architecture 4
Wireframe
Mengatur UX
Flow

6
Membuat
Design 7
System Mendesain
User 8
Interface Proses 9
5 pengembang
Membuat Design
an produk Usability
Prototype oleh
Desain UX Test
developer
Mengapa UI dan UX penting dalam
pengembangan website atau aplikasi ?

1. Menghasilkan Produk yang Dibutuhkan


Pengguna
2. Meningkatkan Kepuasan Pengguna Terhadap
Produk
3. Meningkatkan Penjualan dan Bisnis 
UI dan UX yang baik

Text Here UI Text Here UX

Konsisten. 
Konsistensi desain Mudah
dapat membantu digunakan (usability). 
pengguna untuk Mudah digunakan
mengerti pola artinya, pengguna
website atau aplikasi bisa menggunakan
Anda.  fitur-fitur aplikasi atau
website tanpa
Dengan begitu, membutuhkan effort
pengguna akan lebih yang berlebih.
mudah
menggunakan
produk Anda.
Mereka juga akan
lebih familiar dengan
produk-produk Anda
karena desain yang
konsisten. 
UI dan UX yang baik

Text Here UI Text Here UX

Responsif. Tampilan
website yang baik Memiliki
harus fleksibel di nilai (valuable). Berni
segala perangkat.  lai atau memiliki nilai
berarti fitur-fitur
Hal itu agar yang ada pada
pengguna bisa produk sesuai
melihat tampilan dengan kebutuhan
website atau aplikasi pengguna.
dengan baik di Jika produk tidak
perangkat desktop dibutuhkan oleh
maupun mobile.  pengguna, produk
tersebut belum
Dengan begitu, dikatakan
pengguna bisa tetap mempunyai nilai
mengakses website yang berharga meski
atau produk Anda di produk tersebut
mana saja dan kapan mudah digunakan. 
saja.  
UI dan UX yang baik

Text Here UI Text Here UX

Jelas dan
Ringkas. Tampilan Mudah untuk
website Anda harus didapatkan (Adoptab
terlihat jelas dan ility). Sebuah produk
ringkas agar yang bernilai
pengguna dapat seharusnya mudah
memahami informasi untuk didapatkan,
aplikasi atau website mudah dibeli, dan
Anda.  mudah diunduh
sehingga pengguna
bisa dengan mudah
untuk memulai
menggunakan
produk tersebut.  
UI dan UX yang baik

Text Here UI Text Here UX

Intuitif. Desain yang
intuitif secara Kesukaan (Desirable
sederhana artinya ). Istilah ini berkaitan
mudah dimengerti dengan perasaan
secara natural.  emosi tertentu.
Pengunjung jadi Misalnya, pengguna
dapat dengan mudah merasakan
memahami flow web pengalaman yang
site Anda tanpa menyenangkan saat
perlu membutuhkan menggunakan
sebuah manual produk tertentu.   
book.
UI dan UX yang baik

Text Here UI Text Here UX

Kontras Warna yang


Baik. 
Pemilihan warna
dalam desain
interface sangatlah
penting. 
Kontras warna yang
baik akan
memudahkan
pengguna membaca
dan memahami
informasi. 
UI dan UX yang baik

Text Here UI Text Here UX

Informasi
Terstruktur. 
Desain UI yang baik
tidak hanya harus
indah, namun juga
mudah untuk
digunakan.

Anda mungkin juga menyukai