Invoice & GST Registration
PROJECT: Invoice & GST Registration
The goal:
Design a basic mobile app that allows small merchants to create and manage invoices for their business.
ROLE: UX/UI Designer
DURATION: 40 Hrs
Challenges:
1) Merchant onboarding and registration to be GST compliant.
2) See your Invoice and status.
3) Create a New invoice.
Process
Part 1
This section takes a deep dive into understanding the user by forming a user persona and articulating their journey and thus the application required
Understanding the user:
1) Energetic and alert.
2) Familiar with digital technology.
3) Tech-savvy.
4) Partially fluent in English.
User stories:
User stories helped to understand content, motivation and desired outcome:
1) I want to easily and quickly create a new invoice
So that I can have peace of mind and empathize with my customer.
2) When searching for the cars
I want to translate the application language into my preferred ones
So that I can easily use the application without language being a barrier for me.
Process
Part 2
This section states some of the assumptions requirements, constraints and eventual trade-off that I made
Goals & Tasks:
Reliable:
1) Display accurate data and information.
2) Be transparent about the information.
Usable:
1) Understanding of user scenarios and goals.
2) Timely and non-distracting. Eg. helps the user get from A to B efficiently and easily
User stories:
The followig assumptions were made for this project:
1) User has access to wifi or cellular data so we can assume that they have no problems accessing the website.
2) User requires personal details to login or create an account.
3) User is using this website for the first time.
Constraints:
Reliable:
1) Display accurate data and information.
2) Be transparent about the information.
Usable:
1) Understanding of user scenarios and goals.
User stories:
The followig tradeoffs were made in order to focus on user achieving their goals:
-
Push notification
Allowing user to enable to push notifications would be a great idea for them to get a reminder. However, due to time constraints this option explored, as was not required for the user to achieve their goals.
2) Timely and non-distracting. Eg. helps the user get from A to B efficiently and easily
App Flow(1)
The following flow was designed to help articulate how a user would move throughout the website and reach their goals:
-
You’ll notice upon overviewing the flow that there were some unnecessary steps that have been crossed out to keep in line with the requirements etc.
App Flow(2)
The refined flow omits the unnecessary and additional steps and instead focuses on the core flow and simplified A to B experience:
-
Now the user is presented with a screen that lets the user to log in or create an account.
-
After pressing create invoice button user is then taken straight to the create invoice page.
Process
Part 3
This section explores wireframing and prototyping of the users experience
Paper Wireframe
High Fidelity Design
You can view the design file by clicking Here
Interactive Prototype
To get a sense for the flow and test the experience an interactive prototype was created of the high fidelity design.
https://www.figma.com/file/e9i2zXKAq6tZEtjiWcaZJ1/Ungrammary-Assignment?node-id=4%3A47
The purpose of the prototype was to:
-
Test whether the wireframe and designed flow are helping user to achieve their goal.
-
Assess whether the interactions are clear.
-
Test and fine basic animations and transitions.