<?xml version="1.0" encoding="utf-8"?>
Open full project

Design Rationale:

The checkout form is designed following the user first approach, that said simplicity and clear design are highly considered while developing the form to get the best experience for users. The following key principles guided the decision-making process:

User-Friendly Organization:

We group form fields into logical sections, with the intention to make it easy for users. It also helps the users to move smoothly through the updated contents regarding Payment, Billing Address, and Order Summary.

Visual Hierarchy and Scannability:

The visual hierarchy was thought about to make it easier to read. But as we recognized we could always improve the spacing, we focused on the space itself and started adding visual dividers (field sets). The purpose of this enhancement is to lower cognitive load by better separating the different sections and fields from each other.

Clear and Concise Microcopy:

Labels and placeholders were created meticulously to make microcopy elements for the users to gain a clear understanding of the required information. Error messages have been worked out successfully; with a promise of better(specificity) so as to help make the process more informative and easier (user friendly).

Strategic Call-to-Action Placement:

LEARNR - Checkout flow 1

An obvious and powerful call to action which a business is wagered on is by placing the "Place Order" button at the bottom end of the form. In light of the possibility for refinement of the visual design, we aim to improve the button on the facet while maintaining that it is distinguishable without interrupting the main forms.

Accessibility and Inclusive Design:

The design is dedicated to accessibility, and the form is navigable with a keyboard for those of us with motor disabilities. In the future we hope to implement ARIA labels and roles, which will make this experience more inclusive.

Streamlined Checkout Experience:

The overall design rationale is geared towards an easy of checkout for users. As a practice, we’re looking to minimize anything that is not necessary, and highlight what really matters. Further reducing friction and ongoing considerations include integrating user friendly features like saved information and guest checkout options.

Tools used

Figma

From brief

Topics

Share

Share your insights — leave a project review and help others grow their skills

Reviews

0 reviews


This project hasn’t been reviewed yet
Share your expertise with the Uxcel community by providing a review of this project. Not only will you help others, but you will also enhance your leadership skills.
0 Claps
Average 0.0 by 0 people
5 claps
4 claps
3 claps
2 claps
1 claps
<?xml version="1.0" encoding="utf-8"?>