Application Design I / Task 2 : UX, UI, IxD Design Document

The process of understanding use behaviors, needs, and attitudes through various observation and feedback collection methods.
Effective UX research entails employing the appropriate methods at the right stages of product development.

Role of UX Design

Helps understand users' behavior, goals, motivations, and needs.
Reveals how users currently interact with a system and identifies their pain points.
Understanding user emotions during interaction is crucial.
Ensure that the design process is grounded in user understanding, ultimately leading to more effective and user-centered designs.

Role of UX Researches Duties

Developing coherent research methodologies.
Selecting and recruiting targeted end-users for research endeavors.
Conducting individual interviews with clients.
Utilizing data analysis tools to enhance consumer products.
Collaborating closely with the product team to steer future directions.

UX Research Comparison Chart

Iterative process - do something again and again, correct it as you go.

Integrated Process

The Value of User Experience Research

User Benefits

Uninfluenced by investors or company leaders, it maintains reliability.
It acts as a bridge between users and the company, fostering improved understanding and communication.

Business Benefits

Expediting product development.
Minimizing redesign costs.
Enhancing user satisfaction.

Product Benefits

It provide insights into the end user, their usage patterns, and the core issues addressed by the product.
It aids in decision-making regarding various design solutions.
Direct customer feedback unveils preferred usage scenarios, pain points addressed by the product, and avenues for enhancing product design.

The 5 Steps of UX Research

Objectives
Hypothesis
Methods
Conduct
Synthesize

UI/UX Document

Online survey
Interview
User Persona
Card Sorting (See lecture 5)
Information Architecture Map
Flow Chart

Qualitative & Quantitative Comparison Chart

When do we use these research methods?

ATTITUDINAL VS. BEHAVIORAL RESEARCH CHART

---------------------------------------------------------------------------------------

UX research METHOD: INTERVIEW

Explore user attitudes, beliefs, and experiences related to a product.
Normally one user at a time, lasting between 30 minutes to an hour and can be conducted face- to-face, over the phone, or via video streaming. (For us tho, recommend under 15 minutes)
You can observe both what the user says (verbal cues) and their body language or facial expressions (nonverbal cues). These observations help you understand if the user feels positive (enthusiasm) or negative (discomfort) about the product or service.

Process

Pros and Cons of Interview

Pros

Users provide detailed insights into their attitudes, desires, and experiences.
Allows addressing and clarifying individual concerns and misunderstandings immediately.

Cons

Interviews are time-consuming per participant.
Requires preparation, conducting, analysis, and sometimes transcription.
Limits sample size, which can be problematic.
Data quality depends on the interviewer's skill.

UX research METHOD: ONLINE SURVEY

Research tools comprising questions aimed at gauging user preferences, attitudes, and opinions on a given topic.
They are commonly conducted online, available in various lengths and formats, with data collected automatically and often analyzed by the survey tool.
They help uncover user demographics, goals, and information needs.
Users might describe their behaviors or preferences differently from how they act in real situations, affecting the validity of the research findings.

Process

Pros and Cons of Online Survey

Pros

Conducted online, allows for rapid and inexpensive data collection.
Anonymity often leads to more candid/honest responses.

Cons

Ensuring a representative sample is challenging, particularly from social media or general forums.
Poorly crafted or leading questions can bias responses.
Lengthy surveys may discourage participation.

Avoid leading questions

Leading Question

"What do you dislike about our workout tracking feature?"

• This question assumes the user has negative feelings about the feature, which can bias their response.

Neutral Question

“Can you describe your experience using the workout tracking feature?”

• This question is neutral and allows the user to provide their honest feedback, whether positive or negative, leading to more genuine and valuable insights.

---------------------------------------------------------------------------------------

Usability testing

Evaluating a product or service with representative users.
Participants are tasked with completing specific actions while observers record notes.
The primary aim is to detect usability issues, gather qualitative data, and assess overall user satisfaction.
It doesn't yield large feedback samples like questionnaires.

