Designing for an eCommerce Brand
Jonathan Haines
Custom Ink: Enhancing the eCommerce User Experience
Overview
Custom Ink, a brand with over two decades of experience, empowers individuals and organizations to design and order custom t-shirts and gear for various purposes, including clubs, companies, charities, family reunions, and fundraising. The company emphasizes its fundraising tool, enabling users to raise money and awareness.
As a freelance designer, I collaborated closely with Custom Ink's technology team to establish and articulate a shared design language using Figma and other tools. My work focused on the eCommerce workflow and the fundraising tool, aiming for a more cohesive experience aligned with the overall brand.
Tools Used: Figma Duration: November 2022 to January 2023
Identifying My Role
Custom Ink had already developed a shared design language, but it became clear that many of their existing flows could benefit from an audit to ensure a seamless user experience. As a new designer to the brand, my fresh perspective allowed me to identify areas for improvement and ensure consistency across the most critical functionalities of Custom Ink's website.
The project followed a structured design process, moving from problem identification through research and analysis (Discover), defining the core issues (Define), developing solutions through prototyping and testing (Develop), and finally refining the design (Deliver).
The Scope
This three-month project involved an audit to understand key features of Custom Ink's brand and integrate them into a more cohesive shared design language for both web and mobile platforms. The key areas of focus included:
eCommerce Process: Research and design to create a straightforward and user-friendly workflow for purchasing clothing.
The Design Lab: Research and design to provide users with a powerful yet intuitive tool for creating amazing designs without feeling overwhelmed.
Presenting Analytics: Research and design to make data easily understandable and actionable to increase sales for the user.
Researching the Flows
A crucial part of the project involved thoroughly researching the existing user flows within Custom Ink's platform.
The eCommerce Process
The eCommerce process was a primary focus. While generally straightforward for normal purchases, I identified a need to account for single orders, team orders, and the ability to purchase as an individual or split orders for fundraisers.
(Image: "The current transaction process" showing a multi-step checkout flow)
The Design Lab
Custom Ink's Design Lab, a tool for creating t-shirt designs, had been implemented five years prior. Given the time elapsed since its first version, it was essential to review and update it to align with the most up-to-date brand design language. The tool offers options for artwork, fonts, logos, and symbols.
(Image: "The current DesignLab process" showing the Design Lab interface with design options)
The Presentation of Analytics
Understanding how Custom Ink's most successful stores and campaigns performed was vital. This involved examining how analytics were presented and identifying opportunities to improve them in line with Custom Ink's brand style and language guidelines.
(Image: "The Current Analytics" showing a dashboard with sales and campaign data)
Understanding the New Shared Language
Custom Ink had recently undertaken a review of their brand, resulting in new rules that needed to be integrated. These rules were collaboratively discussed and agreed upon by myself and the in-house design team.
Showing Progress (Blue as Forward Motion): Blue was designated as the main color for progress indicators, such as primary buttons and progress bars.
Using the Brand Color (Inky Red): The brand's red color was to be used sparingly, primarily to demonstrate the brand itself.
Feedback for the Users (Data Above All): The emphasis was on making it easy for users to track all relevant information.
Defining a New Process
One of the key challenges was identifying pain points and opportunities to add value to the Custom Ink experience. I utilized the Value Proposition Canvas to ensure a deep understanding of customer needs, pains, and pain relievers.
(Image: Value Proposition Canvas showing "Value Proposition" and "Client Profile")
Client Pain Points with the Current Processes:
eCommerce: Too many options, leading to a prolonged process.
Design Lab: Style did not match the up-to-date brand's shared design language.
Analytics: Most important data not presented upfront.
Potential Pain Relievers I Can Focus On:
eCommerce: Simplify the process.
Design Lab: Revisit with up-to-date shared design language.
Analytics: Analyze data to identify and prioritize the most important information for upfront presentation.
Designing a Better Process
The eCommerce Process - Simple steps marked by progress
The eCommerce experience was streamlined into clear, manageable steps, with progress indicators guiding the user. This involved simplifying the overall flow, making it more compact and easier to navigate, especially on mobile devices.
(Image: Various screens of the redesigned eCommerce process, showing simplified steps and progress indicators)
The Design Lab Process - Use current language consistently
The Design Lab was updated to reflect the new shared design language, ensuring consistency across the platform. This involved refining the interface and interactions to make the tool more intuitive and aligned with the brand's visual identity.
(Image: Redesigned Design Lab interface, showcasing updated visual elements and consistent language)
Analytics - Show what is necessary
The analytics dashboard was redesigned to highlight the most crucial information upfront. This involved a careful selection of key metrics and a clear, concise presentation to ensure users could quickly grasp the performance of their campaigns.
(Image: Redesigned Analytics dashboard, emphasizing key metrics and a cleaner layout)
Takeaway & Learnings
Working with the Custom Ink team was a rewarding and challenging experience. It provided valuable insight into the operations of a well-established eCommerce brand. My fresh perspective proved beneficial to them.
Creating a shared design language is a passion of mine. It was evident that different tools had been developed at various times by different teams, making consistency a top priority. This required collaboration with many talented individuals to identify and implement the necessary components.
As an outsider, it was insightful to observe how Custom Ink approaches its challenges, particularly in relation to its customer base of small business owners striving for success.
____________________________________________________________________________________
For a full case study of how this particular project went down, please click on the link to Behance below.
Like this project
Posted May 7, 2025
Interaction Design, Product Design
Likes
0
Views
3
Timeline
Nov 1, 2022 - Jan 15, 2023
Clients
Custom Ink
