SlideShare a Scribd company logo
Introduction to
UI/UX Design
UI/UX Design Class for Beginner
Apa itu UI & UX?
1
Element of UX Design
2
Proses UX Design
3
Pro-Tips untuk Pemula
4
Credit to Pablo Stanley
Outline materi
Apa itu UI & UX?
UI is the design of user interfaces for machines and
software, such as computers, home appliances,
mobile devices, and other electronic devices, with
the focus on maximizing usability and the user
experience.
User Interface
UX is the process of supporting user behavior
through usability, usefulness, and desirability
provided in the interaction with a product.
User Experience
UX UI
What you see & do
when you use a thing
What you feel when
you use a thing
UX Design ditemukan oleh
Don Norman pada 1995
UX UI
User Research Information Architecture
Personas
Journey Mapping Task Analysis
Usability Metric Wireframing
Usability Testing
UI Styleguide UI Mockup
Prototyping
User Flow
Interaction Design
DesignOps
Design Handoff
UI Trends
Element of UX Design
The Five Planes of UX Design
Strategy
Scope
Structure
Skeleton
Surface
Concrete
Abstract
Menetapkan kebutuhan user
Apa permasalahan yang akan
dipecahkan?
Siapa target usernya? Apa
kebutuhan mereka?
•
•
•Idetifikasi solusi yang dapat
mencapai tujuan bisnis
Menetapkan objektif Product/Business
Credit to Pablo Stanley
Strategy Plane
Scope Plane
Menetapkan spesifikasi fungsional
Menentukan kemampuan sistem dalam
menunjang fungsionalitas produk
•
•
Memberi detail strategi informasi yang
sesuai dengan Brand Communication
•
Menjelaskan bagaimana sistem
melakukan komunikasi ke user
Menetapkan kriteria konten
Credit to Pablo Stanley
Structure Plane
Menetapkan Interaction Design
Mendeskripsikan bagaimana
merespon aktivitas user
•
•Mendesain informasi yang diklasifikasi
menjadi beberapa kelompok agar dapat
memahami struktur produk dengan
mudah
Menetapkan model Information Architecture
Credit to Pablo Stanley
Skeleton Plane
Menetapkan Interface Design
Mendesain elemen yang dapat berjalan secara
fungsional
•
Menetapkan Information Design
Menetapkan elemen informasi yang dapat
memberikan penjelasan untuk masing-masing
fungsionalistas
•
•Mendesain tampilan utama yang dapat
mempermudah user dalam menavigasikan produk
Menetapkan Navigation Design
Credit to Pablo Stanley
Surface Plane
Menetapkan Sensory Design
Menentukan susunan informasi
yang akan di tampilkan secara
visual
•
Menentukan respon sistem pada
saat user melakukan suatu action
(suara/visual)
•
Credit to Pablo Stanley
Strategy Scope Structure Skeleton Surface
Problem
Statement
Target User
Business Goals
Product
Objective
BrandComm
Information
Strategy
Kemampuan
Sistem
Interaction
Design
Information
Architecture
Interface
Design
Information
Design
Navigation
Design
Visual Design
Respon
Sistem
Strategy Scope Structure Skeleton Surface
Proses UX Design
User-Centered Design
Design
Thinking
Design
Sprint
Lean
UX
User-Centered Design
Identify Need
Specify Context
of Use
Specify
Requirement
Produce Solution
Design
Evaluate
Design
Design Thinking
Design Sprint 2.0
Lean UX
Hal yang perlu diingat
Tidak semua design process harus
dilakukan di setiap situasi/kondisi
1
Design process hanya
mempermudah dalam mencari solusi
2
Dalam sesi workshop harus saling menghormati
3
Usahakan ada sponsor dalam sesi workshop
4
Bisnis
User
IT
Sweet Spot
Area
Pro-Tips untuk Pemula
Tips UX Design untuk pemula
Cari permasalahan di sekitarmu
(bisa jadi apapun)
1
Credit to Pablo Stanley
Gali lebih dalam untuk
permasalahan yang dihadapi user
2
Buat solusi desain
3
Dokumentasikan setiap proses dan tulis di Medium
5
Evaluasi setiap solusi dengan Usability Testing
4
Credit to Pablo Stanley
Ulangi lagi, lagi, dan lagi…
Hingga kamu terlatih untuk dapat mengetahui kebutuhan user
Mulai dari aplikasi yang paling kamu
suka (contoh: Instagram or Tiktok)
1
Tips UI Design untuk pemula
Desain sama persis dengan aplikasi
tersebut
2
Identifikasi setiap aturan UI
3
Ulangi terus sampai kamu jago
4
Mulai membuat eksplorasi desain UI
5
Credit to Pablo Stanley
Refactoring UI
by Adam Wathan & Steve Schoger

