UX Design / Journal
29.08.2022 - 09.12.2022 (Week 1 - Week 15)
Lulu Luisa Linardi / 0349358 / Bachelor of Design (Hons) in Creative Media
UX Design
Journal
LECTURES
 |
| Fig 1.0: Thumbnail |
User Experience (UX) is how a person, the user, feels about interacting with, or experiencing, a product.
Users more often are not designers. Most of them are far from being experts. Even if they know a thing or two about the product, that awareness doesn't convert into good design solutions.
 |
| Fig 1.1.1: Meet the users |
• Value Metrics:
– Signing up for it or paying for it
– Using it more than once
– Telling others about it
• Market Segmentation
The market segmentation is divided into 4 sections, such as:
 |
| Fig 1.1.2: Market Segmentation example |
– Geographic; countries, regions, or cities.
– Psychographic; attitudes, aspirations, and other psychological criteria
– Behavior; behavioral patterns that users experience toward using a particular product, can be including buying behaviors (spending and consumption) and desired benefits
LECTURE 2: Be the Users
Personas are fictional characters, which designers create based on their research to represent the different user types that might use the service, product, site, or brand in a similar way. Creating personas will help designers understand the users’ needs, experiences, behaviors, and goals.
• User Empathy
Empathy is the ability to fully understand, mirror, then share another person's expressions, needs, and motivations. In UX, empathy enables us to understand not only our users' immediate frustrations, but also their hopes, fears, abilities, limitations, reasoning, and goals.
 |
| Fig 1.2.1: Empathy Map example |
• User Persona
User personas are researched and proposed representations of your target user. Each Persona would be framed from real user discovery by researching and observing their:
– Needs
– Goals
– Behavioural patterns
The aim of creating a user persona is to allow you to gain valuable insights into your users, such as:
– Requirements
– Wants
– Demands
 |
| Fig 1.2.2: User Persona example |
• Journey Experience Map
A journey map is a visualization of the process that a person goes through in order to accomplish a goal. In its most basic form, journey mapping starts by compiling a series of user actions into a timeline. Next, the timeline is fleshed out with user thoughts and emotions in order to create a narrative.
Journey mapping is a process that provides a holistic view of the customer experience by uncovering moments of both frustration and delight throughout a series of interactions. Done successfully, it reveals opportunities to address customers’ pain points, alleviate fragmentation, and, ultimately, create a better experience for your users.
 |
| Fig 1.2.3: User Journey Map example |
LECTURE 3: Design Audit
A design audit is basically a checkup to make sure that the company is expressing itself consistently across all channels and touchpoints. It’s a quality assurance activity that’s goal is to review products and evaluate them from a user experience perspective to ensure it meets accessibility, user interface component continuity, and design unity requirements.
• Touchpoints
It is what users are actually seeing and engaging with throughout their user journey, and remedy any inconsistencies. Touchpoints are external (for the users), such as visuals, written, and verbal communications that range from the website to ads to social media marketing and advertising, events, workshops, or webinars hosted to the actual product launch and the product itself. There are dozens, if not hundreds, of touch points in their journey to and through the journey of your product. Is their experience consistent and trustworthy, or erratic and unpredictable?
• WHY?
Building consistency is building trust
• WHAT?
– Any style guides or existing design systems
– Website pages (screenshots)
– Logo in all formats and use cases
– Web ads/third-party integration
– Standalone landing pages, marketing campaigns, and all their collateral
– Classes, workshops, presentations, promotional speaking engagements
– Social media content
– Original design files vs. what is live right now
LECTURE 4: Design Document
Design documentation is a collection of documents and resources that covers all aspects of your product design. Documentation should include information about users, product features, and project deadlines; all essential implementation details; and design decisions that your team and stakeholders have agreed on.
1. Overview (Define)
Focused, actionable, and purposeful. Project's goals, objectives, and vision.
 |
| Fig 1.3.1: Design thinking |
– Problem (HCW)
– Solution (SWOT)
– Definition (Role/Duration)
2. Discovery (Empathize)
Essential user research includes user personas, empathy maps, user journey maps, interviews, market research, and any other information that pertains to the customer.
 |
