Day 32 of building Flow โ my UI/UX design project ๐
After a long break because I was sick, Iโm finally restarting the Flow project from Day 32.
Today I worked on the review page and explored two different designs. The first version was shared previously, so I wanted to iterate on it and improve the overall hierarchy.
In the second version, I separated the message section because I felt that in the first version, too many elements were competing for attention. I also added a โDue nowโ badge to make it clearer what the first deposit refers to and what the client needs to pay at this stage.
I increased the spacing in the payment section as well. Since the information uses relatively small text, tighter spacing can make it harder to read and scan.
I also decided to keep the CTA at the bottom. The client needs to go through the important agreement, payment, and contract details before taking action. This encourages them to review the necessary information first instead of jumping straight to the CTA.
Which version do you think works better โ Version 1 or Version 2? Or would you approach the page differently? Feel free to share your own Option C in the comments. ๐
Follow the project: https://www.figma.com/design/a9BOd8eltqp038l6LkToHb/Flow---Fintech-App?node-id=394-2459&t=8VLXpCbYSlSdCzDF-1
Day 32 of building Flow โ my UI/UX design project ๐
After a long break because I was sick, Iโm finally restarting the Flow project from Day 32.
Today I worked on the review page and explored two different designs. The first version was shared previously, so I wanted to iterate on it and improve the overall hierarchy.
In the second version, I separated the message section because I felt that in the first version, too many elements were competing for attention. I also added a โDue nowโ badge to make it clearer what the first deposit refers to and what the client needs to pay at this stage.
I increased the spacing in the payment section as well. Since the information uses relatively small text, tighter spacing can make it harder to read and scan.
I also decided to keep the CTA at the bottom. The client needs to go through the important agreement, payment, and contract details before taking action. This encourages them to review the necessary information first instead of jumping straight to the CTA.
Which version do you think works better โ Version 1 or Version 2? Or would you approach the page differently? Feel free to share your own Option C in the comments. ๐
Follow the project: https://www.figma.com/design/a9BOd8eltqp038l6LkToHb/Flow---Fintech-App?node-id=394-2459&t=8VLXpCbYSlSdCzDF-1