An eCommerce website for customized, handcrafted clothing by Kalla Studio
Type
Web Application
Role
Product Designer
UX Researcher
Tools
Figma
Photoshop
NextJS
Timeline
Summer 2023
Duration: 3 Months
The Problem
How might we create an e-commerce website that showcases the charm of handcrafted clothing over fast fashion while building brand loyalty between the fashion designer and her customers?
Research
Empathizing with users
To gain an understanding of the brand vision and needs of the fashion designer, I conducted an in-depth interview with my client. The goal was to identify which aspects of her workflow should be digitized and to uncover value propositions that could set her brand and website apart from other e-commerce platforms. I also aimed to understand what customers should see and feel while using the app, ensuring it aligns with her envisioned brand identity.
The interview revealed key features that would set her website apart from the competition. The designer's current workflow involves a combination of ready-to-wear pieces and custom sizing options, which can become challenging when managing multiple custom requests. Digitizing this process would alleviate her frustration with the lack of an efficient system for handling multiple custom orders. To address this issue, the designer emphasized the need for a size chart on the product page and a feature where customers can easily input their custom sizes, which would then be saved in a database.
Competitive audit of existing e-commerce platforms
After the interview, I conducted a competitive audit by researching other fashion and non-fashion e-commerce websites to identify the must-have pages for an e-commerce site. I also presented these websites to my client to gather her preferences and create a website that matches her taste.
Ideation
Brainstorming solutions
After discussing the pages to be developed for the e-commerce site with the client, I designed various wireframes for each page to explore which layout would best showcase the designer’s vision while ensuring usability. These wireframes demonstrated different compositions of the site’s structure, elements, and functionality. I then presented these options to the designer, allowing her to choose the layout that best aligned with her preferences.
Based on my client's selection during the wireframing phase, I refined the chosen layout into a high-fidelity prototype, incorporating her feedback to ensure the final design met her expectations and delivered a delightful user experience.
The Home and About page shows an introduction to the designer’s brand and story. These layouts feature a compelling hero section and a detailed narrative about the designer’s journey, emphasizing the story behind her handcrafted clothing.
Portfolio Showcase
The portfolio page allows customers to explore the designer’s collection. They can view and learn about each piece through specific pages featuring high-quality images and detailed descriptions.
Shopping Handcrafted Clothing
The shop features a curated selection of handcrafted clothing. Key elements include an intuitive size selection with information icons, custom order forms, and an easy-to-navigate product catalog, all designed to enhance the overall shopping experience.
FAQs and Size Charts
The FAQs and Size Charts page features a detailed size chart easily accessible from the navbar, along with answers to common questions to help customers make informed purchasing decisions.
Key Insight
Collaborating with another designer who is not in the UX field has broadened my design perspective. Some choices, such as using brown text that didn’t fully meet WCAG guidelines, were made to enhance the handcrafted feel. This experience taught me the importance of balancing creative preferences with usability standards.
My understanding of design constraints has also improved, as I needed to accommodate the client's wishes and, in turn, learned to value diverse viewpoints in design. This compromise led to a final website that aligns with the brand’s vision while providing a good user experience.
I also realized that working with a light serif font with limited weights presented challenges but offered valuable insights into balancing aesthetics and functionality.
