This document contains information about UX designer Pham Khoi including his contact details. It then provides definitions and explanations of key UX terms like UX, UI, personas, wireframing and visual design. The document outlines the UX design process and some common mistakes. It also provides examples of usability reviews using heuristics and examples from apps like F@st Mobile and My Mobifone. The document concludes with information about UX end-user testing methods and case studies of successful apps like Flipboard and Flappy Bird.

1. UX Designer/Consultant: Phạm Khôi
M: 0981-911-011. E: khoipng@gmail.com

2. UX?
Khi chân ướt chân ráo tới thung lũng Silicon,
tôi thấy đa số mọi người chỉ nói đến công
nghệ. Duy nhất chỉ có Steve Jobs là người
hiểu được rằng, không chỉ là công nghệ mà
cái quan trọng hơn là trải nghiệm của người
sử dụng
- John Scully,
Là doanh nghiệp tiêu dùng, chúng tôi không
bán sản phẩm mà bán sự trải nghiệm
- Apple

3. UX & UI
UX is not how it looks, UX is
how it works
- Steve Jobs
Don’t make me think

4. Why?
2007 - now
1977 - 2007… - 1977
Terminal: keyboard/monitor …+ Mouse/speaker/Wifi-ADSL
… + Touch/camera/mic/location/3G

5. UX Overview
UX
Software Business Logic
Deployment
UX Design, UX Consultation, End-User Testing…
Features, Work Flow…
End-user
Developer
Technical Leader,
Project Manager,
Software Architecture
IT:
Software Architecture
Auto scale, HA, DR, Effective Cost…
UXD Process
Heuristic Review,
A/B Testing..
Waterfall,
Agile Scrum,
CI
Cloud Computing,
Load Balance
CDN,

6. UX Services
6
UX Design Process UX Consultation End-User Testing
1. Visibility of system status
2. Match between system and
the real world
3. User control and freedom
4. Consistency and standards
5. Error prevention
6. Recognition rather than
recall
7. Flexibility and efficiency of
use
8. Aesthetic and minimalist
design
9. Help users recognize,
diagnose, and recover from
errors
10. CRAP
5 users has found 85% of
the usability problems

7. UX Design
UX Common mistakes?
UX Design Process:
- Personas & Business Objective
- Information Design &
Interaction Design. Wireframe.
- Visual Design

8. Personas & Business Objective
A. Objective
WHAT DO YOU WANT US TO REVIEW?
WHAT ARE YOUR BUSINESS GOALS?
B. Product Information
Products
1What is the main purpose of the product
1.1Goals
1.2End-Used
1.3Why do end-users use the product?
1.4What motivates end-users to use this specific product over a competitor's?
2Technical Information
3.1Name
3.2Version
3.3Devices & Plarform
3.4Customer
3.5Main features
3How will people use the product?
3.1What are the main work flows?
4What are the most popular screens/pages in the product?
5Comments from end users
5.1Positive comments
5.2Negative comments
6Is there anything else you think we should know?
6.1Environment of Use
End-users
5Who is the main user group?
2.1Profile
Age
Gender
Location (City, Country...)
Education
Learning Style
Occupation (Job, Position, Income...)
High level Responsibilities
Key Activities (or Tasks)
2.2Personality
Acceptance of Change
2.3Expertise
Computers and internet proficiency level
Language
Knowledge of the Business Domain
2.4Must Does / Must Never
Must Does
Must Never
2.5Devices & Platforms
2.6Users expectations and priorities
2.7Others
Disabilities
Organizational Culture

9. Wireframe

10. Visual Design
- iOS, Google Material
Design, Metro UI
guideline…
- Responsive, 960gs,
bootstrap,
foundation…
- Color Wheel
- Flat design

11. UX Designer có thực sự hiểu người dùng?
• Người dùng tập trung vào khuôn mặt
• Chất lượng của những thiết kế là
công cụ tạo nên độ tin cậy
• Hầu hết người dùng không dùng
thanh cuộn (77%)
• Sử dụng màu xanh cho các liên kết
• Hộp tìm kiếm lý tưởng có chiều rộng
bằng với 27 ký tự
• Hầu hết người dùng đều không quan
tâm đến quảng cáo

12. UX Review (Expert Review)
Heuristics Review
Visibility of system
status
User always knows
what is going on
Match between system
and the real world
Application should use
symbols, icons, format
and layout that users
are familiar with
User control and
freedom
Support undo, redo
functions, not punish
users for their mistakes
Consistency and
standards
The functions and UI
controls must behave
as the user experts
them to
Error prevention
By checking and
confirmation before
submit the action
Recognition rather
than recall
Minimize users
memory load. Users
don’t have to
remember other
information
Flexibility and
efficiency of use
Allow users to
personalize the UI and
to use shortcut
Aesthetic and
minimalist design
UI should look and
work beautifully and
the user’s data should
be kept safe and secure
Errors management
Help users to
recognize, diagnose
and recover from error
situations
CRAP Design Principles
Contrast + Repetition +
Alignment + Proximity

13. UX Review Examples
Match between system
and the real world
Consistency and
standards
Error prevention
Errors management

14. Example – F@st Mobile
@@! Con này nó xem
cái j thế nhỉ?
Chán quá! Toàn bọn vớ
vẩn! Trần nhà chả có
con thạch sùng nào!
Dịch đầu ra tao xem tí,
che hết cả rồi!
Tóc nó đẹp hơn tóc
mình!

15. Example – F@st Mobile
Hỗ trợ?
Touch?
Control?

16. Example – My Mobifone
Description?

17. UX End-user Testing
• 5 người sử dụng tìm
sẽ tìm ra 85% vấn đề
về UX - Jakob Nielsen
• Beta Testing
• A/B Testing

18. UX Case studies - Flipboard
• 100 million active
readers
• In late 2013 Flipboard
completed a Series C
round that boosted total
financing to $161 million
and hiked its valuation
to a reported $800
million

19. UX Case studies – Flappy bird
• Author: Nguyen Ha Dong
• Benefit: earning $50,000 a day
• Development duration: several days