Application Design 1 - Project 2/ UI/UX Design Document
21.10.2024 - 25.11.2024 / Week 6 - Week 10
Siang Huey Yee / 0369549Project 2 / UI/UX Design Document
OUTLINE
LECTURES
Class Summary (Week 5 - 21/10/2024)
- No feedback session was conducted by Mr. Zeon this week.
- Each group presented their card sorting ideas and outcomes to the class.
- Mr. Zeon asked us to conduct a card sorting activity, where each group was provided with specific app types, features, and scenarios to work on.
- Students worked in groups of three to perform the activity collaboratively.
.jpeg)
INSTRUCTIONS
Module Information Booklet
PROJECT 2 - UI/UX DOCUMENT
After finalizing our app concept and idea, we are now ready to move forward with the UX design phase. We are required to create a comprehensive UX design document, which will serve as a clear guide for designing the app.
Based on the information gathered in Task 1, we will:
- Identify and confirm our target audience.
- Outline the content elements of our app and utilize the card sorting method to achieve optimal information architecture.
- List the app features and define the Minimum Viable Product (MVP) for the application.
- Develop wireframes for the main screens.
Requirements:
1. Introduction:
Define the purpose and scope of the document, identify the target audience, state the problem the app addresses, and analyze weaknesses in its user experience and interface.
Conduct surveys and interviews, create detailed user personas, map user journeys, and explain how research insights guided design decisions.
Use the card sorting method to organize content, create an information architecture map, and develop a user flow chart for optimal usability.
List all app features and identify those included in the MVP for initial development.
According our lecturer's recommendation, we were required to collect 50 respondents for our online survey questionnaire. I successfully collected feedback and insights from 51 respondents regarding the Moovit app. Additionally, we were required to conduct interviews with 3 users to gain a more in-depth understanding of their experience with the app.
- Questionare Questions - Online Survey & Interview
- Quantitative Method - Online Survey Questionnaire (Google Form)
- Survey Sections:
- Section 1: Demographics
- Section 2: General Usage & Experience
- Section 3: User Interface (UI) Design
- Section 4: User Experience (UX) and Navigation
- Section 5: Pain Points and Improvement Areas
- Section 6: Visual Design and Aesthetic Appeal
- Section 7: Feedback and Suggestions
I have distributed the online survey to respondents using the Google Forms platform, ensuring it was accessible for approximately one week. During this period, I circulated the form widely to encourage Moovit app users to provide their feedback and complete the survey.
Google Form Link: https://forms.gle/qMBzL3RRFpQsKKa27
Google Excel Spreadsheets Link (Responses Collected): https://docs.google.com/spreadsheets/d/1V6efE9TXIFgAiV9fJ4GofTIsAJHG4f9VBVlNv_-OWCI/edit?usp=sharing
- Qualitative Method - Interview (Audio recordings)
- Interview Sections:
- Section A: Basic Information
- Section B: User Insights and Experiences with Moovit
- Audio Recordings:
Interviewee 1
Interviewee 2
Interviewee 3
- Summary of Each Respondents:
.png)
- User Persona
By combining the results from the online survey and interviews, we are instructed to create three user personas. These personas will represent different segments of our target audience, incorporating insights from both the survey responses and interview feedback. The goal is to capture the diverse user needs, behaviours, and pain points of the users, helping to guide our design decisions for the app.
- Card Sorting Activity (UXtweak)
For the card sorting activity, we were required to involve 7 users using the UXtweak platform. However, due to the limitations of the free version, we were restricted to inputting only 20 cards. To address this, I combined some of the features into single cards and selected the 20 most important ones to include in the activity.
.jpg)
UXtweak Card Sorting Activity Link: https://study.uxtweak.com/cardsort/vqnToZmezCnr9SeZT4THa
INFORMATION ARCHITECTURE
We were required to create a user journey map, information architecture map, and user flow chart for our chosen app to deepen our understanding of how the app organizes its features and to help us rethink and refine the redesign features for the app wireframes.
Additionally, I created the original Information Architecture Map for the Moovit app, along with one final Information Architecture Map and three intermediate versions. These include the original map, the redesign idea before feedback, and the redesign idea after the feedback session with our lecturer, Mr. Zeon. By providing these flowcharts, I was able to better organize the app's features and structure them effectively in my redesign of the Moovit app.
- User Journey Map (Miro)
Miro Board Link: https://miro.com/app/board/uXjVLNaX2Qk=/?share_link_id=820431768954
- Information Architecture Map (Miro)
- Final Information Architecture Map
- Information Architecture Map - Original version, The redesign idea before feedback and The redesign idea after the feedback session
Miro Board Link: https://miro.com/app/board/uXjVLNaX2R0=/?share_link_id=469854488402
- User Flow Chart (Miro)
Miro Board Link: https://miro.com/app/board/uXjVL9AGcqs=/?share_link_id=395826781774
PRESENTATION SLIDES & VIDEO
- Canva Presentation Slides
Google Drive Link (to view PDF version): https://drive.google.com/file/d/1D7nMp1N849hBnkQmdCGttDaTOUPHR5fa/view?usp=sharing
Project 2 - UI/UX Design Document- Presentation Video (YouTube)
YouTube Link: https://youtu.be/0mVliNUqS4c
FEEDBACK
Week 5:
Mr. Zeon did not conduct any feedback sessions this week, as we focused on the card sorting activity during the class session. We worked in groups of three with our classmates to complete the activity and later presented our ideas to the class.
Week 6:
Mr. Zeon provided feedback on my Miro map for the flowcharts of the Moovit app. I had created two versions: one showcasing the original flowchart of the Moovit app and another illustrating my redesign idea, where I added and removed certain features. He suggested adding one more feature, a ticket booking option to the app, while noting that the rest looked fine.
Week 7:
Mr. Zeon provided feedback on my questionnaire for the Moovit app online survey and interview questions. He pointed out that some of the survey questions should include pictures, mention specific buttons, or provide descriptions to help respondents better understand the context. Additionally, he noted that my interview questions contained some leading questions and advised me to revise them accordingly.
Week 8:
Mr. Zeon provided feedback on my questionnaire questions for the online survey and interviews via email. He also shared a document with detailed suggestions for revisions, which I need to address before proceeding to collect survey responses and conduct interviews.
Week 9: -
Week 10: -
REFLECTION
I am truly grateful for the opportunity to delve deeper into user research and gain a better understanding of techniques such as card sorting. This activity helped me identify and organize features more effectively within the navigation sections of the app. Additionally, exploring user experiences within the Moovit app allowed me to uncover valuable insights, such as the most frequently mentioned issues, both positive and negative which shared by its users.
However, this project posed significant challenges due to the extensive amount of work required. From designing questionnaire questions, collecting responses and conducting interviews, to performing data analysis, creating user maps and flow charts, and preparing a presentation, each component demanded meticulous effort and attention to detail. Despite these challenges, I truly appreciate the opportunity to gain valuable knowledge and skills through this project and module. It has been a rewarding learning experience that has deepened my understanding of UI/UX design principles and processes.
Comments
Post a Comment