---------------------------------------------------------------------------------------

Research Plan with interview

page 1

Research goals
Timeline
Participants
Methods and logistics

page 2

Intro speech
Questions list
Outro and thanks

Lecture 5: Card Sorting Method

Fig 1.2 - Card Sorting Method

What is Card Sorting

A powerful method to understand how users group and categorize information.
Helps determine an organization scheme that aligns with the user's mental models.
Informs the design of navigation menus, website or app architecture and content strategy.

Card sorting entails displaying users a collection of cards, each containing a piece of information like a page title, menu item, or product category.

Types of Card Sorting

1. Open

Participants create their own categories.
Ideal for understanding how users intuitively organize information
No predefined categories involved

2. Closed

Participants sort cards into predefined categories.
Useful for testing specific grouping.
Ideal when a basic structure is already in place.

3. Hybrid

Hybrid card sorting blends open and closed card sorting.

4. Remote

Participants sorts cards using online tools.
Convenient for reaching a boarder, move diverse audience.

5. Moderated

Facilitator is present for study sessions.
For qualitative insights (15 samples)

6. Unmoderated

Facilitator is not present.
For quantitative data collection (>50 samples)
faster and less expensive

Pros and Cons of Card Sorting

Pros

Ease of Use and Cost-Effectiveness
Efficiency in Gathering Data
Direct User Input

Cons

Dependency on Participants
Content-Centric Focus
Time-Consuming Data Analysis

Lecture 6: User Persona

Fig 1.3 - User Persona

Purpose of User Personas

Help understand real user needs for better problem statements.
Guide design decisions by aligning designs with actual user behaviors.
Prevent bias or assumptions by using real data.
Improve adoption and retention by addressing user pain points.
Support feature prioritization using persona–feature scoring matrices.

Qualities of an Effective Persona

Use real data from surveys and interviews.
Focus on present behaviors, not stereotypes.
Context-specific information relevant to your app.
Avoid biases in content, names, and images.

What to Include in a Persona

Answer questions like:

Who are my users?
What are their behaviors and trends?
What do they need or want?
What problems do they face?

Include:

Personal characteristics
Attitudes & values
Motivations & goals
Needs & pain points
Scenarios & user quotes

Class Group Activity: Creating User Persona

During this class, we were split into group to make a user persona for a food delivery app. We choose to do customer persona.

Lecture 7: User Journey Map & Digital Card Sorting

Fig 1.4 - User Journey Map

What is User Journey Map?

A user journey map shows the step-by-step path a user takes to reach a goal.

It helps designers understand the user experience more clearly, build empathy for their emotions, and spot pain points or frustrations during the interaction.

Best practice for User Journey Map

Ties back to each of the personas (either by name or intro)
Clearly outlines each of the main steps
functional & emotional (the user does x & feels/ thinks/ reacts y)
References user & business objectives for the journey

6 Criteria for Creating User Journeys

1. Identify Who

Decide which persona you’re mapping.

2. Identify What

Choose the goal or task the journey will focus on.

3. Define Style

Decide the emotional + functional tone of the journey.

4. Define Steps

Sketch or write out the sequence of user actions.

5. Do It Digitally

Pick the best tool or platform to visualize it.

6. Identify Role

Clarify the user’s role or context within the journey.

Class Group Activity: Creating User Journey Map

Continuing from the previous , we were back into our groups and need to make the user journey map for the customer persona.

We forgot about the pain points and opportunity in the map. :p

Lecture 8: Site Map & User Flow Diagram

Fig 1.5 - -Site Map & User Flow Diagram

What is site map?

A footprint showing how each page relate to the web/app’s hierarchy. It guides the user's attention and organizes content meaningfully.

Shows overall content organization
Uses boxes (pages) and lines (relationships)
Helps designers plan clear navigation
Card-sorting results inform the final structure

What is User Flow?

The user’s path to finish a specific purpose. It includes each step, from the starting point to the endpoint.

