Work : App UI/UX and Visual Design  | Design exercise | Tools: Figma, Illustrator

Project background
Design exercise:
Improvement of an existing payment app dedicated to the Japanese market, using the concept of「後払い」

1.  Identified pain point
The fear of spending more than what we can afford when using credit payment.

2.  Selected opportunity
The app can help the user to control better his/her expenses and the monthly payment to come.
UI/UX design process
1. User journey
contact me to know more about the user journey analysis

2. User flow
contact me to know more about the user flow analysis

3. Mockups and flow
the mockups of the flow 1 show the refresh of the home screen, using a dashboard concept and the new feature, the "Expenses Manager". 

Home screen
From the home screen, the user can visualize with one screen the most important information: the total of expenses up-to-date, the evolution of the expenses from one month to another, the expenses vs. budget, and the list of latest purchases. Clicking on each component will bring the user to a child view with more information. The white button displays “payment available” with a white halo when it’s time to make the monthly payment. Clicking on the card “Manage my expenses” brings the user to the new feature/app section: the Expenses Manager. The expenses Manager can also be reached from the tab bar.​​​​​​​
New feature: expenses manager
A text is displayed at the top of the screen, explaining in a friendly way how the app can help the user to have better control over his/her expenses. When clicking on the card at the bottom of the screen, the card expands to the top, just under the illustration, to reveal the ”expenses manager” features:
-Set a limit and enable it or disable it when needed
-Opt for push-notifications
Below, we show a “monthly check-up”, a visualization in real-time of the expenses done with the app method payment vs. the limit set by the user. Below the chart, another detailed visualization is offered, closer to what the visualization of “spent money vs. remaining budget” would look like in real life.

To know more about the other screens: contact me

Another suggested opportunity during the journey analysis was the implementation of a “Reward Program”, as an additional motivational trigger for some users. From the tab bar, the user can access the Reward program. From the top screen, he/she can see the balance of points and some featured shopping experiences that will him/her give points.
When clicking on the buttons in the top-right corner, the user accesses a sub-menu.
Back to Top