| Fig 1.3.2: Empathize |
– User Research
– User Personas
– Key Findings
3. Design (Ideate)
A summary of initial concepts and sketches of how the product's journey began and the though processes behind the product's features. Also include sprints and brainstorming session reports.
 |
| Fig 1.3.3: Wireframing |
– Wireframe
– Usability Prototyping
– Key findings
4. Prototype
Presented to stakeholders to explore the product and understand the context behind usability testing and design concepts.
 |
| Fig 1.3.4: Prototyping |
– Prototype
– Documentation
5. Handover
Summarize your UX documentation and include the project's goals, objectives, and vision. Allows every stakeholder to read about the UX design process and how the product has evolved.
– Engineer
– Developer
– Video Prototype
6. Improvement
References, giving context to the product's lifespan from the initial concept to the current iteration.
– Next steps
– Long-term plan
LECTURE 5: Laws of UX Design
For a deeper understanding of what causes users to do what they do, UX designers often rely on a collection of widely known psychology laws, or standards, that help determine their design choices. This article will focus on five essential laws that will help elevate your design prowess to create winning experiences for your users.
1. Hick's Law
"The more choices you give a user, the longer it takes for them to make a decision."
Choices are not necessarily a bad thing, however, giving a user too many options to choose from might overwhelm them and based on experience, increase bounce rates too.
 |
| Fig 1.4.1: Hick's Law |
2. Jacob's Law
"Users spend most of their time on either site. This means that users prefer your site to work the same way as all the other sites they already know."
Users will transfer expectations they have built around one familiar product to another that appears similar.
 |
| Fig 1.4.2: Jacob's Law |
3. Fitt's Law
"The time to acquire a target is a function of the distance to and size of the target."
This means that the smaller your target area is, the longer it takes the user to perform that action based on the distance/size ratio.
 |
| Fig 1.4.3: Fitt's Law |
4. Von Restorff Effect
"Also known as The Isolation Effect, predicts that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered."
In design, you can make that important information or key actions more distinctive than others.
 |
| Fig 1.4.4: Von Restorff Effect |
5. Zeigarnik Effect
"Zeigarnik effect says that people remember uncompleted or interrupted tasks better than completed tasks."
The automatic system signals the conscious mind, which may be focused on new goals, that a previous activity was left incomplete.
 |
| Fig 1.4.5: Displaying large content in smaller chunks |
 |
| Fig 1.4.6: Using progress bars for motivation |
INSTRUCTIONS
Exercise 01: Intro to UX Design
To start this module, students were asked to do the simplest thing that is related to UX, and find problem that is faced by them on a daily basis. In this case, I chose the problem below.
As an international student, I was having trouble with the charger socket since my home country doesn't use this kind of socket. It sometimes annoys me because I often forget to bring an extra adapter to connect my charger adapter and the socket at the campus. I wish they (Taylor's) can change their charger socket into a universal one, so that everyone can use it easier.
 |
| Fig 2.1: My problem |
Exercise 02: Target Audience
In this exercise, students are to select their target audience and create a market segmentation for the chosen app to be redesigned. For this case, I chose Beyond LIVE Mobile App to redesign since it has many flaws that need to be fixed.
For market segmentation, there are four segmentations. I divided the geography into four which are Southeast Asia, South Korea, Japan, and the USA. While for psychography is divided into two which are K-pop fans and people who are concert/performance enjoyers. There are two behavioral patterns that segmented the market such as people who only purchase their favorite artist's shows and people who watch every interesting concert/performance. I separated the demographic into three sections. The first section is for gender, which I target both male and female here. And for the age groups, I decided to put people aged between 16-30 years old, which are normally a student or working people.
 |
| Fig 2.2.1: Market Segmentation |
 |
| Fig 2.2.2: Targeted users |
Exercise 03: Empathy Map
In this exercise, students are to create a user empathy map that defines what are they saying, thinking, feeling, and doing while operating the app (mine is Beyond LIVE Mobile App). This is how I made my targeted user think, say, feel, and do based on my research on the pain points of the current app.
 |
| Fig 2.3.1: User Empathy Map |
 |