More Related Content

What's hot

What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)
iFactory Digital
 
What is UI/UX and the Difference
What is UI/UX and the DifferenceWhat is UI/UX and the Difference
What is UI/UX and the Difference
Vibloo
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
Matin Maleki
 
Introduction to UX Research
Introduction to UX ResearchIntroduction to UX Research
Introduction to UX Research
Josh (Adi Tedjasaputra)
 
Fundamental of UI_UX - Developer Student Clubs.pptx
Fundamental of UI_UX - Developer Student Clubs.pptxFundamental of UI_UX - Developer Student Clubs.pptx
Fundamental of UI_UX - Developer Student Clubs.pptx
YOSAFAT11
 
Introduction to UI UX
Introduction to UI UXIntroduction to UI UX
Introduction to UI UX
GDSCUniversitasMatan
 
Desain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UXDesain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UX
Nur Fadli Utomo
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
CHI UX Indonesia
 
The Importance of UX
The Importance of UXThe Importance of UX
The Importance of UX
Bart Van Hecke
 
Ux/ui Design Solution Services
Ux/ui Design Solution ServicesUx/ui Design Solution Services
Ux/ui Design Solution Services
deorwine infotech
 
UI UX design.docx
UI UX design.docxUI UX design.docx
UI UX design.docx
RiniyaMary
 
A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentation
aayush_jain_87
 
UI & UX Design for Startups
UI & UX Design for StartupsUI & UX Design for Startups
UI & UX Design for Startups
Richard Fang
 
UX/UI Design 101
UX/UI Design 101UX/UI Design 101
UX/UI Design 101
Jasmine Phan
 
i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design  i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design
GDGKuwaitGoogleDevel
 
Basics of UX Research
Basics of UX ResearchBasics of UX Research
Basics of UX Research
The Wisdom Daily
 
UX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLESUX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLES
Jeremy Robinson
 
Ux is not UI
Ux is not UIUx is not UI
Ux is not UI
Bruno Mendes
 
Ux design process
Ux design processUx design process
Ux design process
Junying Chang
 
UX/UI Design and How It Works
UX/UI Design and How It WorksUX/UI Design and How It Works
UX/UI Design and How It Works
Aciron Consulting
 

What's hot (20)

What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)
 
What is UI/UX and the Difference
What is UI/UX and the DifferenceWhat is UI/UX and the Difference
What is UI/UX and the Difference
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
 
Introduction to UX Research
Introduction to UX ResearchIntroduction to UX Research
Introduction to UX Research
 
Fundamental of UI_UX - Developer Student Clubs.pptx
Fundamental of UI_UX - Developer Student Clubs.pptxFundamental of UI_UX - Developer Student Clubs.pptx
Fundamental of UI_UX - Developer Student Clubs.pptx
 
Introduction to UI UX
Introduction to UI UXIntroduction to UI UX
Introduction to UI UX
 
Desain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UXDesain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UX
 
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
 
The Importance of UX
The Importance of UXThe Importance of UX
The Importance of UX
 
