InvoiceMe — An app for small business owners to send and track invoices
My Role: As the lead UX Designer on this project, I created personas, a problem statement, user journey maps, wireframes, a prototype, performed usability studies, created a mock up, and took into account accessibility during the process.
The Goal: Create an app that gives small business owners a place where they can track and send invoices to clients for their services. It should be easy to use and effective.
Target Audience
Problem Statement:
Mira is a persona that is used to represent the target audience for the InvoiceMe app. She is a Freelance Graphic Designer who needs an effective way to track and send invoices because she wants to be more professional and organized.
Research
I conducted a usability study with 5 participants, 3 female and 2 male, within a wide age range.
I chose to do a usability study as a way to measure how easy the app is to navigate. I wanted to make sure that a wide age range was surveyed to make sure that my app was easy for everyone to use.
The results to the usability study are shown in the graph.
Usability Study
My key competitors are Paypal, Honeybook, Square, and Freshbooks. Paypal is a direct competitor that offers ways to send and receive invoices with fees taken based on a percentage of the invoice. They have personal and business functions, and their platform can be used by small businesses that perform services. They are a large company, and they allow same day transfers to your bank account or you can wait 1-3 business days to receive your money without a fee. Honeybook is another direct competitor that has personalized ways to send and receive invoices, and they are a good option for service providers. They have a personalized way to send invoices using your company's logo, colors, and many different template options. I like how they have a way to schedule clients within the app as well. Freshbooks is the last direct competitor that I analyzed. They have a way to send and receive invoices, and can be used by small business service providers. They have different plans available to purchase depending on the type of business. Lastly, Square is an indirect competitor. They can be used by service providers, but the products that they offer are very extensive. They have different apps that can be integrated together for full service business operations.
Competition
During this project, I was the only person working on it. I think I could have benefited from having someone to bounce ideas off, and to collaborate with.
This project is the first app I have created, so there is a lot that I still need to learn to be able to perfect the craft of UX Design.
The research for this project was performed on my friends and family members, and in the future I will need to make sure the research is coming from the target audience.
Challenges
Design Process of the App
While designing the app, I took into consideration my research on the target market and key competitors. I thought about the functions that I wanted the app to have first. While taking into consideration the major pain points of the user, I knew there needed to be a page where the user could create a custom invoice, and a way for them to track invoices as well. After thinking about the “must have” functions, I thought in terms of a small business owner and what they might want in an invoicing app. I decided to add a schedule function, and a customer page. My thoughts were that these two additions would make it easier on the small business owner to have everything in one place.
Next, I started drawing paper wireframes of the homepage and began to think about how I wanted everything laid out. There were some features that I liked about certain wireframes, so I decided to put my favorite features all into one new creation. From the paper wireframes, I was able to start transferring them into digital wireframes in Figma. Eventually, I had my digital wireframes done and began to work in the prototype function to put everything together.
Finally, I was able to make decisions about what I wanted the final design to look like. I had a good layout already, and it was time to make decisions about color, icons, font, and everything else that brought the app to life. Eventually, I came up with the final design of the app and put everything together to show the prototype.
Wireframes and Low-Fidelity Designs for the app
Paper wireframes of the homepage
Low-Fidelity Prototype
Final App Design
High Fidelity Prototype
Conclusion
Throughout the creation of my first app, I learned so many new things. I learned about the importance of creating for a target audience, doing research on competition and usability, creating layouts, choosing colors, font choice, and so much more. I also learned about the ins and outs of Figma. I am excited to continue to learn more about UX Design, and to improve on my skills.