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

06.05.2023 - 29.05.2023 / Week 6 - Week 8
Yung Siew Weng / 0339847
Application Design I / Bachelor of Design (Hons) in Creative Media
Task 2 / UI/UX Design Document

TASK 2

MODULE INFORMATION


Application Design I - Task 2 : UI/UX Design Document

INSTRUCTION
After locking down the App concept and idea, students are now ready to proceed to UX design. The 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, the outline of the documents should included:
  • Introduction of the User Research
  • User Research
  • Information Architecture
  • Minimum Viable Product (MVP) Features
  • User Flow

EXPLORATION
During Week 6 class, we are instructed to design a set of questions for user research and proposed on Week 7. For this task, I chose to employ a survey questionnaire as the research method. The survey will help gather valuable insights and feedback from participants, allowing me to gain a deeper understanding of their preferences and experiences.

Fig 1.1 Drafted Question (week 7/ 18.05.2023)

Feedback _ week 7 / 19.05.2023
Overall, the questions you designed were effective. However, some suggestions are given for improvement :
1. Consider adding a question about respondents' occupation to gain insights into their yearly income and purchasing needs within your research group.
2. For Section C Question 2, consider shortening or reducing the number of options in the checklist answer to streamline the response process.

After receiving the feedback from Mr. Shamsul, I did the revised version and finalise the final outcome of the survey questionnaire.

Fig 1.2 Final Survey Questionnaire (week 7/ 19.05.2023)

Survey Questionnaire Link : https://forms.gle/GaDLxkacebepvm4E7

After recruiting a total of 57 respondents over a span of 4 days, it was crucial to stated that I had faced time limitations that prevented me from conducting the survey questionnaire on a larger sample size. Despite this constraint, I found the data collected to be somewhat useful in a user perspective  Using Google Forms, I was able to efficiently organise and analyse the responses to each question on the survey questionnaire. The compiled data analysis and findings towards the survey questionnaire are shared under PDF below, including the conclusion that I had interpret from the research study :

Fig 1.3 Data Analysis and Findings, 
Survey Questionnaire (week 8/ 26.05.2023)

While the survey findings provided valuable insights, I felt that they were not sufficient enough to generate effective redesign ideas. To augment my research findings, I employed a qualitative method known as competitive analysis. This involved analysing and understanding the design of competitor applications, TGV Cinemas and Dadi Cinema. TGV Cinema is a leading cinema chain in Malaysia known for its premium movie experience, while Dadi Cinema is a prominent cinema chain in China. The data analysis and findings from the competitive analysis are compiled in the PDF document below, including a summary conclusion and redesign features recommendations :

Fig 1.4 Data Analysis and Findings, 
Competitive Analysis (week 8/ 26.05.2023)

After completing the data analysis for both qualitative and quantitative research, I proceeded with the development of the second requirement, which was the Information Architecture. To fulfill this requirement, a card sorting activity needed to be conducted with a minimum of 5 participants. Due to time constraints, I opted for an unmoderated, closed-ended sorting method using OptimalSort, an online platform that facilitates card sorting activities and provides detailed findings and data analysis.

Fig 1.5 Screenshot, Card Sorting on OptimalSort (week 8/ 27.05.2023)

Card Sorting Activity Link : https://ows.io/os/jabiwrvk

Since the activity required a minimum of 5 participants, I "begged" the help of some friends without a design background to assist with the card sorting process. Additionally, I recruited participants from a Facebook survey group. Within a 10-hour timeframe (OK, it's during my bedtime), I successfully recruited a total of 8 qualified participants with majority participant from Malaysia, followed by one participant from both Philippines and Germany. 

Fig 1.6 Card Sorting Participant Details (week 8/ 27.05.2023)

After completed the card sorting activity (maybe not completed, but the time limitation had forced me to stop earlier), I continued jump into the development on analysing the card sorting data in order to create the information architecture flow. Although the platform had provide very details findings, I still spend some times to categorise them and understand the "why". As usual, the comprehensive data analysis, along with the final decisions regarding the information architecture flow, can be found in the PDF document below :

Fig 1.7 Data Analysis and Findings, 
Card Sorting Exercise (week 8/ 27.05.2023)

After completing the analysis of MVP features and user research, I proceeded to work on the user flow. Initially, I faced some challenges in understanding how to effectively create and develop the user flow. To clarify the requirements, I consulted Mr. Shamsul, and he suggested starting with a user journey map before diving into the user flow diagram. This approach proved to be helpful as the user journey map provided a clearer explanation of the user flow.

Fig 1.8 User Journey Map (week 8/ 28.05.2023)

During my research, I came across various user flow diagrams created by others online. I was intrigued by the different shapes used in these diagrams and wondered if they had any specific meaning or interpretation. To gain more insight, I conducted further reading on the different shapes and their representations in user flow diagrams.

Fig 1.9 Further Reading on the "Shapes"

#Further Reading :
1. Capsule / Pill / Oval represents a start or end point.
2. Arrow represents as connector that shows relationship between representative shapes.
3. Rectangle represents a process, for example, home page, movie showtimes.
4. Diamond represents the decision making, for example, "want to sign in?", "booking ticket?". Normally, it comes with "Y" or "N" with different flow.
5. Parallelogram represents the input and output, for example, enter the email address.

After I had armed with a better understanding of user flow diagram principles and the significance of different shapes, I delved deep into creating the redesigned version of the MBO cinema app user flow diagram.

Fig 1.9 User Flow Diagram (week 8/ 28.05.2023)

After finalised all the documents, I compiled all the documents and findings throughout the research study into visual presentation slide.

Fig 1.10 Final Outcome, UI/UX Design Document MBO Cinema App (week 8/ 28.05.2023)

Fig 1.11 Data Analysis Compilation, 
User Research + Card Sorting (week 8/ 28.05.2023)


FEEDBACK

Week 7 / 19.05.2023 @ Drafted Questions
Overall, the questions you designed were effective. However, some suggestions are given for improvements:
1. Consider adding a question about respondents' occupation to gain insights into their yearly income and purchasing needs within your research group.
2. For Section C Question 2, consider shortening or reducing the number of options in the checklist answer to streamline the response process.

Week 11 / 16.06.2023 @ Outcome 
Good Job. Your analysis was quite solid, can considered for thesis.


REFLECTION

Throughout the exploration of the UI/UX design document, I experienced a mix of stress and excitement due to the time limitations we had to complete all the requirements within a week. Despite the seemingly small number of requirements, It was crucial to stated that there were numerous steps and considerations involved in reaching the requirement.

As I progressed through the document, I noticed that each step and direction provided a wealth of ideation and design outcomes for the application. It was both challenging and rewarding to explore different research methods, such as user personas, competitive analysis, and card sorting, to gather valuable insights and data for the redesign.

The process was undoubtedly demanding, often requiring long hours and sleepless nights. However, I am proud to say that I successfully completed this assignment. It was particularly fulfilling to create the user flow diagram, which felt akin to drawing an architectural floor plan...OPPSS!🥴

Overall, this exploration has been a valuable learning experience, pushing me to expand my skills and delve deeper into the world of UI/UX design. It has reinforced the importance of thorough research, attention to detail, and effective communication in creating user-centered and intuitive experiences.

Comments