Ux/ui Design Solution Services
Ux/ui Design Solution ServicesUx/ui Design Solution Services
Ux/ui Design Solution Services
 
UI UX design.docx
UI UX design.docxUI UX design.docx
UI UX design.docx
 
A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentation
 
UI & UX Design for Startups
UI & UX Design for StartupsUI & UX Design for Startups
UI & UX Design for Startups
 
UX/UI Design 101
UX/UI Design 101UX/UI Design 101
UX/UI Design 101
 
i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design  i/o extended: Intro to <UX> Design
i/o extended: Intro to <UX> Design
 
Basics of UX Research
Basics of UX ResearchBasics of UX Research
Basics of UX Research
 
UX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLESUX RULES: 10 ESSENTIAL PRINCIPLES
UX RULES: 10 ESSENTIAL PRINCIPLES
 
Ux is not UI
Ux is not UIUx is not UI
Ux is not UI
 
Ux design process
Ux design processUx design process
Ux design process
 
UX/UI Design and How It Works
UX/UI Design and How It WorksUX/UI Design and How It Works
UX/UI Design and How It Works
 

Similar to 1 introduction to uiux

Understanding UX as Developer
Understanding UX as DeveloperUnderstanding UX as Developer
Understanding UX as Developer
Faizal Rahman Hakim
 
PDKT WITH UIUX DESIGN.pdf
PDKT WITH UIUX DESIGN.pdfPDKT WITH UIUX DESIGN.pdf
PDKT WITH UIUX DESIGN.pdf
SriIndarti24
 
UX Design.pptx
UX Design.pptxUX Design.pptx
UX Design.pptx
RiskaDhenabayu
 
UX Design Process - Developer Student Clubs.pptx
UX Design Process - Developer Student Clubs.pptxUX Design Process - Developer Student Clubs.pptx
UX Design Process - Developer Student Clubs.pptx
YOSAFAT11
 
UI & UX kel 5.pptx
UI & UX kel 5.pptxUI & UX kel 5.pptx
UI & UX kel 5.pptx
rifqiarif6
 
UX Fundamental - UX Afdan.pptx
UX Fundamental - UX Afdan.pptxUX Fundamental - UX Afdan.pptx
UX Fundamental - UX Afdan.pptx
Afdan Rojabi
 
UI UX
UI UXUI UX
Interaksi Manusia Dan Komputer 5
Interaksi Manusia Dan Komputer 5Interaksi Manusia Dan Komputer 5
Interaksi Manusia Dan Komputer 5
Hide Maru
 
Study Jam UIUX_Meet 1.pdf
Study Jam UIUX_Meet 1.pdfStudy Jam UIUX_Meet 1.pdf
Study Jam UIUX_Meet 1.pdf
AdiMasmudi
 
BAB_III1.pptx
BAB_III1.pptxBAB_III1.pptx
BAB_III1.pptx
Slamet Achwandy
 
07 UI _ UX DESIGN - Fundamental [2].pptx
07 UI _ UX DESIGN - Fundamental [2].pptx07 UI _ UX DESIGN - Fundamental [2].pptx
07 UI _ UX DESIGN - Fundamental [2].pptx
MaheswararivaiJamhur
 
Topic 1 - UI _ UX Overview.docx
Topic 1 - UI _ UX Overview.docxTopic 1 - UI _ UX Overview.docx
Topic 1 - UI _ UX Overview.docx
ChairilAnwarRamli
 
IMK-Pertemuan5.pptx
IMK-Pertemuan5.pptxIMK-Pertemuan5.pptx
IMK-Pertemuan5.pptx
RedyWinatha1
 
Game Development OK Pertemuan 9.pptx
Game Development OK Pertemuan 9.pptxGame Development OK Pertemuan 9.pptx
Game Development OK Pertemuan 9.pptx
dadanzuu
 
