RESUME
UX / Interface Design | Sep 2023 - Dec 2023
Tapestry Book
Tapestry Book is a digital prototype, developed to elevate seniors’ experiences of searching for and viewing photos on their mobile phones. In team of 3, we recognized that flat design may hinder the understanding of using an app, especially for seniors, who are not familiar with the interface of a mobile app. With skeuomorphic design, we offer seniors a platform to share cherished moment in a linear, intuitive way.
Tapestry book was a part of Simon Fraser University IAT 333 Interface Design.
Team SVJ
Jae Eun
Valeriya
Safwat
Role
Project Management
Primary/Secondary Research
Digital Prototype
Tool
Figma
ProtoPie
Adobe Illustrator
Simon Fraser University
Final Prototype
Design Domain
Wireframing
User Study
Result & Reflection
Link to
Prototype
We started the project with the aim to provide a mobile app specifically designed for seniors aged 75 and above feeling social isolation primarily due to memory issues.
Before delving into developing concepts, we wanted to explore what are the factors that may help seniors feel connected to the community, as well as the ways that technology currently aids them in feeling so.
Therefore, I conducted an online survey for 21 people aged 65-74 and 1 person aged 75+, which yielded the result below.
Records of survey responses
43%
38%
52%
9 out of 21 respondents mainly use websites to gain information and access services.
8 out of 21 respondents mainly use social media with friends/family to gain information and access services.
11 out of 21 respondents expressed concern around data privacy if using digital technology or apps for social interaction.
Common Themes
Having common interests/hobbies, having consistent, regular communication, and fostering friendship are the motivating factors to participate in group activities.
As a result of this survey, we questioned
How might we build technological aid to foster regular, consistent community connection for older adults aged 75+ in a way that feels intuitive for them?
Valeriya created a storyboard of how the user may share their visual & auditory memories.
Based on the video of a former ballerina with Alzheimer reviving her past by listening to the relevant music, we hypothesized that an app to share the not only visual but also auditory memories may help foster a sense of connectedness to the community, especially for seniors.
Final Prototype
Design Domain
Wireframing
User Study
Result & Reflection
After identifying our concept as ‘an app to share visual & auditory memories’, we turned to Figma to create 2 set of wireframes: first one in flat design and the next one in skeuomorphic design. We determined that skeuomorphic design will enhance the potential users’ understanding of each element’s function.
BACK
NEXT
MY GALLERY
COMMUNITY
ADD A PHOTO
LIBRARY
60s
FRIENDS
UNION PARK
SHOPPING
10 PEOPLE LIKED THIS PHOTO
Sound assigned to photo
Choose another sound
Describe photo with 3 words
Play Sound
Add Description
Change Sound
BACK
SELECT 3 WORDS
BACK
LIBRARY
FRIENDS
UNION PARK
SHOPPING
60s
ADD A NEW WORD
HOW WOULD YOU DESCRIBE THIS PHOTO?
TYPE WORDS BELOW
BACK
Put a comma do add more than one keyword.
Suggest
Suggest
Suggest
Q
W
E
R
T
Y
U
I
O
P
A
S
D
F
G
H
J
K
L
Z
X
C
V
B
N
M
123
space
Go
10 PEOPLE LIKED THIS PHOTO
BACK
LIBRARY
BAKERY
CAR PARK
UNION PARK
SHOPPING
Sound assigned to photo
Choose another sound
Play Sound
Change Sound
Flat design with simplified & abbreviated elements
BACK
NEXT
ADD
PHOTO
LIBRARY
60s
FRIENDS
UNION PARK
SHOPPING
MY GALLERY
TAP HERE TO VISIT ‘COMMUNITY’
TAP!
TAP!
TAP!
TAP!
10 PEOPLE LIKED THIS PHOTO
BACK
CHOOSE ANOTHER SOUND
ADD KEYWORDS
PLAY SOUND
Upload your own sound!
Tapestry Book made this sound for you
Sound suggested by Mirae McClair
in Coquitlam, BC
Sound suggested by Nicholas Richardson
in Anmore, BC
Sound suggested by Siwon Choi
in Port Moody, BC
Sound suggested by Maryam Raz
in Port Moody, BC
Sound suggested by Maryam Raz
in Port Moody, BC
BACK
I AM DONE MAKING SELECTION
Sound that you uploaded
Tapestry Book made this sound for you
Sound suggested by Mirae McClair
in Coquitlam, BC
Sound suggested by Nicholas Richardson
in Anmore, BC
Sound suggested by Siwon Choi
in Port Moody, BC
Sound suggested by Maryam Raz
in Port Moody, BC
Sound suggested by Maryam Raz
in Port Moody, BC
BACK
I AM DONE MAKING SELECTION
BACK
HOW WOULD YOU DESCRIBE THIS PHOTO?
SELECT 3 KEYWORDS
LIBRARY
60s
FRIENDS
UNION PARK
SHOPPING
ADD NEW KEYWORDS
Skeuomorphic design to enhance understanding of each function
We have named our project to be Tapestry Book, in recognition of how memories are intricately intertwined by visual and auditory senses and the surrounding community.
In order to test if the Tapestry Book’s skeuomorphic design enhances understanding of the purpose and function of the app, we conducted user studies through in-person think-aloud testing and system usability scale.
First mockup
Step 1. In-person Think Aloud Testing.
Step 3. System Usability Scale.
Step 5. Negative Study Findings.
On the other hand, the common negative observations were that:
All participants had issues with identifying intended user goal without explanation
All failed to discern collaborative features
All became lost when there are too many minor steps to complete a task
Step 2. Quantification
I quantified the number of successful completion of the given tasks and recorded unexpected or unique feedback or interactions on Excel spreadsheet.
Recorded data can be found here.
Step 4. Positive Study Findings.
The common positive observations were that:
All participants thought that the system is easy to use
All participants were satisfied with the look of the UI
Final Prototype
Design Domain
Wireframing
User Study
Result & Reflection
5/5 completed major tasks (i.e. logging in, playing sound, choosing/keywords, uploading photos)
---
Average 4.2 rating was recorded on SUS for “I thought the system was easy to use”
---
Averge 2 rating on SUS “I found the system unnecessarily complex”, “ I needed to learn a lot of things before I could get going with this system”
---
5/5 were satisfied with the size of the buttons and appreciated the labelling for each button
---
---
0/5 had a clear idea of the intended goal of the app
---
0/5 recognized sound as a key feature
---
Only 1/5 was able to complete minor tasks e.g. using keyword auto-suggestion, assigning different sound, identifying pre-assigned sound
---
Average 3.2 rating on SUS “I think that I would need the support of a technical person to be able to use this system”
---
0/5 identified and discerned intended purpose of collaboration features that allow other people to like and assign sounds for them
I asked 5 participants, 3 aged 60-64, 1 aged 65-69, and 1 aged 70-75, to first, interact with the app however they would like, then gave specific tasks to complete.
I asked each of the participants to fill out system usability scale and verbally explain why they responded with such a score for each questionnaire item.
Final Prototype
Design Domain
Wireframing
User Study
Result & Reflection
Following the user study, we refined our final prototype to contain the functions below:
Community connection
By viewing the photos posted by other community members, users will be able to compare their own old memories with those shared by others, and engage in simple interactions such as liking photos or suggesting sounds.
Linear, intuitive interaction
The steps are kept short; if there are multiple steps for the main interaction (e.g., adding a photo), they are integrated into one screen. The user interface is designed with large, clearly labeled buttons, making Tapestry Book accessible to individuals with low digital literacy.
Overall, this project has given me opportunity to explore the perspectives of a senior, specifically aged 60 and above. What we perceive to be outdated and not aesthetically pleasing, such as skeuomorphic design can be in favour of people who have lived different generations from mine. Skeuomorphic design was actually a risk that we took; we had doubts that the research participants would consider it as a benefit of Tapestry Book. Therefore, we were pleased that they found the system easy to use.
However, more exploration is to be done regarding cognitive load. We thought that by implementing a linear scene transition would decrease cognitive load; however, the participants were still confused to see that there were a number of unnecessary steps. That is, there is a need for an app with simplified functionality with minimal number of steps. I wondered how can such a balance be achieved between complexity of a functionality and length of user journey in the context of the seniors.
Reach Me Out!
@ Jae Eun Kim 2024
jaeeunk@sfu.ca
778 866 8123