🛠️ About
- Role: Design Lead
- Toolkit: Figma
- Platform: Big Commerce
🚩 The Problem
Creating a website that is not just about offering services but also embodies a cultural lifestyle around circularity and music. Their business model is based on a rental archive, advocating for purchasing repairable items rather than promoting a buy-and-throw mindset, even though they have a dedicated section for purchasable items.
🎯 The Objective
To create a profitable e-commerce based on best practices that could meet the brand standards. The biggest challenge in this project was to play with the concept of duality, bringing the roots of self-expression, design, and neon nostalgia without sacrificing accessibility and the transactional part of the business.
📰 Press
UX PHASE
This phase started by covering the understanding of personas, their needs/problems, research on benchmarking, sitemap conception, and eventually, the translation of this information into user flows.
In this phase, the client agreed to use a mobile-only approach, which is unfamiliar but evident in the desktop approach on social media like TikTok. This decision was made because they wanted to emphasize the social essence of the brand.
High-level Sitemap
GTaT is a playful space where users can find events and the brand's artistic side. This will become a huge part of the site, almost at the same level as the homepage.
👥 Personas & Target Audience
- Creative and culturally connected individuals
- Progressively minded and forward-thinking
- Not afraid to push boundaries
- United by psychographics, not demographics
- Value community, sustainability, music culture and inclusivity
🖥️ Desktop
On the UX, the exploration of the artistic and the functional was delimited when the homepage, the rabbit hole (GTaT space), and the rabbit hole became expressive. Still, the PLP and PDP kept the functional part of it not to sacrifice the transactional components.
The homepage & the Rabbit hole are two spaces accessible from a toggle that easily could swap between two different spaces—generating two other websites that require two different Nav menus.
As previously mentioned, the Desktop design emulated a mobile view but utilized the space on the sides of the screen for the navigation.
Only the desktop's homepage and 'the rabbit hole' were explored. As this was an experimental site, the purpose was to evaluate feasibility by identifying possible constraints, not only from the UX point of view but also from the development perspective.
📱 Mobile
In the following screens, the concept of duality is more pronounced where users can always switch from one place to another—from the homepage to the 'Rabbit hole' and in the PLP, allowing users to explore the Archive or the Shop items just an interaction away.
The design streamlines the interaction on the e-commerce pages, such as PDP and PLP, using familiarity to alleviate the possible pain points caused by the capacity to change from a Shop to a Rental space.
👇🏻In the following screens, the concept of duality is more pronounced where users can always switch from one place to another—from the homepage to the 'Rabbit hole' and in the PLP, allowing users to explore the Archive or the Shop items just an interaction away.
UI PHASE 🍄
Considering the heavy historical heritage of the brand, the look & feel had to express an elevated circular fashion store that provides a home for creative expression. To create a mood board, we had to understand the brand a little by using some statements What is vs. What is not.
- Granny is Luxury BUT NOT Out of reach
- Granny is Heritage BUT NOT Referential
- Granny is Circular BUT NOT Plastic free, organic, vegan
- Rebel BUT NOT Hippy
– Alice in Wonderland is an inspiration, and Granny is a cultural rabbit hole.
MOODBOARD & INSPO
Granny revels in the unexpected, celebrating “wrongness”, a purposeful idiosyncrasy that evokes pre-digital design.