GITS Webinar: How to Build UI/UX Portfolio that Stand Out
GITS Webinar: How to Build UI/UX Portfolio that Stand Out GITS Webinar: How to Build UI/UX Portfolio that Stand Out
GITS Webinar: How to Build UI/UX Portfolio that Stand Out
GITS Indonesia
 
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHAKONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
AgusNugraha39
 
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
havorezi1
 
Materi Introduction to UIUX.pdf
Materi Introduction to UIUX.pdfMateri Introduction to UIUX.pdf
Materi Introduction to UIUX.pdf
ssusera99749
 
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
MULTIMEDIA 'n BROADCASTING SMKN 1 PUNGGING MOJOKERTO
 
Android umy-yogyakarta
Android umy-yogyakartaAndroid umy-yogyakarta
Android umy-yogyakartaWidy Priasmoro
 

Similar to 1 introduction to uiux (20)

Understanding UX as Developer
Understanding UX as DeveloperUnderstanding UX as Developer
Understanding UX as Developer
 
PDKT WITH UIUX DESIGN.pdf
PDKT WITH UIUX DESIGN.pdfPDKT WITH UIUX DESIGN.pdf
PDKT WITH UIUX DESIGN.pdf
 
UX Design.pptx
UX Design.pptxUX Design.pptx
UX Design.pptx
 
UX Design Process - Developer Student Clubs.pptx
UX Design Process - Developer Student Clubs.pptxUX Design Process - Developer Student Clubs.pptx
UX Design Process - Developer Student Clubs.pptx
 
UI & UX kel 5.pptx
UI & UX kel 5.pptxUI & UX kel 5.pptx
UI & UX kel 5.pptx
 
UX Fundamental - UX Afdan.pptx
UX Fundamental - UX Afdan.pptxUX Fundamental - UX Afdan.pptx
UX Fundamental - UX Afdan.pptx
 
UI UX
UI UXUI UX
UI UX
 
Interaksi Manusia Dan Komputer 5
Interaksi Manusia Dan Komputer 5Interaksi Manusia Dan Komputer 5
Interaksi Manusia Dan Komputer 5
 
Study Jam UIUX_Meet 1.pdf
Study Jam UIUX_Meet 1.pdfStudy Jam UIUX_Meet 1.pdf
Study Jam UIUX_Meet 1.pdf
 
BAB_III1.pptx
BAB_III1.pptxBAB_III1.pptx
BAB_III1.pptx
 
07 UI _ UX DESIGN - Fundamental [2].pptx
07 UI _ UX DESIGN - Fundamental [2].pptx07 UI _ UX DESIGN - Fundamental [2].pptx
07 UI _ UX DESIGN - Fundamental [2].pptx
 
Topic 1 - UI _ UX Overview.docx
Topic 1 - UI _ UX Overview.docxTopic 1 - UI _ UX Overview.docx
Topic 1 - UI _ UX Overview.docx
 
IMK-Pertemuan5.pptx
IMK-Pertemuan5.pptxIMK-Pertemuan5.pptx
IMK-Pertemuan5.pptx
 
Game Development OK Pertemuan 9.pptx
Game Development OK Pertemuan 9.pptxGame Development OK Pertemuan 9.pptx
Game Development OK Pertemuan 9.pptx
 
GITS Webinar: How to Build UI/UX Portfolio that Stand Out
GITS Webinar: How to Build UI/UX Portfolio that Stand Out GITS Webinar: How to Build UI/UX Portfolio that Stand Out
GITS Webinar: How to Build UI/UX Portfolio that Stand Out
 
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHAKONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
KONSEP PEMEROGRAMAN WEBSITE AAGUS NUGRAHA
 
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
2022.08.25-Siti Nurul-Role di Bidang UI UX Design_1.pptx
 
Materi Introduction to UIUX.pdf
Materi Introduction to UIUX.pdfMateri Introduction to UIUX.pdf
Materi Introduction to UIUX.pdf
 
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
Menerapkan prinsip desain user interface pada multimedia interaktif berbasis ...
 
