Audioasis
Audioasis is a storytelling application designed to allow users to preserve and share short stories. Developed as part of a Capstone project at UC-Irvine, the project spanned over 6 months, from Fall 2022 to Winter 2023.
UI/UX Designer Co-lead &
Jr. Flutter Developer
Kelly Keiser
UC-Irvine Capstone Course Project
Figma, Miro, Google Suites, Flutter
5
Challenges our Team Faced
Design Inspiration: We used Audible, Spotify, Wattpad, and Instagram for inspiration to ensure a familiar user experience.
Limited User Research: Due to class scheduling constraints, user research was limited, and participants may not have perfectly matched our target audience.
Innovation: We were creating a new platform for short stories, leading to limited design references.
Project Timeline
User Research
Competitive Analysis
As a team, we conducted a comprehensive competitive analysis by:
Selecting Competitors: Each team member strategically chose a prominent story-related app as a benchmark.
Comparative Interface Analysis: We conducted a page-by-page comparison of our planned app features with competitor interfaces. This analysis identified trends in user interface (UI) design for storytelling applications, while also pinpointing opportunities for Audioasis to differentiate itself from the competition. We ensured our design wouldn't be overly complex and hinder user experience.
Benchmarking: This analysis revealed areas where we could improve our design to be more user-friendly and competitive. It also highlighted common functionalities across competitor apps, which helped us validate our own design decisions.
Design and Prototyping
Sketches
Freehand sketching allowed us to explore various Audioasis layouts in a creative flow. We experimented with element arrangements and functionalities to find the most user-friendly and visually appealing approach. Simultaneously,sketching helped us identify and prioritize essential features, ensuring their prominent placement within the app for optimal user accessibility.
Low/Medium Fidelity Wireframes
Our low to medium fidelity wireframes were instrumental in rapidly sketching out Audioasis' core features. Inspired by Spotify's familiar layout, these wireframes helped us iterate on functionalities and user experience. This approach ensured a balance between a fresh audiobook experience and user comfort for those familiar with similar platforms. For our client, unfamiliar with design processes, the wireframes provided a concrete understanding of Audioasis' functionalities and interface, facilitating clear communication and buy-in.
Medium/High Fidelity Wireframes
We used medium-fidelity wireframes for initial user testing with 5-7 participants. Their valuable feedback allowed us to iterate and refine the design before high-fidelity mockups, addressing usability concerns early on. This resulted in some minor changes to the interface that improved user understanding of the app's features. This user-centered approach ensured a smooth user experience while saving development time.
User Testing
2 Key Findings
Upload Process Confusion
The initial design of the upload button resembled a share button, leading to user uncertainty about its function.
Unclear Content Upload
Title headers within the main text box confuse users about where to enter story content.
Clearer Upload Icon
We simplified the upload icon to make it easier to understand what action to take by adding text to the icon.
Dedicated Title Field
Title headers were moved outside the text box for better clarity.
Helpful Placeholder Text
We added grey placeholder text to guide users on what information to enter.
High Fidelity Mock Up
This project reinforced the importance of client meetings. By actively listening and adjusting designs to their vision while maintaining user-centricity, we achieved a successful outcome.
Working with a client with limited technical knowledge highlighted the need for clear and concise communication. I learned to break down complex concepts into simpler terms, promoting better understanding and collaboration.
Beyond the case study, weekly presentations for the UCI showcase strengthened my public speaking skills. This experience helped me gain confidence presenting projects to diverse audiences.