Angeles Montero
Smeg's redesign
Website redesign to improve digital presence and brand identity
Project Overview
Details
As part of a collaborative UX/UI project in the Labasad Master in UX/UI Design, my team and I undertook the challenge of redesigning the SMEG website. The goal was to enhance usability, boost conversions, and refine the brand’s digital presence while maintaining its signature elegance and sophistication.
Client:
LABASAD Master's project
My Role:
Team project, UX/UI designer
Year:
2024
Scope of work
UX/UI design, Web Design
Research & Discovery
User pain points
Through research and analysis, we identified several pain points affecting Smeg's website users:
🔴 Cluttered and overwhelming layout – Too much information makes navigating difficult.
🔴 Inefficient filtering & categorization – Users struggled to find specific products.
🔴 Lack of engaging content – The site lacked interactive or inspirational shopping experiences.
🔴 Poor product page usability – Incomplete or unclear product details.
🔴 Inconsistent branding & design hierarchy – Disorganized interface affecting trust.
Business goals
Smeg, as a premium brand, wanted to:
🔵 Increase online sales & conversions.
🔵 Enhance brand awareness.
🔵 Create a seamless digital shopping experience.
🔵 Boost customer engagement & loyalty.
Information Architecture
To solve navigation issues, we used the Triple R Approach: Reduce, Reorganize, Redesign
1 Reduce
Removed redundant and cluttered content.
Simplified the menu structure for clearer navigation.
Minimized overwhelming product displays.
2 Reorganize
Created new, intuitive categories based on user behavior.
Implemented logical product subcategories (e.g., "Breakfast Tools" instead of just "Appliances").
Optimized product filters to help users find products faster.
3 Redesign
Introduced a streamlined navigation menu with fewer steps.
Added a filtering system with product comparisons.
Created a new “Designer’s Stories” section to boost engagement and storytelling.
Wireframes & Prototype
After structuring the information architecture, we moved into wireframing and prototyping to test the usability of our designs.
1 Wireframes
We sketched initial layouts focusing on:
✦ Optimized homepage with cleaner design & quick access to key features.
✦ Product listing pages (PLP) with new filtering options & categories.
✦ Product detail pages (PDP) with clearer product descriptions, reviews, and call-to-action buttons.
2 High-Fidelity Prototype
Once the wireframes were tested and iterated, we moved to high-fidelity prototypes with:
✦ Polished UI elements maintain Smeg’s premium aesthetic.
✦ Smooth interactions & micro-animations for a delightful user experience.
✦ Strong call-to-action (CTA) placement for better conversions.
UX & UI Enhancements
1. Visual Hierarchy & Branding
✧ Refined typography & color scheme to align with Smeg’s premium image.
✧ Applied Gestalt principles (Law of Prägnanz) for a clean and structured design.
2. Interactive & Engaging Features
✧ “Discover Your Style” Quiz – Helping users find complementary products.
✧ Customer Reviews & Ratings Integration – Aiding decision-making.
✧ Social Media & Awards Section – Increasing brand credibility.
✧ Product Comparison Tool – Improving browsing experience.
3. Enhanced Product Pages
✧ Clear, structured product descriptions.
✧ Engaging images & videos to showcase product functionality.
✧ Downloadable resources (manuals, tech specs).
Measurable impact
+40%
Conversion rates
Better product discovery & CTAs
+60%
Increase in time spent on site
Engaging interactive features
+30%
Boost in brand loyalty
Consistent branding & storytelling
Conclusions & learnings
This project enhanced my ability to work collaboratively on large-scale UX/UI projects. The redesign met business goals and dramatically improved the user experience. Key takeaways:
✦ User Testing Matters – Early testing helped refine key features.
✦ Simplicity Wins – A minimalist UI led to better engagement.
✦ Interactivity Drives Sales – Features like “Discover Your Style” increased conversions.
✦ Consistent Branding Builds Trust – A cohesive design reinforced Smeg’s digital presence.