Shopping Cart Redesign
Professional project for Giraffy Co. E-commerce
Overview
In my role at Giraffy Co., an eCommerce platform dedicated to gifting solutions, my responsibilities included enhancing the shopping cart's user experience and integrating a seamless gift wrapping service for checkout. This aimed to streamline the purchasing process for our users.
Role
UI/UX Designer
Tools
Figma & FigJam
Magento
Google Doc
Team members
Product Manager
Developer
General Manager
Methods
Competitor Analysis
Secondary Research
User Task Flow
User Tasks
Duration
4 Weeks
Goal & Limitation
Our goal
Giraffy Co. eCommerce is a platform for corporate gifting. To save our platform users up to 70% of the time they spend on gifting, we offer customized gift services and free CRM software. Gift packaging is extremely important to an e- commerce gift site. Thus I was assigned the following tasks:
1. Designing a gift wrapping system that is easy to use
2. Iterating the shopping cart interface to deliver critical information in a concise manner
Limitation
This project is subject to constraints, particularly the need to manage development costs for the Minimum Viable Product (MVP). Therefore, the shopping cart redesign must prioritize ease of implementation and development.
Market Research
used method: Competitor Analysis
Before I started to design the flow, I compared 8 similar corporate gifting platforms, in regards of their gift wrapping functionality.
User Empathy
Highlighted Users' goal
To help me better think of the user’s needs, I listed some user stories to ensure the design would be desirable.
User Task Flow
Following a swift market analysis and team discussions on potential client needs, I utilized FigJam to create an initial version of the user task flow. This was then further explored and refined during our team meetings.
Based on our discussions, I have finalized the task flow for ordering customized gift wrapping.
Design Solution
Following the established user task flow, I crafted wireframes and developed high-fidelity prototypes for the gift wrapping pop-up window, integrating it into the shopping cart's design. To simplify the order completion process, the window dimensions were set at 980 x 690 px. I addressed several specific challenges during this phase:
The two of the following problems were resolved:
Integrated a customizable gift wrapping service into our platform, enhancing the user experience by allowing personalization.
Updated the Shopping Cart Page UI to ensure seamless compatibility with the new gift wrapping feature, maintaining a coherent and user-friendly interface.
Here are the final designs:
Pop-up Window (Customized Gift Wrapping & Greeting Card)
shopping cart iteration
Developer Handoffs
I created the UI Library and labelled all the layout measurements while updating the elements to the design system to increase the efficiency for developers, and to minimize the misunderstanding.
Reflection
As a result of this project, I was able to cooperate and communicate closely with my colleagues, which led to a greater sense of tacit understanding between us. My e- commerce product design experience has also grown. In B2C products, shopping carts play a crucial role. It is important for users to be able to obtain information quickly and efficiently, which is the most valuable experience I gained through this project. In the future, I hope to use my professional experience to make more impactful designs.
