Foleja Homepage Redesign
Foleja Homepage Redesign
Foleja Homepage Redesign
Company
Foleja
Role
UI/UX Designer
Timeframe
4 Weeks
When
December, 2024
TL;DR
TL;DR
TL;DR
Initiated and led a data-driven homepage redesign for Kosovo’s & Albania’s 2nd largest e-commerce platform to improve engagement, product discovery, and conversions.
Initiated and led a data-driven homepage redesign for Kosovo’s & Albania’s 2nd largest e-commerce platform to improve engagement, product discovery, and conversions.
Context
Context
Context
Foleja’s original homepage was cluttered, poorly prioritized, and underperforming. Key information was buried, users ignored promotional banners, and mobile usability suffered. Using Microsoft Clarity, I identified key behavioral friction points and redesigned the experience end-to-end.
Foleja’s original homepage was cluttered, poorly prioritized, and underperforming. Key information was buried, users ignored promotional banners, and mobile usability suffered. Using Microsoft Clarity, I identified key behavioral friction points and redesigned the experience end-to-end.
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (Old)
Key problems
Key problems
Key problems
Accessibility standards were not being adhered to.
Accessibility standards were not being adhered to.
Hidden categories reduced product discoverability
Hidden categories reduced product discoverability
Users ignored banners and carousel content beyond the 2nd item
Users ignored banners and carousel content beyond the 2nd item
Wishlist access was buried on mobile
Wishlist access was buried on mobile
Filtering and navigation lacked clarity
Filtering and navigation lacked clarity
No infinite scroll or continuity led to premature drop-off
No infinite scroll or continuity led to premature drop-off
What I Did
What I Did
What I Did
To boost engagement and reduce drop-offs, I analyzed user behavior with heatmaps, scroll tracking, and session recordings. I benchmarked leaders like Amazon and Gjirafa50 to guide an evidence-based homepage redesign
To boost engagement and reduce drop-offs, I analyzed user behavior with heatmaps, scroll tracking, and session recordings. I benchmarked leaders like Amazon and Gjirafa50 to guide an evidence-based homepage redesign
Analyzed user behavior using heatmaps, scroll depth data, and session recordings to uncover drop-off points and friction areas.
Analyzed user behavior using heatmaps, scroll depth data, and session recordings to uncover drop-off points and friction areas.
Presented findings to stakeholders and collaborated with the team to align on priorities and opportunities.
Presented findings to stakeholders and collaborated with the team to align on priorities and opportunities.
Conducted competitor analysis to identify UX/UI patterns and industry standards.
Conducted competitor analysis to identify UX/UI patterns and industry standards.
Recommended and justified key design changes backed by data and usability principles.
Recommended and justified key design changes backed by data and usability principles.
Led ideation, wireframing, and creation of high-fidelity designs that addressed user pain points and improved usability.
Led ideation, wireframing, and creation of high-fidelity designs that addressed user pain points and improved usability.
Ran internal usability testing using interactive prototypes to validate design assumptions.
Ran internal usability testing using interactive prototypes to validate design assumptions.
Iterated designs based on user feedback and team input, refining the experience with each cycle.
Iterated designs based on user feedback and team input, refining the experience with each cycle.
Home
Home
Home
I redesigned the homepage to align with WCAG accessibility standards and improve usability. Based on low scroll depth, I streamlined the layout to help users reach products faster, removing elements that were unengaged with.
I redesigned the homepage to align with WCAG accessibility standards and improve usability. Based on low scroll depth, I streamlined the layout to help users reach products faster, removing elements that were unengaged with.
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (New)
Foleja home page (New)
Accessibility improvements for color contrast, text, and touch targets.
Accessibility improvements for color contrast, text, and touch targets.
Clear, always-visible category system based on actual clicks.
Clear, always-visible category system based on actual clicks.
Wishlist brought forward on mobile.
Wishlist brought forward on mobile.
New layouts
New layouts
New layouts
The main focus was to declutter the Weekly Deals section and make it easier to interact with. Since it’s a key value proposition with rotating offers, I aimed to create more urgency and clarity to better drive engagement and sales.
The main focus was to declutter the Weekly Deals section and make it easier to interact with. Since it’s a key value proposition with rotating offers, I aimed to create more urgency and clarity to better drive engagement and sales.
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (New)
Foleja home page (New)
Raised urgency for sales that are temporary.
Raised urgency for sales that are temporary.
Removed poorly performing elements to reduce scroll depth.
Removed poorly performing elements to reduce scroll depth.
Changed layout to draw attention to weekly deals.
Changed layout to draw attention to weekly deals.
New layouts (2)
New layouts (2)
New layouts (2)
The focus for the Foleja Deals section was to highlight the limited stock and availability of these products. Using the same layout for consistency, I emphasized scarcity to encourage users to act quickly—something the previous design failed to communicate.
The focus for the Foleja Deals section was to highlight the limited stock and availability of these products. Using the same layout for consistency, I emphasized scarcity to encourage users to act quickly—something the previous design failed to communicate.
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (New)
Foleja home page (New)
Focused attention on special offers to drive sales.
Focused attention on special offers to drive sales.
Raised urgency for products that have low stock.
Raised urgency for products that have low stock.
Driving discovery
Driving discovery
Driving discovery
In the Foleja carousels, oversized product cards caused the third item to be barely visible, resulting in an average 80% drop in interactions with the third card—and even less for subsequent items. I redesigned the cards with improved visual hierarchy and accessibility, resizing them to ensure at least 50% visibility of the third card. This change can significantly improve product discovery.
In the Foleja carousels, oversized product cards caused the third item to be barely visible, resulting in an average 80% drop in interactions with the third card—and even less for subsequent items. I redesigned the cards with improved visual hierarchy and accessibility, resizing them to ensure at least 50% visibility of the third card. This change can significantly improve product discovery.
Foleja home page (Old)
Foleja home page (Old)
Foleja home page (New)
Foleja home page (New)
Drove discovery with a redesigned carousel hinting at more content.
Drove discovery with a redesigned carousel hinting at more content.
Used badges to convey social proof and encourage action.
Used badges to convey social proof and encourage action.
Streamlined search
Streamlined search
Streamlined search
The search page was redesigned to streamline the buying process by adding “Add to Cart” buttons directly on product cards, inspired by Amazon. I also introduced badges like “Best Seller” and time-limited offers to create urgency. To reduce friction, we’re implementing infinite scroll, as around 60% of users who search for products reach the bottom of the page—where they currently have to click to load more items.
The search page was redesigned to streamline the buying process by adding “Add to Cart” buttons directly on product cards, inspired by Amazon. I also introduced badges like “Best Seller” and time-limited offers to create urgency. To reduce friction, we’re implementing infinite scroll, as around 60% of users who search for products reach the bottom of the page—where they currently have to click to load more items.
Foleja search page (Old)
Foleja search page (Old)
Foleja search page (New)
Foleja search page (New)
Add-to-cart buttons on product cards to reduce friction.
Add-to-cart buttons on product cards to reduce friction.
Infinite scroll patterns to drive exploration.
Infinite scroll patterns to drive exploration.
Used badges to convey social proof and encourage action.
Used badges to convey social proof and encourage action.
Accessibility improvements for color contrast, text, and touch targets.
Accessibility improvements for color contrast, text, and touch targets.
Reflection
Reflection
Reflection
Overall, I’m quite happy with the outcome of this project. Given the limited resources and data points available, I believe there was potential to develop an even stronger product if more comprehensive information and a larger team had been provided. Despite these constraints, I approached the challenge with a strong focus on design thinking and made a conscious effort to follow established design principles throughout the process. I proposed a number of changes that I believe could bring significant improvements to the product, although since the project is still in its development phase, I haven’t yet been able to gather real user feedback or data to measure the impact. That said, I’m proud of how I navigated the process—adapting to limitations while keeping the user at the center of my decisions. I believe the result is a more accessible and user-friendly product, and I feel that I demonstrated logical, thoughtful design choices in response to the information available.
Overall, I’m quite happy with the outcome of this project. Given the limited resources and data points available, I believe there was potential to develop an even stronger product if more comprehensive information and a larger team had been provided. Despite these constraints, I approached the challenge with a strong focus on design thinking and made a conscious effort to follow established design principles throughout the process. I proposed a number of changes that I believe could bring significant improvements to the product, although since the project is still in its development phase, I haven’t yet been able to gather real user feedback or data to measure the impact. That said, I’m proud of how I navigated the process—adapting to limitations while keeping the user at the center of my decisions. I believe the result is a more accessible and user-friendly product, and I feel that I demonstrated logical, thoughtful design choices in response to the information available.
Other projects
Increasing Checkout Conversion
Redesigned Foleja’s mobile checkout after spotting high drop-offs, introducing a sticky bottom sheet for mobile users and smart defaults inspired by Amazon & Airbnb to streamline the experience.
Increased conversion
Simplification
Full redesign
-20%
Cart abandonment.
85%
Found easier to use.
Increasing Checkout Conversion
Redesigned Foleja’s mobile checkout after spotting high drop-offs, introducing a sticky bottom sheet for mobile users and smart defaults inspired by Amazon & Airbnb to streamline the experience.
Increased conversion
Simplification
Full redesign
-20%
Cart abandonment.
85%
Found easier to use.
Increasing Checkout Conversion
Redesigned Foleja’s mobile checkout after spotting high drop-offs, introducing a sticky bottom sheet for mobile users and smart defaults inspired by Amazon & Airbnb to streamline the experience.
Increased conversion
Simplification
Full redesign
-20%
Cart abandonment.
85%
Found easier to use.
Replate: A food-waste reduction app.
Replate: A food-waste reduction app.
Replate: A food-waste reduction app.
Replate: A food-waste reduction app.
A mobile-first app connecting Kosovars with unsold meals — inspired by Too Good To Go, with local payments and meal donation features to fight food waste and help low-income users.
A mobile-first app connecting Kosovars with unsold meals — inspired by Too Good To Go, with local payments and meal donation features to fight food waste and help low-income users.
A mobile-first app connecting Kosovars with unsold meals — inspired by Too Good To Go, with local payments and meal donation features to fight food waste and help low-income users.
A mobile-first app connecting Kosovars with unsold meals — inspired by Too Good To Go, with local payments and meal donation features to fight food waste and help low-income users.
End-To-End Design
End-To-End Design
End-To-End Design
End-To-End Design
Sustainable
Sustainable
Sustainable
Sustainable
Ethical Design
Ethical Design
Ethical Design
Ethical Design
2,000 kg
2,000 kg
2,000 kg
2,000 kg
Potential food waste reduction.
Potential food waste reduction.
Potential food waste reduction.
Potential food waste reduction.
90%
90%
90%
90%
Found ethical.
Found ethical.
Found ethical.
Found ethical.
Home