Visualizes all user interactions
Focuses on task completion
May include multiple paths depending on user choices
Helps identify issues and improve usability

Why Use User Flow Diagrams?

1. Design Precision

User flows show the exact sequence of screens, helping designers create a clear, logical, and intuitive path for users.

2. Unified Team Vision

They act as a shared blueprint that everyone (designers, developers, and product managers) can easily understand.

3. Refine User Experience

User flows allow continuous improvement by revealing where the experience can be optimized.

4. Facilitate User Testing

They help create testing scenarios, letting users walk through tasks and give feedback on usability.

5. Proactive Issue Detection

Mapping the flow early helps identify potential pain points before real users encounter them.

How to Create a User Flow

1. Research Your Users

Understand who your users are—their needs, behaviors, and how they interact with your product.

2. Define the Purpose & Goals

Clarify what the user flow is for.

Include both company goals (e.g., conversions) and user goals (e.g., smoother experience).

3. List All Possible Steps

Map out every action the user might take.

Do this early to avoid missing important paths.

4. Create the User Flow

Use paper or digital tools to draw the path clearly.

Include flowchart shapes if needed.

5. Review & Update

Share the flow with your team, get feedback, and refine it.

Class Group Activity: User Flow Diagram

This time, also back in groups, we needed to make the User Flow Diagram of the customer ordering food from the food delivery app.

Instructions

Module Information Booklet

Task 2 : UX, UI, IxD Design Document (20%)

After locking down their App concept and idea, students are now ready to proceed to UX design. Students are required to produce a comprehensive UX design document which will provide better directions for them to design the app. Based on the information gathered in task 1, students will :

Determine and verify their target audiences
Outline the content element of their app
Exercise card sorting method to achieve optimum information architecture
Listing the app features
Identifying the app’s MVP.
Create wireframes of the screens
Plan the user interaction and interactivity

-------------------------------------------------------------------------------

Getting started: Research phase

For this task, we need to do research to identity my app's potential users, and determine what feature to have in the redesigned app.

Card sorting part 1

Continuing from task 1, I compiled and analysed all features that my chosen app, its competitor apps, and left field apps have.

Fig 2.1 - Extracting and Organising app features

Then grouped similar features into categories based on their function, such as:

- Account/Profile things

- Community

- Settings/Quality of Life

- Sticker Packs

- Collaboration

- Export/Downloads/Share

- Sticker Making Tools

- Discovery/Finding/Search function

- Search bar features

- Tags/Metadata

- Premium/Money Making/ads

Fig 2.2 - Making the card sorting board

--------------------------------------------------------------------------------------------

Interview & Survey

Once card sorting is done, I prepared my interview and survey to gather potential user data.

Live interview questions

When making the interview questions, I designed them to:

Understand users' chatting habits and how stickers fit into conversations.
Learn how users discover and search for new stickers.
Identify challenges in finding specific stickers.
Understand experiences, motivations, and issues in sticker creation.
Find opportunities to improve discovery, creation, and organization features.

Fig 2.3 - Interview questions

Live interview session

We needed to get 5 interviews done interview, so I went around asking to get interviews from people I know that uses stickers in chats.

The interview sessions are done either in-person or online, and lasted around 5-10 minutes.

I recorded each interview session, transcribed them, and then summarised each interview session and arranged them in the figjam.

Fig 2.4 - Interview overview

Interview audio and transcript: https://drive.google.com/drive/folders/1SPj2iYlIAKjBu3-sppeQhrmGl3GbawQD?usp=drive_link

Online Survey Questions

For the survey, I asked relatively the same questions as interview, but to get data from a wider audience.

Fig 2.5 - Survey questions

Online Survey session

The survey is conducted using Google forms. The target is to collect at least 20 responses

Thanks to the power of family, friend, and connections, I collected 37 responses in the end.

Fig 2.6 - Survey overview

Survey data sheet: https://docs.google.com/spreadsheets/d/1yCLmyoBwxGiv0RtLe-lTFSUomjU6txWc9diJgklES0o/edit?usp=sharing

