Instant Shopping, Instant Smiles
Timeline
Agustus 2024
Tools
Figma
Outcome
Redesign the Choose and Checkout Process
Role
UI/UX Designer
This redesign is intended to streamline the shopping and checkout experience in Alfagift
Alfagift is an app that offers the convenience of shopping with fast delivery, including same-day delivery options. However, despite its on-demand service characteristics, the user flow in this app still follows the traditional marketplace pattern. Users must go through several additional steps, such as accessing the shopping cart, adding forgotten items, and navigating between separate order summary and payment screens—all on different pages. This makes the checkout process feel more complicated and less efficient. Therefore, a redesign is needed, focusing on creating a faster, more intuitive flow that better aligns with the needs of users seeking instant delivery services.
Alfagift is an app I frequently use, especially in urgent situations when I need same-day delivery, which is highly convenient. However, the shopping process can be cumbersome and exhausting due to the multiple screens and unnecessary steps. For example, adding forgotten items can be a hassle, as sometimes I just want to buy what I've already selected. Additionally, the separate screens for order summary and payment make the process more time-consuming than it should be
problem
Unnecessary Additional Steps
Users must access the shopping cart to check the number of items or proceed to payment, which slows down the process and adds complexity.
Misalignment with Fast Delivery
The current user flow does not fully support the efficient experience expected from instant delivery services, which is a major feature of Alfagift.
Exhausting Checkout Process:
User Fatigue: Navigating through multiple screens, including separate ones for order summary and payment, makes the shopping experience tiring and less efficient.
Difficulty Adding Forgotten Items: Adding forgotten items involves extra steps, even though users often prefer to purchase only the items they initially selected.
Goal
Simplify Navigation
Reduce the number of steps required to check item quantities and proceed to payment, making the process more straightforward and user-friendly.
Enhance Efficiency
Align the user flow with the fast delivery promise of Alfagift by optimizing the process to support a more seamless, on-demand experience.
Streamline Checkout
Consolidate screens and reduce the complexity of the checkout process to minimize user fatigue and ensure that adding forgotten items or reviewing orders is quick and intuitive.
[User Flow Optimization]
In optimizing the user flow, my primary focus was on enhancing efficiency and reducing friction throughout the shopping process. The existing flow required users to navigate multiple screens and take additional steps, which often led to unnecessary complexity and user fatigue. To address these issues, I restructured the flow to create a more direct and seamless experience.
Key improvements include the introduction of a quick review CTA, allowing users to instantly check item quantities and total costs without needing to access the cart. I also consolidated the order summary and payment screens, eliminating redundant transitions and making the checkout process faster and more intuitive. By positioning frequently used features, such as payment methods and promotional offers, on a single screen, the optimized flow not only reduces the number of steps but also aligns more closely with the expectations of users seeking a quick and hassle-free shopping experience.
These changes are designed to make the app more responsive to the needs of users who rely on Alfagift for its fast delivery service, ensuring that the user flow is as streamlined and efficient as possible.
[Wireframe]
Requirement
To make the idea work, here’s what needs to be done:
CTA for Quick Review: A call-to-action (CTA) button should be placed on the item selection screen, allowing users to quickly review the total item count and price before proceeding.
Combined Screen for Add-ons and Payment Summary:
The "Tebus Murah" (discounted items) option and the ability to add forgotten items should be located on the same screen as the purchase summary and payment options.
The "Tebus Murah" section should be positioned near the "Make Payment" CTA to encourage users to consider adding discounted items before finalizing their purchase.
Motivational Placement of Tebus Murah: The "Tebus Murah" section should be placed lower on the screen to motivate users as they prepare to make their payment.
Default Payment Method with Balance Display: The default payment method should display the total balance linked to the Alfagift account, eliminating the need for users to check balances individually.
Voucher Placement: The voucher section should be positioned immediately after the payment summary to allow users to apply discounts before finalizing payment.
Organized Payment Methods:
Payment methods should be categorized into three sections: previously connected methods, the option to add a new method, and other available methods.
