Chennai Bazaar
E-COMMERCE WEBSITE UI DESIGN
Chennai Bazaar is a conceptual e-commerce interface created to explore category-driven browsing, clean product layouts, and a bold visual identity for a multi-department shopping platform. The goal was to design a scalable UI system that supports multiple categories, fashion, appliances, groceries, and lifestyle, while keeping navigation simple and intuitive.
Chennai Bazaar
E-COMMERCE WEBSITE UI DESIGN
Chennai Bazaar is a conceptual e-commerce interface created to explore category-driven browsing, clean product layouts, and a bold visual identity for a multi-department shopping platform. The goal was to design a scalable UI system that supports multiple categories, fashion, appliances, groceries, and lifestyle, while keeping navigation simple and intuitive.
Chennai Bazaar
E-COMMERCE WEBSITE UI DESIGN
Chennai Bazaar is a conceptual e-commerce interface created to explore category-driven browsing, clean product layouts, and a bold visual identity for a multi-department shopping platform. The goal was to design a scalable UI system that supports multiple categories, fashion, appliances, groceries, and lifestyle, while keeping navigation simple and intuitive.
Wireframes & Information Architecture
The foundation of the project began with low-fidelity wireframes to map:
Category hierarchy
Homepage layout (hero → deals → brands → categories)
Product grid structure
Navigation and footer architecture
Contact and support section layouts
The wireframes helped validate spacing, scanning patterns, and the placement of key UI components before moving into high-fidelity design.
Visual Direction & UI System
Once the structure was defined, the design shifted into high-fidelity execution with focus on:
Colour system: Bold red paired with creamy neutrals for a warm retail feel
Typography: Clean sans-serif type for high readability
Component system: Consistent cards, banners, category blocks, and product grids
Imagery style: High-contrast product photography for better visual impact
Layout rhythm: Balanced spacing and modular sections for scalable UI
Colour Palette
Final UI Screens
The completed interface includes high-fidelity screens for:
Wireframes & Information Architecture
The foundation of the project began with low-fidelity wireframes to map:
Category hierarchy
Homepage layout (hero → deals → brands → categories)
Product grid structure
Navigation and footer architecture
Contact and support section layouts
The wireframes helped validate spacing, scanning patterns, and the placement of key UI components before moving into high-fidelity design.
Visual Direction & UI System
Once the structure was defined, the design shifted into high-fidelity execution with focus on:
Colour system: Bold red paired with creamy neutrals for a warm retail feel
Typography: Clean sans-serif type for high readability
Component system: Consistent cards, banners, category blocks, and product grids
Imagery style: High-contrast product photography for better visual impact
Layout rhythm: Balanced spacing and modular sections for scalable UI
Colour Palette
Final UI Screens
The completed interface includes high-fidelity screens for:
Wireframes & Information Architecture
The foundation of the project began with low-fidelity wireframes to map:
Category hierarchy
Homepage layout (hero → deals → brands → categories)
Product grid structure
Navigation and footer architecture
Contact and support section layouts
The wireframes helped validate spacing, scanning patterns, and the placement of key UI components before moving into high-fidelity design.
Visual Direction & UI System
Once the structure was defined, the design shifted into high-fidelity execution with focus on:
Colour system: Bold red paired with creamy neutrals for a warm retail feel
Typography: Clean sans-serif type for high readability
Component system: Consistent cards, banners, category blocks, and product grids
Imagery style: High-contrast product photography for better visual impact
Layout rhythm: Balanced spacing and modular sections for scalable UI
Colour Palette
Final UI Screens
The completed interface includes high-fidelity screens for:
Role
UI/UX Designer
Led the full design workflow from low-fidelity ti high-fidelity UI
Tools
.png)
