Crafting User-Centric Elegance:
A Textile Product Sale Website

  • TOOLS: FIGMA, FIGJAM, ZOOM, VS CODE
  • SKILLS: INTERACTION DESIGNER, UI DESIGNER, UX RESEARCHER, UX DESIGNER

About Hodson Valley

Our project's core objective was to introduce an already thriving Indian textile brand to the discerning UK community. Focused primarily on providing high-quality textile solutions for kitchen, dining, and premium pillows, our mission was to seamlessly merge the charm of Indian craftsmanship with the UK's textile landscape.
This project epitomizes our dedication to user-centric design, unwavering commitment to quality, and the ambition to make a meaningful impact on UK households through our meticulously curated textile offerings.

Design Process

In my role as a designer, I initiated our project with a user-centric mindset.Our goal was to strike the perfect balance between aesthetics and functionality, aiming for an engaging and interactive interface. By starting with user insights and wireframes, we set the stage for effective research and iterative design, keeping user satisfaction as our primary focus throughout the project."

STEP 1

User-Centric Low-Fidelity Wireframes

"In line with our Information Architecture (IA) and thorough research, we crafted low-fidelity wireframes as a foundational step in the design process for our textile project. They help us visualize the user experience and ensure alignment with user-centric design principles.

STEP 2

A Collaborative Journey

Throughout our design process, we embarked on a journey of continuous improvement, crafting multiple iterations of our user interface.

STEP 3

Crafting Comprehensive Design Assets

In this phase, we meticulously prepared a wealth of resources, including thorough design specifications, comprehensive style guides, and the timely delivery of all critical graphic assets. This holistic approach to documentation and asset preparation serves as the bedrock for the successful realization of our vision.

Information Architecture

Our journey began with a deep dive into comprehending the content that would inhabit the Speak Textile product. This encompassed a diverse range of elements, from product listings and detailed descriptions to categories and essential contact information, among other pertinent sections. To ensure clarity and accessibility, we embarked on the development of an information hierarchy, meticulously delineating the primary sections and their respective sub-sections within the website.

Information Architecture

Grid Systems and Layout

In the inception of our UI design journey, we carefully determined the number of columns that would govern our layout. This pivotal decision directly influenced the visual flow of content and the overall equilibrium of the page. Opting for a column layout was a deliberate choice, as it excels in presenting lists of articles and features with finesse. Moreover, we maintained uniform margins and gutters throughout the layout, serving as both visual separators and guides for the user's gaze. Crucially, we ensured the adaptability of our grid and layout, guaranteeing a seamless transition across various screen sizes and orientations.

Grid-systems

About Colors

Our color palette has been carefully selected, taking into consideration the core branding elements of our project. The primary colors, mustard and dark gray, are derived from our logo, which serves as the foundational representation of our brand identity. In addition to brand consistency, our color choices align with best practices in design, particularly drawing inspiration from the principles of Material Design.

Colors

Typography

we've chosen the font "Inter" for all our text because it strikes a balance between a classic look and easy reading on modern screens. This choice aims to enhance the overall user experience on our website.

Inter

For Heading and Body text

we've chosen the Inter font for our website's body text because it's a stylish and easy-to-read typeface. It looks clean and modern, which matches our minimalist design. Sans-serif fonts like Inter are popular for web content because they're straightforward and clear, making it easier for people to read on screens. So, it's both aesthetically pleasing and practical for our website's text.

Result


In conclusion, the live textile project not only features an appealing color palette inspired by Material Design, a user-friendly "Inter" font, and a balance of traditional aesthetics with modern readability, but it also incorporates responsive design, visual consistency, user-centric navigation, engaging imagery, accessibility features, and performance optimization. These design elements collectively create an interactive and visually captivating website that successfully showcases your textile products and enhances the user experience.

Next Project