We designed a mobile app version of an existing website, Corona Diaries (coronadiaries.io), an open source audio site where people can share their stories surrounding the pandemic.
My Role: UX Researcher, UI & Visual Designer
Team: 4 UX Researchers, 1 UI Designers
Tools : Figma, Zoom, Miro, Marvel, Maze, ZoomTimeline: 6 Weeks
Design an accessible mobile app version of the Corona Diaries website that suits the user needs of an audio app. With recording ability, the app still bears in mind privacy concerns regarding the contentious subject of COVID-19.
How do people listen to audio?
Corona Diaries has surely missed opportunity to get their project into as many hands as possible. Though the site is responsive, it lacks many of the features that users might expect when they explore audio on their mobile devices.
Users need a mobile tool that allows them to hear stories from people around the world in similar circumstances to help cope with isolation.
Identifying Our Users
In reality, no two users are alike, and our primary and secondary users may likely have dissenting perspectives. However, everyone has been affected by the pandemic and share some sort of frustration. The main difference between any two users would be whether or not they choose to post stories of their own.
People confined to their homes due to the pandemic, namely stay-at-home or work-from-home parents. These users might typically be more reserved, or less inclined to share. They would come to something like Corona Diaries as a spectator.
On the younger side, ambitious, ideologue. More inclined to share stories as well as listen.
Users will be able to connect with stories from all over the world, maintain privacy, and be encouraged to express themselves candidly.
No Synthesizing our data allowed us to outline a minimum viable product, which enabled us to sketch with certain features in mind.
Save/Like Posted Stories
Audio Transmission (Recording)
The first pass on the prototype was completed within two and a half weeks of our first research day. The results revealed, in short, that the design needed more work.
Of 8 Usability tests, 62.5% of Users reached the end target.
I took the opportunity to re-design the app, addressing some of the issues that we (as a team) would have liked to improve upon.
Double Diamond - Back
After reviewing our research, it seemed important to revisit the problem statement:
Users need a mobile tool that allows them to seek emotional validation by hearing stories that relate to their own.
The new problem statement caused me to reconsider some of the features we as a team decided to forego, and include some of the features we noted in our reflection. Those feature include:
Ability to "Like" or "Favorite" a story
Privacy Settings for User posting
More Competitive Analysis
Cross-analyzing some of the industries top competitors lead to iterations that had increasingly more familiarity, with a modern touch.
Still Room for Improvement
As a creative, I will always gear toward thinking there is room for improvement. I'm happy to see that the success rate for task 3 jumped from 62% to 100%. And while the design has vastly improved from the original, I would still like to explore how to get that last task up to 100%. Since the privacy settings are such a crucial element to the app, based on the research, I think having the ability to change those settings with as little confusion as possible would be best suited.
Below are some of the methods I might add into the entire design process:
Specifically regarding privacy settings and more.
Top Features of top Competitors - what makes those features successful?
Revise User Interview Questions
Engaging more with the aspects of Social Media and the "dopamine effect"
Deeper dive into Contextual Inquiries
We barely scratched the surface, and I feel even a better design could stem from more analysis of people interacting with the existing site.
Multiple rounds of grayscale prototyping and testing
I seemed to be stuck in the polish faze throughout my own iterations, and didn't take full advantage of iterating in grayscale to allow the process to move faster.
For showing interest in this case study! If you'd like to see more of my work as a UX/UI designer, please check out the case study for Altered. Also, please feel free to check in at anytime, as I am currently working on other projects.
Contextual Inquiries • Competitive Analysis • User Interviews
To translate the site into an app, as well as improve the experience, we had to explore the site for ourselves. Then, we wanted to see what others thought about the features within the site.
To translate the site into an app, as well as improve the experience, we wanted to explore the sight for ourselves; then, see what others thought about the features within the site to determine how we could improve upon the existing experience.
Key takeaways from user feedback:
Navigation was easy once prompt was read
Users liked the concept of being able to share and listen to stories surrounding the pandemic
Map feature fell short, "underwhelming'
Confusion about the purpose of the map
Users wished to be able to browse files based on subject
We analyzed key features of a several apps that we felt served a similar purpose. We were surprised to find that, if anything, Corona Diaries was closest related to blogs. Still, the concept seemed as novel as the virus that led to its creation.
A total of 12 interviews, with two sets of questions revolving around the Pandemic and use of blogs revealed that:
Would like an outlet to post and listen anonymously
They want to hear relative experiences
Users prefer to listen over sharing
They feel isolated due to the pandemic
Logging in or Signing Up allows user access to the full experience Corona Diaries has to offer, including changing privacy settings on your story at any point in time.
Testing consisted of five (5) tasks, three (3) of which were similar to the tasks given in the previous round of usability tests. Two additional task revolved around the updated features. Due to time constraints, only one "expected path" was established for each task.
Populate a Story List by Using the "Location" tab
Open Audio Player Screen
Populate a Story List by Using the "Location" tab
Record & Post an Audio Story
Populate a Story List by Searching Keywords
Change User and Location Display Settings on Previously Posted Story
NOTE: The titles summarize the action of each task that was to be performed, along with the relative results. Note: the tasks were written to omit the use of any words used within the app interface in order to avoid skewing favorable results of the user test.
The user test also included two "opinion scale" questions:
"How would you rate the ease of use? (Consider how easy or difficult you found it to complete the given tasks) "
"How would you rate the visual design? (Consider the look of the screens and any animations) "
PROTOTYPING & TESTING
Redesigned and Prototyped completely in Figma. Don't want to set up an account? Don't have to. In the new prototype, users are still allowed to browse and listen to stories without signing up. The ability to search tags and browse categories has also been updated.