Checkout Page for E-Commerce Platform
Design Rationale
For this design task, I chose to create a checkout flow for a small candle business called KayBee Kandles. The design process aims to provide a seamless and engaging checkout experience that optimizes simplicity and an error-free transaction process.
Designing for usability
- A guest checkout option was implemented for a friction-free process, along with the option to use express checkout or sign in.
- Clear and concise form fields were included and placeholders continue to be visible after inputting information.
- The option for users to use the same address for their billing and shipping without having to repeat information is automatically checked.
- Multiple payment options are available during the checkout process
- Order summary is visible throughout the entire checkout process to ensure trustworthiness.
- A confirmation screen with follow up order instructions is also available at the end of the checkout flow
Visual Hierarchy and Scannability Considerations
- Large fonts for the order summary section and the use of bold and grouping prices together signify related items.
- Error messages are shown when a section is incomplete.
- Pay now button is distinct and visible at the end of the checkout process to ensure confidence and signify the completion of the checkout flow.
- A progress bar is visible after each section is completed.
The overall design rationale centers around creating a simple and seamless checkout flow. By balancing simplicity, transparency and security, the checkout process aims to reduce friction, build trust, and enhance the overall shopping experience.
Reviews
Lorem ipsum dolor sit amet consectetur. Pretium pulvinar odio aliquet condimentum suspendisse nibh vel arcu. Bibendum in imperdiet sapien quisque odio gravida. Malesuada aliquet elit egestas placerat amet. Ornare in scelerisque ut gravida amet. Tristique amet amet bibendum enim cursus. In vehicula mauris tincidunt arcu aliquam nunc. Tincidunt vitae netus ante eu et bibendum. Eget amet nibh vel est congue tellus tortor gravida nascetur. Ut vestibulum elit pulvinar netus in ante lectus turpis auctor. Nulla purus morbi adipiscing quisque in sodales aliquet. Ultricies a elit quis metus. Aliquet cras pretium platea lacinia mi et orci volutpat vulputate. Bibendum massa fusce...
You might also like

Project
Empathy Mapping Project
Target Audience for FinnoSyncFinnoSync's mobile app users include: Tech-savvy millennials seeking seamless digital banking experiences.

Project
Responsive Landing Page for Animal Care Service
OverviewFor this design brief, I designed a responsive landing page for PawBuds, a professional pet care service offering grooming, vet care

Project
Pawsome: Premium Pet Grooming & Care Website Design
This project presents a clean, user-friendly website design for Pawsome, a premium pet grooming and care service. The design features a mode

Project
Wireframe for Netflix, Video Streaming Service
This was interesting to design! I think the layout works well, honestly, it feels more optimized for TV than desktop. Let me know what you t

Project
Restaurant & Cafe Web Design
Bitezai is a polished Webflow template for restaurants, cafés, and bistros. Designed to create an inviting online presence with its user-fri

Project
Workshop Planning for Design Team
This workshop focuses on discussing ideas and prioritizing features for a mobile banking app called HDFC. The workshop's goal is to prio
Interaction Design Courses
Course
Introduction to Figma
Master Figma's core functions from the ground up. Learn essential tools and workflows to streamline collaboration and enhance product development.
Course
UX Writing
Learn how to write effective UI copy and develop the skills to communicate with your audience.
Course
Common Design Patterns
Explore the most reusable and widely used design patterns in product design and learn how to implement these patterns successfully and create designs that are both user-friendly and visually appealing.