| Fig 2.3.2: User Persona |
Exercise 04: Project Definition
For this project definition, students are to define what is the goal(s) of their project, what is their desirable outcome, why the problem(s) needs to be solved, what is the real user data, on which device the OS will be fixed, when is the newly fixed thing is needed, who is experiencing this and what are their pain points, and also how would be considered as success later on after the fix.
I have compiled the answers to each question and explained them as seen below.
 |
| Fig 2.4: Project Definition |
Exercise 05: Design Audit
For this design auditing, I have got the problems prepared and will explain the pain points of each thing I found.
1. Landing Page
 |
| Fig 2.5.1: Landing Page of Beyond LIVE |
– There's no navigation bar
– There's no settings option
– There's no search feature
– The shows listed in Beyond LIBRARY can't be clicked
– Unclear on what to do
2. Navigation
 |
| Fig 2.5.2: Navigation of Beyond LIVE |
– Design looks old
3. Language Settings
 |
| Fig 2.5.3: Language Settings of Beyond LIVE |
– Design looks old
4. Product Page
 |
| Fig 2.5.4: Product Page sequence of Beyond LIVE |
5. Purchase History Page
 |
| Fig 2.5.5: Purchase History Page of Beyond LIVE |
– It can be removed or replaced with a more useful tab
Exercise 06: User Experience Journey
In this exercise, students have to create a user journey based on the empathy map and persona that have been done previously. It includes the journey steps, how are they feeling during each journey, what are their thoughts during each journey, and what measures should be taken in that steps from the service side. I have organized the journey of the user which can be seen below.
 |
| Fig 2.6: User Experience Journey |
Exercise 07: User Experience Survey
Students are to create a User Experience Survey (Questionnaire) regarding the Product that they have chosen to redesign. Asking for customer feedback before redeveloping/developing a product is ideal and would save the project a great deal of money and effort. Students have to come up with 10-15 survey questions to be applied to a selected user persona.
For this case, I'm using my survey results from the App Design I module since it has a similar outcome. One of my friends asked the lecturer whether we can use the previous survey and not create the new one, and the lecturer agreed to that, that's why I'm using it.
I divided the survey into three sections, the first section is the demographic section, the second is the introduction asking the general question about the Beyond LIVE Mobile App and the last one asked how is their impression and ratings of the app.
I will only attach one survey result here as it might take too much space to paste everything here. The rest of the results and the proof of the survey can be seen by clicking here.
.png) |
| Fig 2.7: Survey result |
– Some people don't really mind ugly interface design
– Many users agree to have more helpful features
– Some people find it confusing to work with the homepage and navigation panel
– People using the app tend to prioritize their main purpose (watching concerts), so they don't pay much attention to the interface design
Below is the embed link of my Miro Board with all the individual exercises compiled there.
Below is the link to my Notion with all the individual exercises compiled there.
• Notion
Group Project
Done dealing with the exercises for the past 7 weeks, students are put randomly into groups of 3-4 people by the lecturer. I got into Group 2 and my groupmates are Devina, Haura, and Michelle, and surprisingly all of us are Indonesian so it is easier for us to work together. Our group decided to choose my app (Beyond LIVE Mobile App) as it has clearer pain points and directions on what and which needs to be fixed.
We worked together creating the onboarding page, conducting a survey and user testing, and also compiling the data and analyzing it. Lastly, we also came out with a conclusion and linked it with the Laws of UX Design.
Below is the link to our survey conducted on Google Forms, the user-testing recordings, and our analysis of it.
• Google Forms
• User-Testing Recordings
• User-Testing Analysis
After working together for the past 5 weeks, we came out with this final outcome.
A more detailed version of the final outcome is available by clicking on below's Notion link.
Below is the embed link of our final Low-Fidelity Prototype of Beyond LIVE Mobile App.
And here's the walkthrough video of the Beyond LIVE Mobile App Low-Fidelity Prototype.
FEEDBACK
REFLECTIONS
This module is interesting yet confusing. I was not really clear about what to do the first time since the timeframe of the individual exercise was a bit off which made all the exercises got mix up with each other. However, after I understand it better, it was so fun doing the UX research to find out more about the user experience, persona, empathy, etc. And after I made it into a group, I realized that teamwork is really needed. It is essential to work in a group as we can share our thoughts on how to improve things and mix our opinions.