Project Overview
Context
As a busy college student, I often struggle to find motivation in my everyday life to stay focused and achieve my goals. I designed a platform that allowed myself and others to find that little bit of motivation to get them through the day.
I had 2 weeks to ideate, design, and build a functional app for my interaction design class. Creating an interactive, user-centered experience inspired the project; as long as the experience is well-planned and meets target audience needs, the idea can be anything. I created an app to bring positivity and inspiration to people's daily routines and improve their mental health.
Project Scope
Scope
The project was an individual, concept-driven interactive project in which we had to brainstorm various ideas, conduct research related to our project, run user tests, and then present it in class.
My process
- Ideation and goal-setting
- Market Research and Competitive Analysis
- Conceptualize and Ideate
- Create Prototypes and Mockups
- User Testing and Iteration
- Development and Implementation
- Showcase
The Process
Idea Refinement
I refined my ideas and conducted preliminary research during the first three days of the project.
I pitched "Words of Wisdom," an app designed to address the stress and anxiety issues faced by college students, providing a unique and alternative way to gain motivation in their day.
For our project, we needed to brainstorm several ideas before submitting a final proposal. I chose Words of Wisdom because I keep a running list of motivational quotes and refer to it when I need a calling card to keep me going. If I can overcome the motivational barrier with quotes, so can someone else.
My app was refined for college students aged 18 to 21, offering a unique and beneficial experience to cater to their needs.
My app is designed for college students aged 18 to 21, including my classmates, who frequently suffer from high levels of stress, anxiety, and depression. During my research, I discovered that this demographic has unique challenges and needs.
- According to the 2019 National College Health Assessment survey, 62% of students reported overwhelming anxiety.
- 45.1% of students struggled to function due to depression.
- As a student myself, i often find that my peers and I struggle with work-life balance and we look for several outlets to keep us going.
While my app does not provide mental health diagnosis or treatment, it does provide stress management and overall well-being support, addressing the issues that this age group faces.
I conducted a comparative analysis to ensure my app would stand out by learning from other quote platforms' strengths and weaknesses.
To make sure Words of Wisdom had all the necessary functionality and to address the potential downsides of other quote platforms, I conducted a comparative analysis. I researched and evaluated various existing quote platforms to identify their strengths and weaknesses. By learning from the shortcomings and advantages of other platforms, I was able to ensure that Words of Wisdom would provide a unique and enhanced user experience. A common theme was visual clutter and a lack of visual appeal, which I made sure to address in the design of Words of Wisdom. Furthermore, I researched the user demographics, including age and gender, of the platforms, and the majority of the users were 25–30 years old.
Drawing from audience research, I settled on three key features, ensuring complete anonymity for advice sharing, a quote randomizer, and a visually appealing design.
Drawing insights from my audience refinement research and comparative analysis, I settled on three key features for my app. Firstly, I opted for complete anonymity in advice sharing to eliminate source bias and keep the focus on the message.Next, I introduced a quote randomizer to provide unexpected advice from various categories. Lastly, I adopted a typographic-based UI with vivid colors and strong typography for an engaging, visually appealing design.
While not a replacement for professional mental health resources, my app is a handy source of inspiration and motivation. Be inspired, gain new perspectives, find reasons to smile, and get that extra push to finish the day strong.
Experience Design
Over the weekend, I honed down the UX journey and developed the prototype.
To get a sense of what I wanted the overall experience to be like, I created a user journey showcasing the end goal of the user.
I organized the journey around three emotions someone could experience while using the app: sadness, contentment, and happiness. This allowed me to anticipate and address potential pain points and moments of delight throughout the user's interaction with the product. Although simple in nature, I was able to think of additional components and ideas when creating the journey.
I created a user journey map to identify user goals and motivations, addressing pain points and product improvements. The app focused on stress management and overall well-being.
I created a wire frame using the user journey map to get a general idea of how the app would look and feel. Then, using Figma, I created a more detailed mock-up of the app, complete with specific design elements and user interface components. Because this app was based on typography, I knew typography and color would have to be strong assets in this design. Because the app's primary usage would be on mobile, I began with a mobile type size that was left aligned. If a web version was required, I would scale, establish a baseline, and increase the columns of each quote.
Based on my user flow, I created a wireframe to better understand the components and assets needed for my app.
I created a wire frame using the user journey map to get a general idea of how the app would look and feel. Then, using Figma, I created a more detailed mock-up of the app, complete with specific design elements and user interface components. Because this app was based on typography, I knew typography and color would have to be strong assets in this design. Because the app's primary usage would be on mobile, I began with a mobile type size that was left aligned. If a web version was required, it would scale and increase the number of columns.
I designed a bold and minimalist UI with modern typography and bold colors to stand out for users aged 18 to 24.
Based on research gathered from my audience refinement process, I designed the UI on Figma and used an in-class test group for testing. For the user interface, I opted for a bold and minimalist design approach that also stands out from other apps. To accomplish this, I used a combination of modern, bold typography and vibrant colors to make the app stand out and be a popular choice for users aged 18 to 24. I went with a thick, bold font and a lime green and black UI scheme.
The testers reported:
- The font is too large and gets stuffy in some areas.
- Switching to a thinner font could increase readability a bit.
- The green was too bright and hurt a few eyes in the dark.
- They loved the green and dark combo; it made the platform unique.
- There is a bit too much white space in some areas.
Based on feedback, I made changes to improve readability and visual appeal, adding hover-able animations and iconography.
I began by explaining the premise of the app, the why, the how, and the interaction. I then showed them a prototype of the app's UI design and asked for their feedback. The test group provided valuable insights and suggestions; the biggest suggestions were the font choice and colors, which they found difficult to read and visually overwhelming in dark rooms. They also took note of inconsistent or confusing UI elements and recommended I streamline the UI elements to improve the user experience. Based on their feedback, I decided to make changes to the UI design in version 2, focusing on improving readability and creating a more visually appealing color scheme.
I built the app using bubble.io, overcoming development challenges and conducting extensive testing.
After finishing the UI elements, I built the app with bubble.io. There were numerous hiccups and development issues along the way, the majority of which stemmed from my lack of platform knowledge, but I was able to overcome them with the assistance of online tutorials and forums. I also performed extensive testing to ensure that the app ran smoothly and that all UI elements were responsive. Overall, the development phase provided opportunities for learning and growth, and I am proud of the final product that I was able to deliver in a matter of days.
I incorporated feedback from friends and designers to enhance the app's visual interest and added dynamic elements.
As the app neared completion, I met with a few friends and designers to go over it one last time. They liked the functionality and colors, but many of the elements were static and motionless. They pointed out that while popular apps like TikTok, Twitter, and Instagram all have static elements, user-generated content adds motion and interest. I added hover-able animations and iconography to add visual interest. The typewriter effect in the header of some pages, which matches the typographic and bold nature of the app, was a key, standout element of the platform.
Presentation
The project received positive feedback from students in the class, with some suggesting its use at universities across the U.S.
We had to present our projects on the final day of the project and allow students in the class to test and review them. To my surprise, the initial response to my app was one of awe and praise. Many students were impressed with the app's functionality and design, and some even expressed a desire to use it themselves. The typography, layout, and concept were all well received. Some imagined that the app could be used at universities across the United States as a place for students to share anonymous secrets or tips. Despite this, the overall reaction to my work was positive, and I was encouraged to keep refining and improving the app so it can be something useful for people.
The app in action
Impact & Reflection
Reflection
In retrospect, I really enjoyed this mini-project because it really put my design skills to the test. Although I am familiar with being the sole designer and developer, the quick turnaround of research and development was a new challenge for me. While the app was generally well received, I realized that if I had more time, there were still areas that needed to be improved. I would improve the platform's user backend and provide more functionality to users who log in. I would also require users to log in to post a quote, moderate, and prevent spam or inappropriate content.