Application Design 1 - Project 2: UI/UX Design Document
Week 5 - Week 9
IAN CHOO XIN ZHE / 0369451
Application Design 1 / Bachelor of Design (Honours) in Creative Media
INSTRUCTIONS
After finalizing their app concept and design idea, students are now prepared to transition to the UX design phase. This next step requires them to create a detailed UX design document, which will serve as a guide for structuring and designing the app effectively. The document aims to consolidate the information gathered from the initial research, providing a foundation for developing a user-centric interface.
Using insights from the research in Task 1, students will begin by identifying and validating their target audiences to ensure that the app aligns with users’ needs and preferences. They will then focus on organizing the app's content by employing the card sorting method, a process designed to help establish an optimal information architecture for easier navigation. Key app features will also be outlined, along with the identification of the Minimum Viable Product (MVP) to prioritize essential elements for development.
The UX documentation will further include wireframes for primary screens, visually mapping out the app’s main pages and layout. Lastly, students will create a flowchart to illustrate the user interaction and interactivity within the app, providing a blueprint of the app’s intended user journey and enhancing overall usability.
|
| Fig 1.1 Card Sorting In Class |
|
| Fig 1.2 Card Sorting Group |
This week, our class focused on the concept of card sorting as part of understanding user experience design. To gain hands-on experience, we participated in a physical card sorting activity during class, which helped us grasp how this method is used to organize and structure information effectively. For the activity, we applied card sorting to a traveling app, allowing us to explore how users might categorize and prioritize features in such an application. This practical approach gave us valuable insights into improving app usability through thoughtful information architecture.
Project 2 Requirements & Progress
Required info in the slides:
1. Introduction
- Purpose and Scope: Explain the purpose of the document and what it covers
- Target Audience: Identify the intended users of the app
- Problem Statement: Describe the problem the app aims to solve
- Weakness of the apps: User experience and user interface
2. User Research
- Survey Questionnaire and Interview: Provide detailed analysis
- User Persona: Include detailed personas representing the target users
- User Journey Map: Provide a map outlining the steps users will take while interacting with the app
- Research Insights: Explain how user research influenced design decisions
3. Information Architecture
- Card Sorting Method: Explain the card sorting process used to organize content and its outcomes.
- Information architecture map: Outline the main content and features of the app.
- User Flow Chart: Describe how content will be structured for optimal usability.
4. MVP (Minimum Viable Product) Features
- Feature List: Detail all app features.
- MVP Identification: Identify and highlight the features that will be included in the MVP for initial development.
Card Sorting
After the in-class activity, I proceeded to conduct a digital card sorting exercise for my chosen app. I utilized UXTweak, a user experience testing platform, to set up the card sorting activity and distributed it to seven users. These participants were tasked with sorting the cards into predefined categories, providing insights into how users naturally organize information within the app. This step allowed me to gather valuable feedback to refine the app's structure and ensure a more intuitive user experience.
View the card sorting here: https://study.uxtweak.com/cardsort/WCk24Cd5i0xTvPMi47KUn
|
|
Fig 1.3 Card Sorting Progress |
User Survey & Interview
Moving on to the interview and survey phase, I began by defining the main goals for both methods to ensure my questions were focused and relevant. With clear objectives in mind, I designed the survey and interview questions to gather insights about user experiences and preferences. After refining the questions, I sought and obtained approval from Mr. Zeon. Following this, I distributed the survey questionnaires to gather broader data and started reaching out to Steam users to schedule interviews for more in-depth feedback.
Access the survey here: https://docs.google.com/forms/d/e/1FAIpQLSfle1C31k3KaRaRWIiMVVhNKl-X-2OqzHxIHCaJ50hrcWwLPQ/viewform
Access the interview questions here: https://docs.google.com/document/d/1Bd9qJXGqxyBQymcNzzYXlSKEdtYHfNJVBAGiUy4QNLA/edit?tab=t.0#heading=h.l5y1vee42i87
User Journey Map
Next, I developed the user journey map, an essential tool for visualizing the steps and experiences users go through when interacting with the Steam app. This process helps identify pain points, opportunities for improvement, and critical touchpoints in the user experience. The user journey map serves as a guide to design solutions that align with user needs and expectations, ensuring a more seamless and enjoyable interaction with the app.
User Flow Chart
Following the user journey map, I created the user flow chart. This diagram outlines the paths users take to complete specific tasks within the Steam app, such as browsing games, managing their library, or purchasing items. The user flow chart is crucial for identifying potential bottlenecks or areas of confusion in the navigation process. It also helps in designing a more intuitive app structure by ensuring that every action flows logically, enhancing overall usability and efficiency.
Final Project 2: UI/UX Design Document
App Design Task 2 Presentation by Ian Choo Xin ZheFinal Presentation on Youtube: https://youtu.be/RoFgR6gds_0
FEEDBACK
Week 6
Deepavali Holiday
Week 7
Card Sorting:
Survey Questions:
- add in a user demographic section
- remove all leading questions, try to make them all as neautral as possible
- show screenshots of Steam app interface in the questions
- make the last few questions regarding feedback from survey participants open ended instead of multiple choice
Week 8
Week 9
Digital Card Sorting:
- Use UXTweak, ignore the 100% cards, include the 50% ones as it has card limitation.
- User persona okay for now, update after collecting data from survey & interviews.
REFLECTION
Experience
Working on this project so far has been a mix of challenges and learning opportunities. From card sorting to interviews and mapping user journeys, I’ve gained hands-on experience with techniques I hadn’t fully explored before. Each step felt like a piece of a larger puzzle, helping me understand user behavior and app functionality more deeply. While some tasks were straightforward, others required trial and error to get them right, especially when trying to find participants for surveys and interviews.
Observations
I noticed that physical card sorting in class was a great way to engage and grasp the concept quickly, while digital card sorting with real users provided more practical insights. People had varying opinions about how categories should be organized, which highlighted the diversity in how users think. The survey and interviews also made me realize how different user goals can be, even within the same app, and how important it is to design for those varied perspectives.
Findings
One key finding was the importance of clear navigation paths in a complex app like Steam. Many users struggle with cluttered interfaces or unclear categorizations, which can hinder their experience. The user journey map and flow chart made it clear where these pain points exist and offered a clear direction for improvement. Additionally, collecting real user input reinforced the idea that involving users in the design process leads to more informed and effective decisions.
FURTHER READING
mind inventory: Benefits of Mobile App Design: Why Should You Invest In It?
SMARTDEV: The Importance of UX/UI Design in Mobile App Development
CAREER FOUNDRY: What Is a User Interface, and What Are the Elements That Comprise One?
Comments
Post a Comment