--------------------------------------------------------------------------------------------

Findings

After collecting data from the interviews and survey, I analysed them and here are my findings:

Fig 2.7 - Research insights

--------------------------------------------------------------------------------------------

Affinity mapping

Using the findings I got, I built an affinity map to organize and group related insights from my research.

Each cluster represents a key theme, such as

Messaging Habits

Fig 2.8 - Messaging Habits

Discovery & Sticker Creation

Fig 2.9 - Discovery and Sticker creations

Pain Points

Fig 2.10 - Pain points

User wants & Suggestions

Fig 2.11 - User wants & Suggestions

Using the affinity map as a guide, I also created 6 ‘I want’ statements that reflect key user needs and desires, and to use for building the personas,

Fig 2.12 - "I want" statements

--------------------------------------------------------------------------------------------

Personas

Using insights from the affinity map and the ‘I want’ statements, I created 3 user personas. 1 persona focuses on sticker usage, another emphasizes sticker creation, and the third balances both.

Persona 1: The Super Sticker User

Fig 2.13 - Persona 1: The Super Sticker User

Persona 2: The Sticker Creator

Fig 2.14 - Persona 2: The Sticker Creator

Persona 3: The Casual User

Fig 2.15 - Persona 3: The Casual User

--------------------------------------------------------------------------------------------

User Journey Map

Here, I have made user journey maps based of their respective persona. The journey will help highlight the potential paint point the user may face when using the sticker app.

At each touchpoint, we were asked to add +3 opportunity ideas to each touchpoints (the emoji) , these opportunity ideas may contain good features or ideas I could add into my sticker app.

Journey Map 1: The Super Sticker User

Fig 2.16 - Journey Map 1: The Super Sticker User

Journey Map 2: The Sticker Creator

Fig 2.17 - Journey Map 2: The Sticker Creator

Journey Map 3: The Casual User

Fig 2.18 - Journey Map 3: The Casual User

--------------------------------------------------------------------------------------------

Card Sorting Part 2

Fig 2.19 - opportunity from journey map

With all the new opportunities from the journey maps, I added all those ideas into the card sorting.

So now the board looks like this (new items: orange sticky note):

Fig 2.20 - Updated Card Sorting (added orange sticky note)

--------------------------------------------------------------------------------------------

Sitemap

Looking at the card sorting board, I extracted suitable features from the board created my sitemap to lay out the foundation of of the new app layout.

It organizes the app’s features and content logically, showing the structure and relationships between different screens.

Fig 2.21 - Sitemap

My vision is to create a simple, user-friendly sticker app, focused on a persona who values sticker discovery and basic sticker-making tools, without the heavy creation or very advanced organization/discovery features of Persona 1 and Persona 2.

This approach ensures the app is easy to use, fun, and not overwhelming, catering to casual users who enjoy both using and lightly creating stickers

---------------------------------------------------------------------------------------

User Flow Chart

For the flow chart, I choose to use the Casual User persona because designing the user flow chart for this persona ensures the app supports both sticker users and beginner sticker creators while keeping the user experience simple and accessible.

Fig 2.22 - User Flow Chart

---------------------------------------------------------------------------------------

Final proposal slides

Task 2 - Application Design

Feedback

Week 5:

(No feedback)

Week 6:

(No feedback)

Week 7:

(No feedback)

Week 8:

- have 3 opportunities for every touchpoint on the user journey map.

Week 9:

(No feedback)

Reflections

Gathering user data was a hard, I learned how to make proper interview questions to get the insights/data I want.

Building the user personas and journey maps helped me identify users’ pain points more accurately and understand what users actually want in a sticker app.

Card sorting and sitemap making helped me to determine which features should go where, and how the app layout will be like.

Overall, app design isn’t easy, especially when you work alone, because there are so many things to think about. Even though the user research part took a lot of effort, it helped me understand my users better and make good design decisions for my app.

Search This Blog

Rachel Ng Jie Ting (0378902)