The document outlines the early-stage UX design process for mobile applications, emphasizing the importance of user experience (UX) and usability defined by the 5 E's: ease of learning, engagement, efficiency, effectiveness, and error tolerance. It contrasts mobile and desktop environments, detailing the design process from inception to implementation while highlighting the necessity of understanding end user needs through research, feedback, and iteration. Use cases and example projects, such as a universal mobile payment app, demonstrate the application of these principles in real-world scenarios.

1. DESIGNING FOR MOBILE
EARLY STAGE
UX DESIGN PROCESS
Raine Qian

2. HI, I AM RAINE QIAN
Mobile UI and UX designer
Manager of Product Design at Pivotal Labs
@RaineQian

3. WHAT IS UX?
User experience is how a person feels when interacting with
a particular product, system or service.
BEHAVIORS ATTITUDES EMOTIONS

4. UX is a Systerm

5. USABILITY
Usability is how easy, efficient and enjoyable a
human-made object is to use.

6. 5 E of Usability
• Ease of learning : Learnability and Memorability
• Engagement
• Efficiency
• Effectiveness
• Error Tolerance

7. THE DISCIPLINES OF
USER EXPERIENCE DESIGN

8. PSYCHOLOGY: LOSS AVERSION
The strong tendency in humans to avoid loss, over and above
their desire to acquire gains.

9. OPTION 1 OPTION 2
Save $300/year.
Buy this widget!
Stop losing $300/year.
Buy this widget!

10. COGNITION: PERIPHERAL ATTENTION
Peripheral vision has faster reaction for
detecting motion in objects.

11. INVASIVE EFFECTIVE
!
!

12. UX DESIGN INCLUDES
ALL KINDS OF
DESIGN THINKING
FOR AN END USER.

13. MOBILE

14. MOBILE VS. DESKTOP

15. MOBILE DESKTOP
• Predictable environments
• Predictable inputs
• Large interface
• For detailed tasks
• Variable environments
• Limited input system
• Smaller interface
• In multitasking scenarios

16. LEAN FORWARD & LEAN-BACK EXPERIENCES

17. LEAN FORWARD
• Engaging
• Requires increased
interaction

18. LEAN BACK
• Low level of engagement
• Consumption mode
• Longer attention span

19. LEAN BACK APPS LEAN FORWARD APPS

20. DESIGN PROCESS
Identify the right problem for the right user
UNDERSTAND CREATE

21. 1. Inception
2. Discovery
3. Framing
4. Visual & Interaction Design
5. Implementation
DESIGN PROCESS
Feedback
+
Iteration

22. IN THE EARLY STAGES
Goals
End Users
Use Cases, Scenarios
User Needs, Wants, Motivations
Technical Feasibility
Deep
Understanding

23. GOALS
• What is the Purpose of the App?
• Client’s Goals User’s Goals
• Stay Focused and Prioritize

24. LEAN VALIDATION
WORKSHOP
• Collaborative with key
stakeholders
• Product proposition
• Feature prioritization

25. END USERS
• End user behavior
• Personas
• Focus on target user group

26. ETHNOGRAPHIC RESEARCH
• Observe target users in real
world setting
• Get insight into habits,
preferences and behavior
• Conduct your own practical
research

27. USE CASES, SCENARIOS
• Workflows
• Social context
• Environmental factors
• Errors or edge cases

28. PROJECT EXAMPLE
Universal Mobile Payment App

29. STORYBOARDING
A method used to
communicate ideas and
create a sense of shared
context and purpose.

30. USER EXPERIENCE MAP
A visual representation that illustrates a user’s activity flow,
mental status, expectations, and actions for a particular goal.

31. USER NEEDS, WANTS
& MOTIVATIONS
• Know the needs and
unvoiced desires
• User interviews
• Dig below the surface

32. PROJECT EXAMPLE
Designing An App For
A Cruise Ship

33. ONSITE USER RESEARCH

34. RESULTS OF CUSTORMER PRIMARY NEEDS
Assumed:
Fun activities on the
cruise ship
Actual:
Communicating with
fellow travellers

35. TECHNICAL FEASIBILITY
• Balance between design and
engineering
• Agile style and
communication
• Willingness to think about
the future

36. ALWAYS REMEMBER WHO YOU ARE DESIGNING FOR
AND WHY ARE YOU DESIGNING IT.

37. THANK YOU