Future Archives
Responsive Web Design for Emerging Luxury Clothing Brand
Web Design, E-Commerce Design
Overview
Over the summer of 2023, a former colleague put me in contact with budding fashion designer Luke Turk. Luke was beginning to expand his small business, but needed to create an e-commerce platform to sell his clothing. He wanted a site structure created through Squarespace that would allow him to edit and add more products in the future as his line continued to grow.
Future Archives is a luxury clothing brand that uses an e-commerce platform to sell their products to masc-presenting users between the ages of 25-45 years old. Through their commitment to only using upcycled and ethically sourced fabrics to construct their garments, Future Archives strives to “create the style of the future by reinventing the past.”
My Role
Researcher, Web Designer
Tools
Figma, Squarespace, Optimal Workshop
Timeline
100 Hours, 3.5 Weeks
Research
Consumers want to purchase clothing that is sustainable and ethically sourced. The client’s brand fits an in-demand market; but he struggled with creating a website that fit his required aesthetic, as well as his need to add products in the future.
Problem
1. Understand shopping habits and needs of users who shop for luxury items.
2. Identify “must-have” and “nice-to-have” features for the site that are derived from user interviews.
3. Understand the competitive market.
Research Objectives
Secondary Research, Competitive Analysis, User Interviews
Research Methodology
Competitive Analysis
My competitive analysis of sustainable luxury clothing brands reinforced my hypothesis that consumers appreciate detailed product descriptions. However, I was surprised by the lack of fit information and confusing site navigation. If there is a demand for luxury clothing that is ethically sourced, why have companies made it difficult for users to source clothing that they know would fit properly?
User Interviews
There was a definitive pattern of interviewees wanting to create a more sustainable closet by conveniently shopping from ethicially-sourced brands online. The majority of pain points arose from a lack of communication between the company and the consumer; be it sizing, material, fit, and/or longevity of use.
Define
Once the interviews were completed, I wanted to hone my final user personas to reflect the need for both convenient online shopping and conscious consumerism.
User Flow
User Personas
Site Mapping
I felt that it was important to streamline the user navigation, offering a clear path to both specifically search for items and to browse the site for unexpected offerings. I also ensured that each product would have a thorough detail page, allowing the user to see exactly where the materials were sourced.
Ideate
Wireframes
I began my low-fidelity sketches with a clear difference in formatting between my mobile and desktop wireframes.
Branding, Logo, & UI Design
Future Archives can be described as Environmentally Conscious, Timeless, Relaxed, and Impactful.
I thoroughly enjoyed collaborating with the client; he was very communicative about his overall vision, and was gracious enough to provide me with clear examples for inspiration. I chose warm earth tones for the website in order for the customer to feel that the brand and its products emphasized sustainability.
While the secondary logo was created by another artist, the client wanted a new text logo to accompany it. He wanted a something that was futuristic, but still approachable. It would primarily be used for the website, branding, and clothing tags.
This preliminary design felt too removed from the text itself, and I wanted to create something that would be easier to read.
The finalized logo was sketched using procreate, then fully realized in Adobe Illustrator.
I then created an initial logo that can be used for mobile screens, packaging design, and stationery.
Prototype & User Testing
After the prototype was complete, I began moderated usability testing with 5 subjects who met the required criteria. The tests were conducted either virtually or in-person, depending on the subject’s geographical location.
User goal achievement
Task completion time
Error rate
Satisfaction rating
Metrics
User Tasks
1. Learn about the company by accessing the “About Us” page
2. Search for a specific item of clothing
3. View product details page
4. Add the product to cart
5. View cart
100% users rated the majority of tasks with a difficulty of 1/5
100% of users commented on the website being easy to navigate
100% of users completed each task in less than 2 minutes
Areas of Success
Final Protoype
While I did not have any priority iterations to complete for the final prototype of the website, I know that I will have to assist my client with one critical component in the future: adding updated images and copy.
The main trade-off that I had to make throughout this process was creating temporary copy and photographs for the website, rather than relying on images from the brand itself.
At first wanted I to wait until the client had completed their photo shoots for their products. Unfortunately due to scheduling inconsistencies, I knew that I had to use “placeholder” images in order to finish this project within the time allotted.
That being said, I thoroughly enjoyed working with the client. He was very clear in his artistic vision for the brand, and was a very open communicator. He gave me clear examples of his likes and dislikes when comparing his brand to competitors, and I felt that he trusted me as a designer. I know that a working relationship like this will not occur with every client, but it’s still nice to know that collaborating with clients and stakeholders in a stress-free way is possible.