Application Design I / Project 2: UI/UX Design Document
5.5.2023 - 9.6.2023 (Week 5 - Week 10)
Takuto Hozumi / 0354047 / Bachelor Of Design (Hons) In Creative Media
Application Design I
Project 2: UI/UX Design Document
LECTURE
Week 5 Introduction To User Experience Research
UX Research
UX research is the process of understanding user behaviors, needs, and attitudes using different observation and feedback collection methods. One of the other benefits of user experience research is that it helps us understand how people live their lives so we can respond to their needs with informed design solutions. Good UX research involves using the right method at the right time during the development of a product.
The 5 Steps of UX Research
The Research Learning Spiral, created by Erin Sanders, provides five main steps for conducting UX research. The first two steps are about forming questions and hypotheses, and the last three steps are about gathering knowledge through selected UX research methods.
- Objectives: What are the knowledge gaps we need to fill?
- Hypotheses: What do we think we know about our users?
- Methods: Which methods should we choose based on time and manpower?
- Execution: Collect data using the selected methods.
- Synthesize: Fill in the knowledge gaps, prove or disprove our hypotheses, and discover opportunities for our design efforts.
The Value
1. Product Benefits - UX research provides data about the end user of the product, how and when the user will use the product, and the key problems the product will solve. UX research is also helpful when a team needs to choose between multiple design solutions.
2. Business Benefits - UX research brings great value to organizations. By understanding end users and incorporating design requirements up front, companies can speed up the product development process, eliminate redesign costs, and increase user satisfaction.
3. User benefits - One of the greatest values of user experience research is that it's unbiased user feedback. Simply put, UX research speaks the user's mind - without the influence of outside authority. It also serves as a bridge between users and the organization.
Typical UX Research Methods
- Usability Testing
- Interviews
- Online Surveys
- User Personas
Usability Testing
Usability testing is a user experience research method that evaluates a product or service by having representative users complete specific tasks while observers watch and record notes. The main goal is to identify usability problems and collect qualitative data to determine participants' overall satisfaction. Usability testing helps identify problems before they are coded and reveals how satisfied users are with the product, but it is not representative of the real-life scenario. Best practices for usability testing include testing with five users, inviting the team to the testing sessions, and keeping the findings brief and to-the-point. To conduct usability testing, identify what needs to be tested and why, identify the target audience, create a list of tasks, recruit the right participants, involve the right stakeholders, and apply what you learn. A key lesson of usability is to design for outsiders, not insiders.
Interviews
Interviews are an important method used in user experience research to understand the attitudes, beliefs, and experiences of users and potential users of a product. Typically, interviews involve one interviewer speaking to one user for 30 minutes to an hour, either face-to-face, over the phone, or via video streaming. They are often conducted at the beginning of the product development cycle to review product goals and address individual concerns or misunderstandings. Interviews can capture verbal and nonverbal cues, such as emotions and body language, which can identify enthusiasm for the product or discomfort with the questions. They also supplement online surveys and help refine survey questions. To conduct an effective interview, it is important to hire a skilled interviewer, create a discussion guide, and get informed consent from participants. The process of conducting an interview involves preparing a discussion guide, selecting a recording method, conducting at least one trial run, recruiting the right participants, conducting the interview, and analyzing and reporting the results.
Online Surveys
Online surveys are a user experience research method that involves asking a set of questions to users to find out their preferences, attitudes, and opinions on a given topic. These surveys are generally conducted online, in various lengths and formats, and can provide data that can be used for user experience studies to inform product development. However, poorly worded questions and long surveys can negatively impact the accuracy of the results, making it crucial to keep the surveys short, simple, and engaging. Conducting an online survey involves identifying goals and objectives, creating survey questions, selecting an online survey tool, recruiting participants, conducting the survey, and analyzing and reporting the results. It's important to have an ironclad rationale to support design decisions based on real, actionable information collected from user feedback.
User Personas
A user persona is a fictional representation of an ideal customer based on user research. Creating personas helps to understand the needs and goals of users, and design products that meet their expectations. Well-defined personas are important for identifying user needs efficiently and describing the individuals who use the product. To create user personas, it is necessary to discuss and identify the target audience, survey and interview real users, and organize the groups into personas. It is best to keep personas brief and specific while avoiding exaggerated caricatures. Finally, testing the personas is important for validating their usefulness.
Week 6 User Journey Map
What is User Journey?
User journey, is the path that a user takes to complete a specific task or achieve a particular goal within a mobile app. It refers to the series of steps that the user needs to take to navigate through the app's features and functions. User journey is an essential concept in UX design because it helps designers to create a mobile app that is intuitive and user-friendly.
By understanding the user journey, designers can identify potential pain points, bottlenecks, and areas where users might get confused or frustrated. This understanding can help designers to optimize the app's design, reduce user errors, and improve the overall user experience.
Examples of User Journey Map
Fig.1-1: Online Shopping Customer Journey Map
Fig.1-2: Music Sharing Experience
For example, let's say that a user wants to book a hotel room through a mobile app. The user journey for this task might include the following steps;
- The user opens the app and searches for hotels in their desired location.
- The app presents a list of available hotels with relevant information, such as price, ratings, and availability.
- The user selects a hotel and reviews its details, such as amenities, room types, and cancellation policy.
Overall, user journey is an essential concept in UX design that helps designers to create mobile apps that are easy to use and meet the users' needs.
By understanding the user journey, designers can create an app that provides a seamless and enjoyable user experience.
INSTRUCTION
W5 Group Activity (Online)
Group activity: Creating User Persona
Scenario: You are designing a mobile app for a local coffee shop that allows customers to order and pay for their coffee and food ahead of time, and pick it up at the store.
To create user personas for this app, you can follow these steps: Identify the different types of customers who might use this app. Based on your assumptions and prior knowledge, brainstorm a list of different types of customers.
For example, you might come up with the following: Busy professionals who want to save time by ordering and paying for their coffee and food ahead of time.
Students who need to grab a quick coffee and snack in between classes.
Parents with young children who want to avoid long wait times in line.
Coffee enthusiasts who want to customize their orders and try new menu items.
Elderly customers prefer the convenience of ordering from their phones rather than standing in line.
For each type of customer, create a user persona that includes the following information:
- Name: Give each persona a name that represents their personality and background.
- Demographics: Include details such as age, gender, occupation, income, education level, and location.
- Goals and motivations: What are the goals and motivations of this persona? What drives them to use the app?
- Pain points and challenges: What are the pain points and challenges that this persona experiences when using the app?
- Behaviors and preferences: How does this persona typically interact with the app? What are their preferences for using it?
Fig.2-1: Persona Slide 1
Fig.2-2: Persona Slide 2
Fig.2-3: Persona Slide 3
Fig.2-4: Persona Slide 4
Project 2: UI/UX Design Document
The outline of the document should include:
- Introduction: Start the UX design document with an introduction that explains the purpose and scope of the document, the target audience, and the problem the app is intended to solve.
- User Research: Provide a detailed description of the user research that has been conducted, including user personas, user stories, and the pain points and needs of the target audience. Explain how the research informed the design decisions.
- Information Architecture: Outline the content elements of the App and how they will be organized to achieve the optimum information architecture. Explain the card sorting method that was used and how it helped to organize the content.
- MVP (Minimum Viable Product) Features: List the App features and identify the minimum viable product (MVP) that will be developed.
- User Flow: Plan the user interaction and interactivity of the App by creating a user flow diagram that illustrates the user's journey through the App. Explain how the user flow was determined and what design decisions were made.
Process of Task
Introduction
The writing was done according to the decisions made in Project 1.
User Research
In this section, I determined the research methodology to redesign "Celcom Life" for a better UX. Then analyzed that information to understand user desires for features and created user personas for the final design.
First, the research objectives were set as follows;
- To identify the user base that will use the postpaid SIM card management app
- To investigate the demand for features in the app
- To analyze high-demand and unnecessary features and reflect them in the architecture of final design
- To evaluate the visual design by users to create better UI design
In the research part, 2 methods of survey were conducted. Firstly as quantitative research, a questionnaire was administered to gather demographic information about the users of a SIM management app, purpose of use, and their preferences for visual design elements. Survey responses were analyzed and used to establish personas and other data for the improvement of the app design. Subsequently, qualitative research was conducted on unmoderated and closed card sorting. The goal of the card sorting is to reclassify all Celcom Life's features and brush up on the application structure.
Fig.2-5: Survey
Items;
1. Demographic Study
- Age
- Gender
- Ethnicity
- Country
- Working Status
- Position
- Education Level
- Income Range
- Marital Status
2. Survey on App UX
- Have you ever used any app to purchase or change SIM card plans?
- We would like to ask those who answered "Yes" to Q.2-1. Were you satisfied with the app you used?
- When do you use a prepaid SIM card? Kindly select the option that best aligns with the situation or choose "other" and provide your perspective.
- What are the reasons for using a mobile plan management app, whether it's for prepaid or postpaid plans? Kindly select all that are applicable.
- We would like to ask those who answered "Yes" to Q.2-1. Have you encountered any difficulties when buying or modifying SIM card plans through the app?
- Kindly provide your response under the assumption that you are subscribed to a prepaid plan. When utilizing the SIM management application, please select the options that you consider significant or valuable.
- Assuming that you have a prepaid plan, kindly select the less important/unnecessary options from the SIM management app.
- The following figure shows the home screen of the "Celcom Life" application. Please select your impression of the following items from the choices on the right.
- Is there anything you would like to see improved in your current plan management App? Please share your idea in the box below.
Findings obtained from the Survey
The attribute that showed the strongest correlation with usage rates was nationality. 86% of foreigners living in Malaysia use it, compared to 64% of Malaysians, a difference of more than 20%. Contrary to pre-survey expectations, there was no correlation with income range among users of prepaid SIM cards: 70% of low-income people in the B1-B2 group and 69% of middle-class people in the M1-M4 group used prepaid SIM cards, while 70% of higher-income people also used them. A slight inverse relationship with age was found for the user base of prepaid sim cards, with 73% of the younger generation (29 and under) using them, and a drop in use to 66% for those in their 30s and older.
The users' biggest complaint was that the complex UI design made it difficult to get to the features they were looking for. This issue will be reflected in the final design.
User Needs
Regarding the significance of the application, "To check my own usage" was the highest vote-getter as a purpose to utilize the application. Most prepaid SIM card contracts (except for the Unlimited Plan) have an expiration date and a limit on airtime charges. Next, "To change plans" and "To purchase new plans" were selected as second and third purposes respectively. There were a small number of users who considered payment details and promotions important, but almost no one was interested in contacting the mobile company or checking Internet connections.
Similar results were obtained in the survey on features. “Check Usage" and "Purchase a new plan / Renew a plan" tied for the top spot with 29 votes, clearly indicating that these two functions are the core of the app. This was followed by "Plan Details" (28 votes) and "Data Roaming (overseas)" (24 votes) in third and fourth place.
Overseas data roaming was considered to be the raison d'etre of the application, which is different from normal use. If the app is actually used permanently in Malaysia for a long period of time, checking usage status, payment methods, and purchasing plans are naturally important. However, as the overseas data roaming function was highly supported as an irregular usage for travel only, it was determined that this should be recognized as a secondary purpose of the app and included in the Minimum Viable Product (MVP).
Persona Setting
Based on the results of the above research, two personas below were established from appropriate demographics and social context, and general conventional wisdom in Malaysia.
Person 1
Person 2
Reflection on final design
Particularly important elements that should be reflected during redesign are below.
- Redesign and place "Check Usage" on the top page to make it easier to read, and reduce the priority of promotional information from the current level.
- While the function of checking Usage was shown to be most important, the layout of Usage was very unpopular. Therefore, the visual notation design of Usage and the interface design showing equivalent numerical values should be improved.
- From the top page, redesign the "Purchase a new plan / Renew a plan" to make it easier to understand.
- Improve accessibility from the top page, as the "Overseas data roaming" function is currently placed at a deeper level where it is a little difficult to find.
- Since the color scheme was reviewed as generally positive feedback, continue to use the current one.
- The bottom navigation system will remain as it is now. The design of the icons, etc. was highly evaluated, and it was decided to use the same style.
- Complex UI design and too many functions were shown to confuse users. So, according to the results of the survey, I will try to remove less important functions and simplify the structure in the application.
Information Architecture
Fig.2-6: Card Sorting
It was conducted on unmoderated and closed card sorting for 11 people in total. The reason for "closed card sorting" is that the classification should be limited to four items, a number that would fit in the bottom navigation. Also, because the survey was unmoderated and conducted online (MIRO board), it was able to obtain 11 participants in a period of time.
Screenshots of all screens in the app were taken, from which the features were listed. They were then placed in the card sorting survey as items to be classified.
- Charity
- Check Usage
- Contact us
- Credit balance
- Data Roaming (overseas)
- e-Wallet
- Education
- F&Q
- Internet Pass (no phone call plan)
- Local Plan
- Manage Cards (Manage payment method)
- Mini Game
- Network Checker
- Plan Details
- Privacy Policy
- Profile (Account Information)
- Promotion of best seller plan
- Promotion of discount plan
- PUK Inquiry (To unlock the phone in case of emergency)
- Purchase an add-on plan
- Report
- Reroad
- Settings
- Speed test
- Transaction History
- Validity extention
- Video
- Voucher
The table below lists the number of pieces in which category the participants classified which items.
Result Analysis
First, Charity, Education, Mini Game, and Video were classified as unnecessary by many participants. Therefore, they will be removed from the final design. Then six items were selected for the "Plan" section: Internet Pass (no phone call plan), Local Plan, Plan Details, Promotion of best-seller plan, Promotion of discount plan, and Purchase an add-on plan. Plan" section. The "Usage" section includes the reload functionality, which may have been inadequately explained to participants at the time of the survey. This relates to e-wallets. The results for "Purchase" and "Tools" were generally in line with expectations, with little variation among respondents.
Furthermore, given the results of the survey, speed tests and Internet checks should be given a lower priority. And for the purpose of preventing confusion due to complex UI + avoiding sparseness of promotional information, the two types of promotional information in the plan will be stored at a deeper level.
Optimum Information Architecture
Fig.2-7: Optimum Information Architecture
MVP (Minimum Viable Product) Features
Based on the results of the above research, the fundamental features required for this application are listed in order of priority.
- Ability to sign up for a plan to connect to the Internet in conjunction with a SIM card.
- Ability to purchase plans through online payment methods
- Ability to check data usage and expiration date
- Ability to check the details of the contracted plan
- Ability to purchase additional overseas data roaming capabilities
- Ability to obtain promotional information and apply it to purchases
- Ability to contact the provider in the event of an emergency
User Flow
The User Flow after the application redesign was designed in light of the overall research results of the previous sections.
Fig.2-8: User Flow Chart
Rationale for design decisions
Initial users need to register. After purchasing a SIM card at a store and completing the user registration, users enter their phone number into the installed application to complete the linkage.
When the application is launched, the home page appears first. Features judged to be particularly important (by the survey) are displayed on the top page. Other functions that are needed can be moved to another page through the bottom navigation and able to use the functions.
From left to right, the bottom navigation consists of "Home," "Plan," "Purchase," and "Tools." It is difficult to understand the difference in meaning between "Plan" and "Purchase," so the function names may be changed in the design phase.
As a result of card sorting, the "Data roaming" function was classified as "Purchase," but I am considering whether it might be better to include it in "Plan" in practice.
While there is still room for some details to be changed along with the actual visual design, the general framework of the application structure will be built as shown in the figure above.
Documentation
The PDF below includes all of the above and is documented for submission.
Fig.2-9: UI/UX Design Document Final Outcome (PDF)
REFLECTIONS
Experiences
This assignment involved research and analysis prior to determining the features and design of the app. I used two different research methods, as described in the article above.
Observation
Quantitative research allowed me to obtain demographic data on users that helped me set personas and their actual impressions of the app. This will be reflected in the overall structure of the app, which I will create in a later assignment. The card sorting also provided important insights for making decisions related to the purpose of the app itself (categorizing each function and determining what is necessary/unnecessary).
Findings
I felt that I was able to make proposals that better meet user needs because we were designing apps based on a clear rationale, such as data obtained through research, rather than creating apps based on a hunch.
Comments
Post a Comment