Android umy-yogyakarta
Android umy-yogyakartaAndroid umy-yogyakarta
Android umy-yogyakarta
 

Recently uploaded

tugas1-Modul 1.4 Budaya Positif di Sekolah
tugas1-Modul 1.4 Budaya Positif di Sekolahtugas1-Modul 1.4 Budaya Positif di Sekolah
tugas1-Modul 1.4 Budaya Positif di Sekolah
Akhyar33
 
Model Seni terpadu model model model seni
Model Seni terpadu model model model seniModel Seni terpadu model model model seni
Model Seni terpadu model model model seni
AgusNugraha46
 
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdfHOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
HOTOGEL
 
PPT KEWARGANEGARAAN bsimillahirrah .pptx
PPT KEWARGANEGARAAN bsimillahirrah .pptxPPT KEWARGANEGARAAN bsimillahirrah .pptx
PPT KEWARGANEGARAAN bsimillahirrah .pptx
kangSantri23
 
“tahap setelah analisa dari siklus pengembangan sistem yakni berupa pendefin...
“tahap setelah analisa dari siklus pengembangan  sistem yakni berupa pendefin...“tahap setelah analisa dari siklus pengembangan  sistem yakni berupa pendefin...
“tahap setelah analisa dari siklus pengembangan sistem yakni berupa pendefin...
amallia7
 
Bahan Presentasi Bahasa Indonesia Di SD.pptx
Bahan Presentasi Bahasa Indonesia Di SD.pptxBahan Presentasi Bahasa Indonesia Di SD.pptx
Bahan Presentasi Bahasa Indonesia Di SD.pptx
ADELINKALENGKONGAN1
 

Recently uploaded (6)

tugas1-Modul 1.4 Budaya Positif di Sekolah
tugas1-Modul 1.4 Budaya Positif di Sekolahtugas1-Modul 1.4 Budaya Positif di Sekolah
tugas1-Modul 1.4 Budaya Positif di Sekolah
 
Model Seni terpadu model model model seni
Model Seni terpadu model model model seniModel Seni terpadu model model model seni
Model Seni terpadu model model model seni
 
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdfHOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
HOTOGEL - Situs Bandar Togel Terpercaya dan Toto Togel Hadiah Terbesar.pdf
 
PPT KEWARGANEGARAAN bsimillahirrah .pptx
PPT KEWARGANEGARAAN bsimillahirrah .pptxPPT KEWARGANEGARAAN bsimillahirrah .pptx
PPT KEWARGANEGARAAN bsimillahirrah .pptx
 
“tahap setelah analisa dari siklus pengembangan sistem yakni berupa pendefin...
“tahap setelah analisa dari siklus pengembangan  sistem yakni berupa pendefin...“tahap setelah analisa dari siklus pengembangan  sistem yakni berupa pendefin...
“tahap setelah analisa dari siklus pengembangan sistem yakni berupa pendefin...
 
Bahan Presentasi Bahasa Indonesia Di SD.pptx
Bahan Presentasi Bahasa Indonesia Di SD.pptxBahan Presentasi Bahasa Indonesia Di SD.pptx
Bahan Presentasi Bahasa Indonesia Di SD.pptx
 

