Ambient Sounds App Prototype & User Study
Ambient Sounds App Prototype & User Study
User research and high fidelity mobile app prototype
User research and high fidelity mobile app prototype
Embedded Files
Project overview
Project overview
Tools used: Figma, Tally.so, Google Suite (Docs, Slides, Sheets)
Context: Solo Project, 4-5 weeks, finished December 2023
This self-directed project was a part of my google UI / UX certificate. It consisted of a user study, wireframes, and both low fidelity and high fidelity prototypes.
Process
Process
User research → Wireframe → Hi-Fi Prototype 1 → Usability Study → Hi-Fi Prototype 2 → Usability Study
Highlights
Highlights
Created a functioning prototype
Learnt how to conduct better surveys
Significantly increased Figma skills
Integrated animation and audio effects
Lowlights
Lowlights
User difficulty with the first prototype necessitated a second round of testing
Not enough low-fidelity testing led to difficult in prototyping
An example of app screens from the app Noice
User Research
User Research
User research plan and survey data
I began my research with an initial user study to get data on how people currently use ambient sounds in their day to day. This gave me some idea of where to focus my app, and on which specific features would be useful.
Low Fidelity Wireframes & Prototype
Low Fidelity Wireframes & Prototype
The low-fidelity design focused on creating a fun and playful app design that also included features that users found most useful. A lot of time was spent on exploring different ways for the app to save user groups and edit their sounds.
Two alternative versions of the app wireframe.
I ended up creating two very different versions of this low-fidelity wireframe in an attempt to understand how the app should function. Unfortunately I then progressed to High Fidelity prototypes without fully understanding the app challenges, which led to difficulties in the next stage.
First Draft: High Fidelity Prototype 1
First Draft: High Fidelity Prototype 1
This first draft of the hi-fi prototype focused on creating a fun playful design. Unfortunately the user flow had not been tested at this point, so I spent a lot of time changing and reconfiguring things to make sense as I led into prototype testing.
During this testing a significant portion of testers had difficulty completing their desired flows. This was due to testing too complex of a task for the user test as well as constrained steps that forced tasks to be done in specific ways.
For example, users had to add a name to their custom sound before saving it, which frustrated people who wanted to just create and listen. The app also did not have any animation or sound effects, which confused users who saw little feedback from their actions.
In order to address these user difficulties I began a full redesign of the prototype, and much of the work on this prototype had to be redone.
Revamping the Prototype: High Fidelity Prototype 2
Revamping the Prototype: High Fidelity Prototype 2
The second hi-fidelity prototype focused on a much simpler user flow of creating a custom sound group, and of playing an existing sound group. It also incorporated several design improvements, including a better Material Design, now-playing animations, and even audio playback. All these changes led to much happier users and a more functional app.
Project Takeaways
Project Takeaways
The biggest issue with this project was not enough low-fidelity testing. I skipped the lo-fi prototyping stage and the design suffered from this shaky foundation. This process led to expensive re-testing and late design changes. Initial high fidelity prototypes were far too complex and didn't test for simple user flows first, so even technical users got stuck easily. This was fixed in the second version of hi-fi prototypes, but would have been much easier to fix early on.
I also began to understand material design and mobile app flows much better towards the end of the project. This gives me confidence in being able to iterate more effectively moving forwards.
Overall I am satisfied with the state of the latest prototype and I’ve learnt a lot about how to effectively plan for my next project
Interactable High Fidelity Prototype
Interactable High Fidelity Prototype
Give the current prototype a try yourself with the embedded version on the side, or the link below.
Check out another project?
Page updated
Google Sites
Report abuse