.png)
Project Overview.
Problem
Our society is facing a serious lack and decline in empathy, and this lack of empathy is causing many problems for individuals, their surroundings, and ultimately society as a whole.
Solution
Thankfully, by Stanford University psychology professor Jamil Zaki, empathy is a skill that we can improve. So, let's create a platform where people can practice improving empathy skill.
Brand - empathy pottery
The process of improving empathy is same as making pottery.
Realizing my own emotions is like the pressure applied by my own hands on the clay when making pottery. Understanding the emotions of others is like knowing the state of the soil and shaping it accordingly with the appropriate depth and shape.
The 3-step Daily Empathy Practice
Step 1.
Become aware of my own emotions (Mindfulness meditation)
Step 2.
Loving-kindness meditation (Meditation to send true happiness to others)
Step 3.
Understanding others' emotions
.png)
Contents.
1 Understanding The User
2 Starting The Design
3 Iterating
4 Refining The Design
5 Going Forward
Understanding The User
User Research.
Quantitative & Qualitative Research
Research 1
Refer to a survey page on empathy conducted by a reputable institution in Korea.
Research 2
Collect numerical data through a Google survey and conduct in-depth interviews to understand why and how. Identify comprehensive pain points.
Paint Points Derived From Research
Paint point 1
Although empathy tests are easily accessible, it is difficult to find ways to develop low empathy in practice.
Paint point 2
Aware of the importance of improving empathy, but do not want to spend long hours on it every day.
Understanding The User
Personas.
Primary Persona
Name Mark
Age 33
Occupation Small business owner
Profile
Consider himself to have some level of empathy, but sometimes hears from people he knows that he lacks empathy.
Goals
Would like to improve empathy to the point where it has a positive impact on society.
Frustrations
- I do not know how to improve my empathy.
- I do not want to receive therapy. I prefer simple methods.
Problem Statements
Mark wants to improve his empathy so that he can apply it effectively in his daily life and also have a positive impact on society.
Secondary Persona
Name Jane
Age 55
Occupation Retired teacher
Profile
As a retired teacher, interested in young people and social issues.
Goals
- Would like to restore a society like in the past where everyone is kind and good-natured.
- Hopes that issues caused by people with low empathy. (such as psychopaths) will decrease.
Frustrations
Sometimes faces difficulties when using apps or websites.
Problem Statements
Jane wants to improve her own and others' empathy to create a society where everyone is happy.
Understanding The User
User Journey Maps.
Key Path Scenario
1. Mark accesses Empathy Pottery.
2. Mark reads the service explanation on the onboarding screen.
3. Mark completes the registration.
4. After finishing the 3-step process, he earns one empathy pottery.
5. He checks the earned pottery.
6. Everyday as he earns more, he is motivated since he can donate to help others with the pottery he's got.
Starting The Design
Style Guide.
Brand Color
Color blue represents calmness, peacefulness, and stability in order to create a sense of psychological stability for users while using the service.
Color Palette
Brand Logo
Typography
Starting The Design
Paper Wireframe.
Starting The Design
Low-Fidelity Prototype.
.png)
Starting The Design
Hi-Fidelity
Prototype.
Iterating
Usability Study.
Usability Study
Provided hi-fidelity prototypes to 5 out of the survey participants and collected feedback for design iteration.
Findings
Since the system requires completing all the steps in order to make one empathy pottery, some said they might press 'Go to the last' when they're lazy and want to skip it.
Change the 'Go to the last' button to '10 seconds forward' and '10 seconds back' buttons.
Refining The Design
Iterated Hi-Fidelity
Prototype.
Iterated Hi-Fidelity Prototype
Refining the design based on the feedback from the usability study.
.png)
Refining The Design
Different Screen Sizes.
Desktop
Refining The Design
Accessibility
Considerations.
Alternative Texts
Adding alt text to images is a must, and comments are added to guide the development team.
Headings
Headings are clearly differentiated.
Link Texts
Appropriate links are inserted based on context, and ambiguous expressions such as just 'click here' are avoided.
Going Forward
Takeaways.
What I Learned
Mobile UI was a bit more challenging to create compared to the desktop UI. It requires the ability to condense key information out of a lot of information and the ability to provide the most intuitive design within a small screen.
Next Steps.
What Should I Work On
Study various products that have both mobile and desktop UI and examine how they're structuring the same information on different frames.