top of page
E-Sound
'E- Sound' is the music app version of TikTok that is designed to introduce a new entertainment platform for older individuals to discover, share, and edit music pieces online.
This project was initiated by the 2020 SDG Summer School, mentored by the Citizen Science Center, University of Zurich. During summer school, I took on challenge five ——' caring for the elderly by integrating the features of music apps like Spotify and music editing apps to improve the mental health of elderly people who had suffered from the lockdown due to the pandemic.
My Role
Product Designer
UI/UX Designer
Strategist
Project Type
Product Design
UI/UX Design
Graphic Design
Invidual Project
Timeline
Summer 2020
(1 month)
UX Method
User Interview
User Flow
Competitive & Comparative Analysis
Heuristic Analysis
Information Architecture
Prototyping
Overview
The paradigm shift in the social life of elderlies during the pandemic lockdown
As the coronavirus disease 2019 (COVID-19) swept across the globe in early 2020, older persons were disproportionately affected by the pandemic, with more severe repercussions and fears that isolation would exacerbate underlying mental health disorders. In this situation, the elderly are yearning for social activities to bring them back to normal lives, and as far as our research, music is an important part of improving the dynamic of the elderly’s life quality.
Initial Thinking
Target Users
-
Older adults who are feeling isolated and have strong social needs
-
Older adults who want to create their original music pieces during the lockdown of COVID-19
Research Methods
-
Existing music app research (value proposition, theory of change, competitor analysis)
-
Qualitative research (in-person interviews)
Challenge
Why are the music apps currently on the market boring?
-
How to integrate the different functions, including music discovering, editing, and sharing, based on conventional music apps on the market ?
-
What if we can create a music app version of TikTok which make the music compositing process more intuitive?
Unintuitive UX/UI Design
To get into more detail about what the UX/UI issues are, I checked out the flow of the existing music editing
-
The UX/UI design is typically for professional music editors as opposed to amateurs, including old people
-
Old people may not distinguish the complicated configuration while editing the music
-
The UI design is boring and lacks entertaining
Effectiveness of the TikTok video editor
To get more inspiration from the efficiency of the prevalent TikTok video editor, I have done UX/UI research on the configuration
-
Different uploaded videos are marked by different color schemes.
-
Browse the free templates for designs users can easily customize and share.
-
Engage the users with a modern UI frame.
Research Process
A. Competitor Analysis —— A journey to learn from others...
Competitive User Journeys
First, in order to get a comprehensive picture of the market, competitors, products, and users, I conducted competitive user journeys toward Spotify, Audio Editor, and Splice to identify the market gaps and find opportunities.
01
Spotify
A modern music streaming platform
Spotify is my favorite music app and I'm sure I can learn a lot from its design, so this observation process helped me evaluate its effectiveness and gave me a sense of the streamlined interaction design. The most important thing I have learned in this process is that we should design the site architecture and navigation system more flatly to reduce friction.
First Impression
Interactive Design
Visual Design
-
Simple and natural
-
The intuitive interface is easy to navigate and absorb information from due to its uniform structure and simple categorisation
-
Instead of the home button being called ‘Home’, it could be called ‘Explore’, since that is more true to what it actually is
-
Simple, balanced and suitable
-
The home page gives the user playlists and album recommendations, as well as customised playlists. If the user wishes to find their own playlists, albums or podcasts they have to click on ‘Your library’ and then filter out what they are looking for
-
New users want a short user journey before they could play anything - Spotify made it all the way through only two process to get there!
-
There is no comment section below the songs and lyrics which is a pity if the users can’t share their thoughts
-
1/ There are three ways to play music on Spotify: the first is to play music directly, which is the fastest; the second is to enter the name of a favorite artist and have Spotify recommend related music based on the user's input; the third is to enter the Spotify recommendation system and listen to the most popular songs of the year as recommended by the system.
-
2/ I also noticed Spotify’s social function is rather simple, only able to share music with existing friends through airdrop, messages,and other social applications. It appears that Spotify does not focus on maintaining music community or cultivating a music celebrity fan culture to attain user stickiness.
-
1/ Spotify reduced friction by directing users directly to the home page, where they can listen to anything they want, even if the music doesn't reflect their preferences.
2/ The home page also combines many other features, such as a search function for music. In this step, Spotify presents system-generated data in categories to give users more inspiration, rather than displaying so much redundant information on the home page all at once which can be frustrating for users who just want to listen to music quickly.
3/ Another function of the home page is access to the user's library, where they can find their favorite music and artists that they have collected.
02
Audio Editor
An audio editing platform
By carefully conducting the application observations, I systematically sorted out the working pipeline and typical features in audio editing, which helped me to identify areas for improvement.
First Impression
-
Rough and crappy
-
No systematic guide at the bottom of the homepage
-
The UI design lacks coherence
Interactive Design
-
The users are ushered to sign up after they finish the editing, instead of finishing the authentication process at the beginning
-
No templates available for people with no audio editing experience
-
Most of the interactions happend on the effect interface, but the function keys are too small and not intuitive
Visual Design
Boring and unttractive
03
Splice
A short video editing platform
This case study provided me with fruitful insights from the prevalent short video editing app to develop new features for the audio editing functions.
First Impression
-
The interface is very user friendly and there are awesome array of effects, transitions, filters, etc which efficiently assists the production process
-
Intuitive and easy to use that I feel like I'm an expert of this app with just a few minutes of using it
Interactive Design
-
Import and export efficiency - it imports the media quickly even for those over a GB
-
Able to export in different quality sizes
-
Versatile and easier than its counterpart in iMovie
-
Its main functions include:
-
Changing the position of clips on the timeline
-
Cleaning up noise and imperfections.
-
Refining a musical performance by selecting different takes
-
Manipulating audio by slicing individual clips
Visual Design
-
Distinguishable comparing to its counterparts
-
Intuitive
-
Coherent
-
1/ This app adds filters and adjustments to videos in a very intuitive way. In the filters section, the user can directly see the result with the filter with a simple sliding gesture. Therefore, when thinking about the functions while editing the music I plan to provide templates with pre-modulated variables that frees the user hand allowing them to produce music pieces in different styles without manually adjusting the details
-
2/ The adjust features break down the filter combos, including a range of tools and features that allow users to make adjustment to the audio file they are working on. The features include: Volume, Equalization, Panning, Normalization, Fade in/fade out, Compression
-
1/ Besides the filters and the manual adjustments, the app also provides a music and sound library for users to DIY their audio. On the flip side, most conventional audio editing apps overlook the importance of providing a built-in music library.
Competitive Feature Analysis
For the second half of our research process, I did comparative research by comparing the top 3 music apps and describing their features in a tabular form.
B. User Research Insights
To understand the user's needs and expectations, my research process included conducting in-person interviews and competitor analysis. This research provided me with a comprehensive view of the production environment which set a solid milestone for the final design.
-
A shift age of older adults' social participation
Two insights from the in-person interview reveal a big shift
in the social life of older adults
-
During the Covid, due to the local policy, older ones are restricted to stay at home
-
98% of the people who have taken the interview disclosed that they haven't been able to go to public places, not to mention to meet their old friends
-
70% of them haven't heard from their friends since the Covid. Lacking a social scenario is the main reason for becoming isolated
-
Older adults value listening to traditional music
To better understand older adults' hobbies, I have put together a list of the top 4 hobbies from the seniors I interviewed
-
Having leisure activities help elderlies gain a purposeful life
-
Elderlies tend to prefer getting involved with activities with a social participation
Persona
Conclusions
Insights
I synthesized the collected data from in person interview and competitive analysis into the below insights.
Thread 1: Audio editing workflow
INSIGHT 1
INSIGHT 2
INSIGHT 3
A successful design should be inclusive and hierarchical, considering the needs and abilities of a diverse range of users. For example, we should provide both the audio templates and the adjustable variables to ensure the service meets the needs of all users.
By reading Spotify's research and development log, I realized that the design of the entry point and the authentication section should be as concise as possible in order to improve user engagement. In the early steps, we shouldn't focus on setting up the preferences or going through other irrelevant procedures.
The app should provide users with sufficient options per their needs as opposed to restricting them to a static workflow.
INSIGHT 4
The most important thing I have learned in the process of auditing Spotify's interaction logic is that we should design the site architecture and navigation system more flatly to reduce friction.
Thread 2: Elderlies' preferences
INSIGHT 1
INSIGHT 2
INSIGHT 3
Elderlies love traditional music and drama due to a range of reasons, including nostalgia, familiarity, and cultural connections.
Elderly people have the need to compose music, but most of them do not have experience in making music, and most music editing software is too difficult for them.
Communication between the elderly has not been brought up in most design solutions and we should prioritize social design in all cases.
Must be in APP
Should not be in APP
Design Concept
Information Architecture
Conceptualization and low-fi sketching
After identifying the pain points and the overall workflow of the app, I began sketching out the details and hierarchies of the key features for home design, music composition, user libraries, and social features. Sketching is a useful technique for organizing and conceptualizing ideas assisting me to effectively visualize and plan the rough outline of the design as a whole.
01
Home
This home design aims to assist users in exploring the music, uncovering inspirations, and identifying the open-source music clip they may need for their music edition. Generally speaking, for users who want to create their own pieces but have no idea how the music is made by combining melodies, rhythms, and harmonious, this system can infer their preferences based on their music listening history and push music templates and clips that match their taste to help them collect editable music resources.
02
Your Library
The library allows users to access and organize their own music collection. It includes options to view and play individual songs or albums, create playlists, and search for specific tracks.
The user profile allows users to create and customize their own personal accounts within the app. It includes options to set up a profile picture and bio, follow other users or artists, and access personal playlists and music history.
03
Search
The search process starts with a wide range of music genres and then narrows down the focus to regional music. The process was then further refined by focusing on specific music instruments and creating sound clips featuring those instruments.
Final Design
Reflection
Takeaways
Being restricted by the lockdown, I could not do as much qualitative research (in-person interview) as possible, and the process of getting to know the real needs of older people at this special time was harder than I expected since the elderly were merely digitally accessible. I may be biased in trying to make assumptions more or less while thinking of the functionality of the music app due to the lack of quantitative research ( survey). But I'm so glad to see the positive feedback on the visual design and the music composition part from my grandparents in my family, which pumped me up to think through the assistive design technology that I may apply to this project in the near future.
If I have more time, I will focus on encompassing the alternative keyboard to help older people with limited dexterity to navigate and interact with the buttons and screens using only a few simple interactions.
Other Works
UI/UX Design, Service Design, Sustainable Design
Developed a service design system that extends the life cycle of shoes and reduces the carbon footprint through the recycling process
Industrial Design, Mobility Design, Design Thinking
Introduces a novel intelligent solution that transforms stressful journeys
into additional leisure and productive time
bottom of page