1 introduction to uiux

  • 1. Introduction to UI/UX Design UI/UX Design Class for Beginner
  • 2. Apa itu UI & UX? 1 Element of UX Design 2 Proses UX Design 3 Pro-Tips untuk Pemula 4 Credit to Pablo Stanley Outline materi
  • 3. Apa itu UI & UX?
  • 4. UI is the design of user interfaces for machines and software, such as computers, home appliances, mobile devices, and other electronic devices, with the focus on maximizing usability and the user experience. User Interface
  • 5. UX is the process of supporting user behavior through usability, usefulness, and desirability provided in the interaction with a product. User Experience
  • 6. UX UI What you see & do when you use a thing What you feel when you use a thing
  • 7. UX Design ditemukan oleh Don Norman pada 1995
  • 8.
  • 9.
  • 10. UX UI User Research Information Architecture Personas Journey Mapping Task Analysis Usability Metric Wireframing Usability Testing UI Styleguide UI Mockup Prototyping User Flow Interaction Design DesignOps Design Handoff UI Trends
  • 11.
  • 12.
  • 13.
  • 14.
  • 15. Element of UX Design
  • 16. The Five Planes of UX Design
  • 18. Menetapkan kebutuhan user Apa permasalahan yang akan dipecahkan? Siapa target usernya? Apa kebutuhan mereka? • • •Idetifikasi solusi yang dapat mencapai tujuan bisnis Menetapkan objektif Product/Business Credit to Pablo Stanley Strategy Plane
  • 19. Scope Plane Menetapkan spesifikasi fungsional Menentukan kemampuan sistem dalam menunjang fungsionalitas produk • • Memberi detail strategi informasi yang sesuai dengan Brand Communication • Menjelaskan bagaimana sistem melakukan komunikasi ke user Menetapkan kriteria konten Credit to Pablo Stanley
  • 20. Structure Plane Menetapkan Interaction Design Mendeskripsikan bagaimana merespon aktivitas user • •Mendesain informasi yang diklasifikasi menjadi beberapa kelompok agar dapat memahami struktur produk dengan mudah Menetapkan model Information Architecture Credit to Pablo Stanley
  • 21. Skeleton Plane Menetapkan Interface Design Mendesain elemen yang dapat berjalan secara fungsional • Menetapkan Information Design Menetapkan elemen informasi yang dapat memberikan penjelasan untuk masing-masing fungsionalistas • •Mendesain tampilan utama yang dapat mempermudah user dalam menavigasikan produk Menetapkan Navigation Design Credit to Pablo Stanley
  • 22. Surface Plane Menetapkan Sensory Design Menentukan susunan informasi yang akan di tampilkan secara visual • Menentukan respon sistem pada saat user melakukan suatu action (suara/visual) • Credit to Pablo Stanley
  • 23. Strategy Scope Structure Skeleton Surface Problem Statement Target User Business Goals Product Objective BrandComm Information Strategy Kemampuan Sistem Interaction Design Information Architecture Interface Design Information Design Navigation Design Visual Design Respon Sistem
  • 24. Strategy Scope Structure Skeleton Surface
  • 27. User-Centered Design Identify Need Specify Context of Use Specify Requirement Produce Solution Design Evaluate Design
  • 31. Hal yang perlu diingat Tidak semua design process harus dilakukan di setiap situasi/kondisi 1 Design process hanya mempermudah dalam mencari solusi 2 Dalam sesi workshop harus saling menghormati 3 Usahakan ada sponsor dalam sesi workshop 4
  • 34. Tips UX Design untuk pemula Cari permasalahan di sekitarmu (bisa jadi apapun) 1 Credit to Pablo Stanley Gali lebih dalam untuk permasalahan yang dihadapi user 2 Buat solusi desain 3 Dokumentasikan setiap proses dan tulis di Medium 5 Evaluasi setiap solusi dengan Usability Testing 4
  • 35. Credit to Pablo Stanley Ulangi lagi, lagi, dan lagi… Hingga kamu terlatih untuk dapat mengetahui kebutuhan user
  • 36. Mulai dari aplikasi yang paling kamu suka (contoh: Instagram or Tiktok) 1 Tips UI Design untuk pemula Desain sama persis dengan aplikasi tersebut 2 Identifikasi setiap aturan UI 3 Ulangi terus sampai kamu jago 4 Mulai membuat eksplorasi desain UI 5 Credit to Pablo Stanley
  • 37. Refactoring UI by Adam Wathan & Steve Schoger