1
This is a space for a quick escape during a hectic day, experience nature’s tranquillity.
Breathe deeply, relax, and let stress melt away.
Kung-Yen Wang
This is a space for a quick escape during a hectic day, experience nature’s tranquillity.
Breathe deeply, relax, and let stress melt away.
"How might we create a simple, effective platform with features for relieving stress that benefit adults under pressure?"
PROBLEM STATEMENT
Background & Research
Engaging in doodling or drawing simple patterns like lines and dots can help alleviate stress and improve focus. This activity is believed to calm the amygdala, the part of the brain involved in the 'fight or flight' response, thereby reducing anxiety (Tate, A., n.d). Zentangling is a combination of both meditation and art; as well as promoting concentration and creativity, following the zentangle method enables relaxation, develops self-awareness and can help achieve positive outcomes for both adults and children struggling with stress, anxiety, sleep disorders or hyperactivity (Weeden, 2022).
A study published in Frontiers in Psychology in 2018 found that exposure to nature scenes led to significant reductions in stress levels (Li et al., 2023). This suggests that simply looking at pictures or videos of nature can promote relaxation. Studies have found that exposure to ocean sounds and views can create a sense of tranquillity and improve emotional well-being (Exeter, 2018). Ulrich found that hospital patients with a view of natural scenery from their windows recovered faster and experienced significantly reduced stress and anxiety (Ulrich, 1984). Similarly, Kaplan and Kaplan demonstrated that exposure to natural environments significantly enhances psychological recovery and reduces stress and anxiety, emphasizing that natural landscapes provide a healing experience that promotes overall well-being (Kaplan and Kaplan, 1989).
Zentangles (Sarah, 2015)
Abstract Pattern (Wang, 2024 )
Natural Scenery – virtual (Wang, 2024 )
PRIMARY RESEARCH FINDINGS 1
(Additional Evidences)
Primary Research (Pre-Questionnaire for Target Audience-Stress and Stress Relief Questionnaire) Based on 30 Responses Target Audiences: Adult, above 20y
Fig 1. The ranking of stress levels (1st Work, 2nd Finances, 3rd Relationship problems)
Fig 2. Half of the people want to try art therapy as a method for stress relief.
Fig 3. Most people consider that incorporating digital art therapy could be beneficial.
5
Based on who are willing to try art therapy as a method
Fig 4. Most people feel that watching natural scenery helps relieve stress.
Fig 5. They are interested in videos on natural scenery topics.
Primary Research (Videos Feedback-Questionnaire) Based on 33 Responses Target Audiences: Adult, above 20y
Fig 6. Most people find the videos to be relaxing and emotionally touching
Fig 7. Most people want to keep watching the videos and they feel calm and relaxed.
6
INTRODUCTION
Experience an easily accessible website dedicated to mental health, featuring everything you need, including a unique immersive video channel designed to offer a refreshing approach to stress relief.
WEBSITE
Tips for Staying�Mentally Healthy and Happy
Best Way to truly Immerse Yourself in These Videos
Various types of immersive videos
Studies about Mental Health and Art Therapy
Professional mental and art therapists could talk
7
AIM
Create a simple, effective platform with features to relieve stress that benefit adults under pressure
OBJECTIVES
Create immersive natural scenery videos and abstract motion graphics
Complement traditional therapy with additional resources
Benefit individuals seeking stress relief facing time constraints or logistical challenges
8
USER
PERSONA
Trailer:
12 Natural Sceneries
+
16 Abstract Patterns
VIDEOS FEEDBACKS�
1. In addition to background music, natural original sounds can be added
2. Fix colours that are too bright
3. Add new topics
e.g. Different Patterns, Sceneries
SUGGESTIONS
Primary Research (Videos Feedback-Questionnaire) Based on 33 Responses Target Audiences: Adult, above 20y
BEHIND THE SCENES �(How I made those immersive videos)
11
Abstract Patterns
Computing + Coding
Virtual Natural Scenery
AI Machine Learning + Video Editing (Prompts in report appendix 1)
MID-FIDELITY PROTOTYPE
Responsive Web Design- Current (First, Main) Stage: PC / Laptop version testing
USER TESTING PARTICIPANTS
USER TESTING PLAN
Session Outline
Plan
Task
(Cover Main Functions)
Context Description
Imagine you are someone feeling stressed from work and life, and you need to find ways to relax and relieve your stress. You have heard about a website that offers various relaxing information, immersive videos, and the ability to contact counsellors or art therapists. You decide to try this website to find some help.
PARAMETERS FEEDBACKS
THE SYSTEM USABILITY SCALE (SUS): �POST-TEST ASSESSMENT OF USABILITY FEEDBACKS
-Linear Scale-
1: Strongly Disagree 5: Strongly Agree
ANALYSES
MAIN SUGGESTIONS
1. The website design is clearly easy to navigate and not complicated.
2. Because it is the first time visiting the website and the user is not familiar with it, Task 1 takes more time tasks.
3. The most common mistake is feeling confused about the name of the menu.
4. The results are all within expectations, and no help is needed during the browsing process. This is the most valuable feedback.
1. Too many words in total
2. Delete the References part
3. It is recommended to delete “Studies” page (Academics will look for relevant papers directly and will not read this)
4. The title name is unclear and needs to be modified
USER TESTING FINDINGS AND ITERATIONS
v.1-Menu
v.2-Menu
Points:
1. The original menu section titles—“About&Guide,” “Tips,” and “Listener”—were vague, making it unclear to users what each topic covered. After renaming them, users can now clearly understand the purpose of each page.
2. Because the name has become longer, it has been changed to a hamburger menu for easier browsing.
3. Delete “Studies” page
USER TESTING FINDINGS AND ITERATIONS
Concise and Rearrange
USER TESTING FINDINGS AND ITERATIONS
Delete References
NEXT STEP
HI-FI
Prototype
User Testing
Part 2
Final Design
23
REVIVE Website – HiFi
Based on the first user testing:
24
RESPONSIVE DESIGN
Primary (Current) stage: Desktop Version
Design: (Wang, 2024 )
Mock Up: (Freepik, n.d)
REASONS FOR CONDUCTING USER TESTING
25
Usability testing focuses on ensuring the user of any digital tool or information system can navigate and engage with the resource easily and effectively (Keenan et al., 2022).
Discover the Problems
Improve the Design
Understand users' preferences and behaviours
The ultimate goal of usability testing is to create a product that solves your user’s problems and helps them achieve their objectives with a positive experience (Maze, n.d.).
26
USER TESTING PROCESS
1.
Define Objectives
2.
Recruit Participants
3.
Design Test Scenarios
4.
Conduct Testing
5.
Analyse Results
6.
Report Findings
7.
Implement Changes
27
USER TESTING PARTICIPANTS
(Wang, 2024 )
Elaborate usability tests are a waste of resources. The best results come from testing no more than 5 users and running as many small tests as you can afford (Nielsen, 2020).
28
TASK 1
TASK 2
TASK 3
TASK 4
Understand Project Aim and Best Way to Watch Videos
Scenario: You are new to the website and want to understand its purpose and how to use it effectively.
Find and Read Mental Health Tips
Scenario: You have been feeling stressed lately and are looking for practical advice to improve your mental well-being.
Find Immersive Videos
Scenario: You are feeling overwhelmed and want to try out an immersive video to relax.
Contact a Counsellor
Scenario: You have been feeling very stressed recently and decide to contact a counsellor for some professional help.
USER TESTING PLAN
SESSION
OUTLINE
5 min
Introduction
2 min
Setting up the test environment
10+20min
Quickly browse the website + Testing
10 min
Conclusion and Post-test
Goals:
1. How it is easy to get familiar with the website
2. How people can easily navigate the website
Method: Remote
Data Collection:
Screen Shots/Recording + Notes
29
Metrics | Task | Tester 1 | Tester 2 | Tester 3 | Tester 4 | Tester 5 |
Task Completion (Expect: Yes) | 1 | Yes | Yes | Yes | Yes | Yes |
| 2 | Yes | Yes | Yes | Yes | Yes |
| 3 | Yes | Yes | Yes | Yes | Yes |
| 4 | Yes | Yes | Yes | Yes | Yes |
Time Taken (Expect: below 15s) | 1 | 10.5 | 11.01 | 10.25 | 9.57 | 9.98 |
| 2 | 5.25 | 5.32 | 5.77 | 5.68 | 5.13 |
| 3 | 5.89 | 5.99 | 6.03 | 6.09 | 6.59 |
| 4 | 6.12 | 6.23 | 6.68 | 6.67 | 6.1 |
Error Times (Expect: 0) | 1 | 0 | 0 | 0 | 0 | 0 |
| 2 | 0 | 0 | 0 | 0 | 0 |
| 3 | 0 | 0 | 0 | 0 | 0 |
| 4 | 0 | 0 | 0 | 0 | 0 |
Assistance Required (Expect: 0-1) | 1 | 0 | 0 | 0 | 0 | 0 |
| 2 | 0 | 0 | 0 | 0 | 0 |
| 3 | 0 | 0 | 0 | 0 | 0 |
| 4 | 0 | 0 | 0 | 0 | 0 |
Level of Difficulty 1-7 (Expect: Under 3) | 1 | 1 | 1 | 1 | 1 | 1 |
| 2 | 1 | 1 | 1 | 1 | 1 |
| 3 | 1 | 1 | 1 | 1 | 1 |
| 4 | 1 | 1 | 1 | 1 | 1 |
PARAMETERS FEEDBACKS
(Wang, 2024 )
Highlight:
Most testers had favourable outcomes. Interestingly, they usually browsed the homepage first during the first task: Understand the project aim and the best way to watch videos. This led them to spend more time on the task. This is a typical human reaction—when entering a website, we tend to quickly scan the homepage first.
30
THE SYSTEM USABILITY SCALE (SUS): POST-TEST ASSESSMENT OF USABILITY FEEDBACKS
Question | Tester 1 | Tester 2 | Tester 3 | Tester 4 | Tester 5 |
1. I think that I would use this website frequently. | 4 | 4 | 5 | 5 | 4 |
2. I found this website unnecessary complex. | 0 | 0 | 0 | 0 | 0 |
3. I thought this website was easy to use. | 5 | 5 | 5 | 5 | 5 |
4. I think that I would need assistance to be able to use this website. | 0 | 0 | 0 | 0 | 0 |
5. I found the various functions in this website were well integrated. | 4 | 4 | 5 | 4 | 5 |
6. I thought there was too much inconsistency in this website. | 1 | 0 | 0 | 0 | 1 |
7. I would imagine that most people would learn to use this website very quickly. | 4 | 4 | 4 | 5 | 5 |
8. I found this website very cumbersome (awkward) to use. | 0 | 0 | 0 | 0 | 0 |
9. I felt very confident using this website. | 4 | 5 | 5 | 5 | 5 |
10. I needed to learn a lot of things before I could get going with this website. | 0 | 0 | 0 | 0 | 0 |
0: Strongly Disagree 5: Strongly Agree
(Wang, 2024 )
Highlight:
Basically, they found the website easy to use, requiring no learning curve or assistance with useful information.
The most basic way to use the SUS is to get a quick and clear judgement about the usability of your website (Thomas, 2019).
31
USER TESTING FEEDBACKS
32
DESIGN ITERATIONS 1
Cards
Slider
Points:
/ Website Arrangement /
33
DESIGN ITERATIONS 2
/ Videos Arrangement /
Grid
Thumbnails
Point:
34
DESIGN ITERATIONS 3
/ Colour Changed /
Light Background
Dark Background
Point:
35
DESIGN ITERATIONS 4
/ Add Shapes /
Point:
As this section focuses on tips for staying mentally healthy and happy, it should have a happier and more vibrant feel.
I've added some stickers to make the section more engaging.
Monotonous
Vibrant
MAIN �UI UX LAW
36
Consistency: Uniformity in design elements and text throughout enhances user experience.
Hick’s Law: The site minimizes user choices, making navigation simple with limited, clearly defined sections.
Fitts’s Law: Large, easily clickable buttons are used for video access, improving usability.
CONCLUSION
Based on studies and research, it is evident that many people are under significant pressure and seek stress relief but face numerous restrictions. This issue requires greater attention and concern.
Analysis of survey data reveals a significant increase in the incorporation of digital art techniques, indicating a growing recognition of the potential benefits of digital media in art therapy (Zubala, Kennell and Hackett, 2021).
37
Based on feedback, videos featuring natural scenery and abstract patterns have been shown to help people feel calm and effectively relieve stress.
The solution does solve the problem
The prototype proves that the concept is both viable and effective.
User testing demonstrates the viability of the concept and the usability of the result.
RECOMMENDATIONS
38
Accessibility and Responsive Design
1. Fits Multiple size of screen
2. Screen readers and adjustable text sizes
3. Adjust font sizes or use high-contrast themes for better readability
Benefit people worldwide
1. Different languages
Real Collaboration / External Support
Enhancing user interaction
1. Gamification elements like progress tracking, achievements, and rewards can significantly boost engagement and enjoyment.
BIBLIOGRAPHY
39
40
BIBLIOGRAPHY
REFERENCES