Redesign website and rebranding for a small business
· UX design hackathon
· Duration: 10 days
· Stakeholders: 4 UX designers (Including me) and a business owner
· Tools: Figma, Office Suite, Zoom
PROJECT OVERVIEW
Tough Titties is a fashion apparel and stationery business in Vancouver. The founder is a mom who supports women’s empowerment and breast cancer awareness.
The client wanted to build a stronger brand identity while keeping inclusivity and diversity in mind.
Due to the limited timeframe of 10 days, we had to conduct the entire design process in a very short period. As a result, all designers had to hold continuous meetings and conversations throughout the given time to ensure everything was completed on time.
[Current website]
[Offline store displays]
PROBLEMS TO SOLVE
I wasn’t sure this brand supports women and individuals impacted by breast cancer
Is the brand name Emmahands? or Tough Titties?
Lack of brand consistency
The website is registered under the owner's name, unlike the physical stores that do not bear her name.
Lack of understanding of the target
The website lacked a clear vision despite the owner's aim to target girls and women, particularly parents, breastfeeding mothers, and individuals impacted by breast cancer.
Low online sales
The client struggles to manage their social media and online stores, leading to inconsistent product sales and branding across online and offline stores.
OUR PROJECT GOALS
Enhance the shopping experience by streamlining the process for users.
Remove and separate personal connection with Emma Hands and Tough Titties -> Have Tough Titties as its brand and website.
Present the brand missions and identity on the website, building a brand with purpose rather than simply selling for products.
RESEARCH
UNDERSTANDING OUR TARGET MARCKET
The goal is to identify the target audience's needs, preferences, pain points, and motivations for purchasing products related to women's empowerment and breast cancer awareness. This research will form the foundation for designing a user-centered experience.
How can we effectively build a stronger brand identity for the client while keeping inclusivity and diversity in mind?
How can we reach out to and address the needs of the group of people who are commonly mislooked for not having breast cancer?
We analyzed competitors in the fashion apparel and stationery industry, focusing on those targeting a similar audience and providing valuable insights.
COMPETITOR ANALYSIS
We found that having a clean website design, brand identity, and engaging users is crucial for boosting sales on an e-commerce site.
USER SURVEY
We surveyed with total 22 responses from potential users. Given the short time for the Hackathon, we could gain quantitive data quickly.
This Survey gave us great insights:
50%
Most individuals want to see reviews and online blogs on the website.
65%
Participants want to be informed more frequently about sales and discounts.
USER PERSONA
Based on our collected research, we created a persona to understand the user’s perspective and set solid solutions.
“I am a busy working mom. I don’t have much time to shop in person.”
USER JOURNEY MAP
This user journey map provided insight into user frustrations with the shopping experience. The user struggles with website navigation and the absence of a shopping cart icon.
The current website didn’t have the critical features. So the user struggled to interact with them.
Difficulty navigating the items: The navigation was poorly organized by items and missed the bestseller categories.
Unsure about return/refund policies: The website didn’t present the guidelines for return/refund so users couldn’t get enough information about purchasing.
[Current website audit]
USER FLOW
We understood how users interact with our website through user flow. Users can continue the purchasing process as a guest without creating an account. This will assist users who do not wish to create an account to buy products.
Major pivot: The user wants to buy a t-shirt via the website.
We discovered that users want to see reliable information and reviews about products. Also, social media engagement, contests, and giveaways effectively build customer engagement and loyalty.
DESIGN
BRANDING
To establish a strong and authentic brand identity, we developed a brand style guide encompassing logo design, color palettes, and typography to ensure consistency across all touchpoints.
IDEATION
LOW-FIDELITY CONCEPTS
After considering user expectations and feedback, we designed low-fidelity wireframes. Including search, cart, and profile icons in the header will improve website usability. Additionally, displaying social media links will enhance customer engagement.
GATHERING FEEDBACK
We conducted a usability test to gain feedback. The scenario was that the user wanted to buy a black t-shirt via the website.
Summary:
5 users tested by Figma prototype
There were small suggestions from users.
Success metrics:
100% of users completed the task.
Most participants took a primary path, “buy it now.”
On average, people spent 1 minute taking the task.
[Cart page]
[Main navigation]
FINAL DESIGNS
We separated the Tough Titties brand from personal connections by creating a dedicated website focused on the brand. The website features a user-friendly interface, intuitive navigation, and clear calls to action to facilitate seamless online shopping experiences.
Demos
AFTER THIS PROJECT…
Improved user experience: With a more user-friendly interface, clear calls to action, search functionality, and optimized website flow, to name a few, we believe these added features will improve the overall user experience on the website.
Improved engagement: With more inclusivity-focus catch copies implemented on the website clear social media section to connect, we believe these significant changes will improve the overall brand identity.
REFLECTION
KEY LEARNINGS
Understanding the User & Client: Understanding client needs is as important as understanding user needs. Conducting throughout research helped us understand the client's and user's pain points and led us to design a solution that meets both requirements.
Collaborating with Team Members: Collaboration and communication are key when working with a team in a Hackathon. We established clear communication channels and delegated tasks based on each team member's skills and strengths.