a story about thread
DESIGN LANDING PAGE THROUGH IN-DEPTH RESEARCH (2022)
#WebDesign
#Branding
#B2C
*This project is a conceptual exercise, created for exploration purposes and inspired by existing brand.
“This is one of my favorite projects because it maintains consistency across all elements—from the brand language to the architectural design and the landing page.”
PROJECT BACKGROUND
The goal of this project was to practice storytelling through landing page design. When it came time to choose a brand to tell the story of, Maki Textile Studio immediately came to mind.
A few years ago, I traveled to Rishikesh, the "Yoga and Meditation Capital" of India, to study an architectural complex designed by the renowned architectural firm Studio Mumbai.
The moment when I stepped into the building, I was deeply impressed by its authenticity. It's amazing how a simple language can be translated into different forms:
The floors are rammed with clay. The walls are piled with mud. The windows and ceiling are woven from bamboo. And the roof is piled with translucent marble.
“In this project, I hope to continue carrying this idea of authenticity through the landing page design.”
DESIGN PROCESS
Primary Research
After browsing her website, I summarized the value proposition and started to search on Google with the keyword, aiming to find relevant competitors and markets.
However, to my surprise, there is no comparable competitor! The searched brands are either wrong in style or wrong in service. With a clueless feeling, I decided to go back to Maki’s website to find more information.
Secondary Research
After spending days reading her website, the discovery of her blog finally opened the door for me. I started to understand her practice, her philosophy, and her personality. This time, with more precise keywords in Google search, I found the correct information and could conclude that Maki’s practice is truly unique. There is no similar competitor on the market.
DESIGN INSPIRATION
One little detail I found on her website is her precise description of each product — she always gives very detailed information, including the type of threads used in both directions, dye material, spinning method, etc. This discovery inspired my concept for the landing page.
“Since she makes all her textiles from scratch, why not show the whole production process to the audience?”
DESIGN CONCEPT
From a sheep, a silkworm, or a banana leaf, to the final piece of cloth, she spun these materials along with time and stories into her textiles. A thread functions as both the metaphor and artifact, connecting its own story to Maki's textiles. This is a story that nature and Maki tell together.
“Every thread can trace. Every thread has a story to tell.”
VISUAL SYSTEM
Based on brand attributes and the existing images on her website, I made two moodboards accordingly. Option A won with 60% of the vote.
To ensure that the color theme works well with the existing images, the color palettes for both moodboards are drawn from the existing images.
LANDING PAGE
SECTION 1: INTRO - WHO ARE WE?
A flower-shaped ball of thread slowly welcomes you on the hero page. A thread sticks out, cueing you to swipe down and taking you to the first node: the About Section of who we are.
SECTION 2: PRODUCTION PROCESS - HOW?
This section consists of four subsections: Materials, Colors, Weaving, and Garments. Each subsection tells a story about the making process.
SECTION 3: BRAND CULTURE
While continuing to scroll down, the thread meets many other threads, interweaves into warp (longitude) and weft (latitude), and becomes a piece of cloth. Finally, the thread continues its journey and folds into the text of the CTA: explore more.
Thanks for reading this far!
If you want to see the complete case study in details, please check my Medium.
ROLE
Research & Design
Individual Project
TIMELINE
Two Weeks
TOOLS
Pen & Paper
Figma
Premiere