Blossom App Design

Working With Another Designer On A Quick Timeline

Summary

I created this project for Avocademy’s designathon, which was a 1 week event where everyone was expected to come up with an idea, flesh out that idea and present that idea. The hosts for the event presented the participants with 3 general topics to choose from. My topic was financial literacy and how to improve that with users. At the beginning of the week I was working with a partner. By the end of the week, my partner stopped responding and I finished the project alone. This event was a very valuable experience for me and I am glad I participated.

The Details

Here are all the details of this project.

  • My Role

    UX Designer UX Design Visual Design Prototyping Style Guide

  • The Tools We Used

    Figma Slack Maze

  • The Timeline

    May 16th - 22nd, 2022

The Research

Started With A Survey

We weren’t sure exactly where to go with this prompt so we decided to start with a survey about finances. Given the short time frame we sent the survey to others participating in the event.
We got 26 responses.

The results included:
Participants rated themselves at an average of 2.96 for their current knowledge of personal finance topics.
The top topics participants would want to learn about include managing money, budgeting and savings.
Participants prefer computer based instructions with a preference for video content.
40% of participants have at least 10,000 in financial debt.
25 participants were between 18 and 34.

Once we had the survey results, we brainstormed project ideas. We noticed that many young professionals and many women don’t have a strong grasp on their finances. We wanted to design something to help those people in particular. We decided to design a financial goal and budgeting app. We also decided to include a section in our app for instructional content to teach people more about managing their finances.

Next Step

On To Sketches

We split up the screens between the two of us and got to sketching. I have found that I really like to start with sketches on paper. It helps me to get through ideas quickly and decide on a direction that I want to go.

Wireframes

Once we had some paper sketches that we liked, I turned them into digital wireframes. I created the wireframes for the user flow while my partner gave input.

Looking For Feedback

Usability Testing

After we were satisfied with the wireframes I created, I took them and created a low-fidelity prototype. My Fellow Designer took the prototype and created a usability test using Maze. We shared the test in the event slack channel.

Making Updates And Finishing The App

Wireframes To Testing To Mock-ups

Once we got some feedback, I began turning the wireframes into high-fidelity mock-ups. I tested a few different color palettes on the wireframes. Some were not very accessible and others did not look good to me. I also went with a font that I had used before and liked for apps.

Style Guide

Bring The App To Life

High-Fidelity Prototype

I then created a high-fidelity prototype from the mock-ups. I also created a deck of slides and recorded a presentation for the Designathon.

What I Learned

  • This was the first time that I created a design on a quick timeline. Everyone had from Monday May 16th to Saturday May 21st. It went really quick in the beginning and I felt like I didn’t have time to properly test my design.
  • This was also my first time working with another designer. It was definitely interesting. I felt like we laid out a solid plan in the beginning, but my partner started moving way faster and completed tasks that we assigned to me. It was also disappointing losing contact with her and having to finish the project on my own.
  • I did learn more about creating style guides and tools for usability testing like Maze.