Designing a Responsive Website for Handloom Hues
UX | UI Designer, Timeline: 4 Weeks
Handloom Hues, a boutique showroom in Guwahati, India, specializes in handwoven Mekhla Sador and other traditional Assamese textiles. Despite its rich craftsmanship, the brand lacked an optimized digital platform, relying mainly on social media for inquiries. This resulted in fragmented communication, making it difficult for users to explore collections, understand customization options, and place orders conveniently.
The Background:
Without an official website, Handloom Hues relied on contact-only ordering, making product exploration and inquiries less efficient. While this approach maintained personal engagement, it needed a structured, seamless process to enhance usability. Research validated that customers valued direct interaction, but the challenge was to improve trust, product visibility, and customization clarity through a well-designed digital experience.
This project aimed to create a visually appealing and user-friendly website that reflects Handloom Hues’ cultural identity while improving accessibility. The design streamlined the contact-only ordering system, making inquiries smoother and more efficient. Storytelling elements such as artisan profiles and the weaving process were integrated to build trust and engagement. A structured product gallery with clear categories enhanced product discovery, while customization previews helped users make informed decisions before inquiring.
Goal:
Problem Statement:
Projected Impact:
By improving layout, storytelling, and the inquiry process, the redesigned website is expected to enhance user engagement by providing a structured homepage and visually rich galleries that encourage exploration. Clear categorization and filtering will make product discovery faster and more intuitive, allowing customers to browse with ease. The streamlined contact-based inquiry system will reduce friction in submitting purchase requests, ensuring a smooth and efficient experience. Additionally, integrating artisan stories and craftsmanship details will help strengthen brand trust, making customers feel more confident in their inquiries and purchase decisions.
Research:
Goals
Understanding user needs was key to designing a website that effectively showcases Handloom Hues’ craftsmanship while simplifying the buying process. I focused on identifying challenges faced by potential customers, particularly in discovering products, trusting quality, and navigating the contact-only ordering system. By gathering insights on user preferences, shopping behaviors, and cultural connections, I aimed to create a seamless, visually engaging, and trustworthy digital experience.
Methodologies
To create a user-centered design, I conducted user interviews with five boutique shoppers to understand their expectations, challenges, and preferences when browsing and inquiring about handloom products online. A competitive analysis of brands like Silkalay, Muga Silk, Sereki, and The Silk Chamber provided insights into product presentation, customization options, and order processes.
Additionally, I conducted usability testing at different fidelity levels to evaluate navigation, product discovery, and the contact-based ordering system, refining the experience for both first-time and returning customers.
This structured approach ensured that the final design was informed by real user insights while aligning with industry standards.
To ensure that the Handloom Hues website aligns with real customer expectations, I conducted interviews with existing boutique customers, many of whom have previously purchased dresses from Handloom Hues. Although the owner initially envisioned this website for new customers, it made more sense to interview existing customers who were already familiar with the boutique’s shopping experience, pain points, and expectations. This approach provided richer feedback on what needed improvement and what elements would make the website more engaging and functional.
Key Themes Explored in the Interviews:
Homepage Expectations – What information helps users feel engaged and encourages them to explore further?
Trust & Brand Credibility – What elements make customers confident about inquiring through a contact-only system?
Customization & Order Process – How should customization options be presented for clarity and ease of use?
Contact Form Experience – What makes an inquiry form efficient, intuitive, and mobile-friendly?
User Interviews:
"Clear timelines for responses are important. And also the price, at least an estimated price if I want something customized. If I like something, and there is no price tag attached to it, then I want an easy way to inquire about the price. Just like how it’s done on social media, you ask for the price when you see a product on Instagram or Facebook, and the price is inboxed to you."
"Stories about the artisans and videos of the weaving process would be perfect. I would like to know where the artisan is from—are they local artisans? What struggles have they faced, and what inspires their work?"
Since Handloom Hues was building its first-ever website, it was essential to analyze how similar handloom businesses with established online presences structured their digital experiences. The analysis focused on Silkalay, Muga Silk, Sereki, and The Silk Chamber, all of which specialize in Assamese textiles and handcrafted Mekhla Sador collections.
Key areas of evaluation included:
Brand Storytelling: How well do these brands communicate their heritage, craftsmanship, and cultural significance?
Product Presentation: What strategies do they use to showcase products, such as high-quality imagery, customization previews, and detailed descriptions?
Order Process: How do they structure their buying experience—whether through direct e-commerce, inquiry forms, or personalized consultations?
Trust-Building Elements: How do they establish credibility, such as through customer testimonials, artisan stories, and certifications?
Competitive Analysis:
Key Research Insights & Data Points
80% of interview participants emphasized the importance of seeing artisan profiles and cultural storytelling to establish authenticity and trust before making a purchase inquiry.
4 out of 5 participants struggled with understanding customization options on existing boutique websites. They preferred visual previews rather than reading descriptions alone.
100% of participants found the contact-only ordering system acceptable but 50% wanted clearer response timelines to feel confident about making inquiries.
60% of users were hesitant to inquire via a contact form without seeing at least an estimated price range for products.
3 out of 5 competitors lacked a structured customization section, reinforcing the need for an interactive customization gallery in the Handloom Hues design.
70% of boutique customers preferred a mobile-friendly experience, yet some competitors had poor mobile optimization, giving Handloom Hues an opportunity to stand out with a seamless mobile-first design.
90% of participants found competitor websites visually appealing but noted that they lacked an engaging, personal touch, such as featuring real artisans and their weaving process.
5 out of 5 participants wanted a quick and simple contact form with options to specify customization needs instead of typing everything manually.
Define:
Affinity Mapping helped categorize insights from user interviews, competitive analysis, and usability research into clear themes. This process shaped the website’s navigation, customization options, and ordering experience to align with user needs.
The focus was on building trust through artisan storytelling, improving product discovery, and streamlining the contact-based order process. These insights provided a strong foundation for defining User Personas and User Flows, ensuring a structured and user-friendly experience.
Structuring the Foundation of Handloom Hues
Key Findings from Affinity Mapping:
Building Trust Through Storytelling – Users valued artisan profiles and behind-the-scenes weaving visuals, leading to the inclusion of a "Meet the Weavers" section.
Simplifying Customization – Many struggled with understanding customization options. This led to the creation of an interactive customization preview for fabric, colors, and patterns.
Optimizing Contact-Based Ordering – While users liked direct communication, they found the process slow. A short, structured contact form with pre-filled options was introduced to improve efficiency.
Improving Navigation & Product Discovery – Competitor websites had cluttered layouts. Handloom Hues’ website ensures clean categories, filters, and an intuitive browsing experience.
Increasing Inquiry Confidence – Some users hesitated due to unclear pricing. While fully custom pricing remains, a price range indicator was added for select products to boost confidence
Although the Handloom Hues website was designed for new customers, interviewing existing customers proved to be a more effective approach in gathering meaningful insights. Since these participants were already familiar with the boutique’s products, ordering process, and customer experience, they provided detailed feedback on what worked well and what needed improvement. Their experiences highlighted pain points in the current inquiry system, expectations for customization options, and trust-building elements that influence purchasing decisions. Additionally, as loyal customers, they could offer suggestions on what would make the website more appealing for first-time buyers, helping to create an experience that is both welcoming for new users and efficient for returning customers.
User Persona
Mapping the user journey was essential to ensuring that customers could explore collections, understand customization options, and complete order inquiries effortlessly. By analyzing user behavior, I structured the flows to reduce friction, guiding users toward a smooth and engaging experience.
The dual-path approach caters to:
User Flows
Ananya’s Story: Exploring & Ordering a Ready-Made Mekhla Sador
Ananya, looking for a traditional Mekhla Sador, lands on the website and navigates to the Collections page. She browses through various designs and clicks on a product that interests her. The detailed product description and artisan story build trust, helping her make a confident decision. She uses the contact form to inquire about the item, expecting a personalized response from the brand.
Riya’s Story: Customizing Her Order
Riya is interested in a custom-designed Mekhla Sador. She visits the Customization section, where she can explore fabric, color, and motif options through an interactive guide. She selects her preferences and submits a custom order inquiry using the contact form. The streamlined form ensures she provides essential details, making the process simple and efficient.
With a clear sitemap and user flows, I started designing low fidelity wireframes to define the website’s structure. Unlike a traditional e-commerce site, Handloom Hues operates without a payment gateway, relying on a contact-only ordering system. This posed a unique design challenge—ensuring users could easily browse, inquire, and feel confident without the instant gratification of an online checkout.
Laying out the wireframes helped refine how users navigate from product discovery to inquiry submission, making the journey feel seamless and engaging.
Low Fidelity Wireframes
Key Iterations from Usability Testing:
Structuring the Homepage – Highlighting brand storytelling, product collections, and trust-building elements to encourage exploration.
Optimizing the Inquiry Process – Designing a short, efficient contact form that guides users through order customization while maintaining simplicity.
Ensuring Mobile Accessibility – Creating a responsive layout that supports smooth interactions across devices.
Iterating from low to mid-fidelity wireframes helped identify usability challenges early, ensuring that each screen aligned with both user expectations and business constraints.
Desktop Version
Mobile Version
With the structure refined through low and mid-fidelity wireframes, I moved to high-fidelity designs, focusing on visual storytelling, usability, and brand consistency. Since Handloom Hues already had an established brand identity, the design maintained a seamless alignment with the boutique’s artisanal aesthetics while ensuring an intuitive digital experience.
Key Enhancements in the Final Design:
Refined Navigation & Layout – Optimized product categorization for smoother browsing.
Improved Inquiry Process – A simplified, structured contact form with pre-filled fields for efficiency.
Enhanced Visual Hierarchy – Larger product images and clearer typography for better readability.
Trust Elements & Storytelling – Artisan profiles, testimonials, and behind-the-scenes visuals to reinforce credibility.
High Fidelity Wireframes
To ensure a consistent brand experience, I carefully matched the color scheme and typography with the existing Handloom Hues logo provided by the owner. The design strikes a balance between heritage-rich aesthetics and a modern, user-friendly layout, making product exploration and inquiries effortless.
To validate the design, I conducted usability testing with five participants, focusing on how easily they could navigate the website, discover products, and submit order inquiries. The goal was to ensure that the contact-based ordering system felt smooth and intuitive while reinforcing brand trust.
Usability Testing Plan
Support button resized
Following usability testing, I implemented key refinements to enhance usability, clarity, and engagement based on participant feedback. These adjustments ensured the website provided a smooth and intuitive experience, particularly for users exploring ready-made collections and custom orders.
Final Iteration:
Key Refinements:
Improve Navigation & Order Management – Add a cart icon to streamline navigation, especially for users managing multiple inquiries.
Auto-Fill for Returning Customers – Introduce an auto-fill feature in the contact form to simplify the process for repeat buyers.
Refine Product Image Spacing – Adjust the spacing between images and descriptions for better clarity and readability.
Optimize Visual Elements – Resize and reposition the support/inquiry button to reduce distractions and improve user focus.
Add Wishlist Option – Allow users to save favorite products for later inquiries.
Consistency in Confirmation Messages – Ensure that desktop and mobile versions of the confirmation message provide the same level of detail.
These refinements strengthened the website’s usability, accessibility, and alignment with Handloom Hues’ brand identity, making it a functional yet culturally immersive platform.
Wishlist icon
Conclusion:
Overall Thoughts
Designing a responsive website for Handloom Hues was a unique experience, balancing user needs, business goals, and non-traditional e-commerce practices. The contact-based order system, initially seen as a challenge, was validated through user research as a boutique-friendly and personalized approach. The final design ensures seamless product discovery, intuitive navigation, and a trust-driven inquiry process, allowing customers to engage with Assamese handloom culture in an immersive way.
Future Enhancements
Although the website provides a streamlined experience, future iterations could introduce:
Wishlist Feature – Allowing users to save favorite products for future inquiries.
Customization Visualizer – A tool enabling real-time previews of selected fabrics, patterns, and motifs.
Live Chat Support – Instant messaging for quick responses to inquiries.
Final Reflection
This project reinforced the importance of aligning design with both business and user expectations. Working closely with the Handloom Hues owner provided insights into stakeholder collaboration, while usability testing validated core design decisions. The process strengthened my ability to solve real-world UX challenges, especially in crafting digital experiences that feel authentic, engaging, and user-friendly.
Analyzing competitor websites and understanding the buying journey of targeted customers helped in structuring a clear and intuitive sitemap for Handloom Hues. Since the website follows a contact-based ordering system, the focus was on ensuring easy navigation, seamless product exploration, and an efficient inquiry process.
The sitemap was designed to be simple yet engaging, ensuring that users can quickly discover collections, learn about artisans, and place inquiries without friction. By keeping the structure clean and category-driven, the website effectively balances visual storytelling with functional clarity.
Sitemap