Rico Moda is a high-end, multi-brand fashion store for men's clothes, shoes, and accessories with more than 30 designer brands. After working on fashion for six years, Rico Nieuwenhuijse decided to start his own business and founded Rico Moda in 2006.
The team consists of a close-knit group of young people who are passionate about fashion and, as you will see, that passion and the sense of style that comes with it is quite evident by looking at the website design alone.
So, without further ado, let's take a look at some of the different elements that make Rico Moda a brilliant example of web design and excellent user experience.
{{blog-card}}
Navigation
Starting from the top, let's take a look at the navigation. On desktop, the top navigation features a fairly standard mega menu that displays images of highlighted brands when hovering over each category.
On mobile, we see a slightly less common configuration where the menu is accessed by sliding upwards from the bottom. Once expanded, the users canthen browse the brands, collections, and sale items in much the same way as on desktop.
Homepage
The main banner clearly advertises to both new and returning users that there is a promotion on select brands. This is accompanied by an aesthetically appealing lifestyle image that compliments the theme of the website.
Below the banner, users see a selection of individual promoted products in the form of a carousel, with the percentage discount clearly displayed. It's usually worth the effort to label sale items clearly as, more often than not, customers like to benefit from promotions.
Further below, Rico Moda offers outfit inspiration to users in the form of lifestyles images. When clicked on, the user has the ability to add the pictured products directly to the cart - the so-called ‘Shop the Look’ feature. This is followed by a carousel of user-generated content that has the same ‘Shop the Look’ feature. Notice that the image size and format are different which gives variation to the page structure.
When clicking on one of the images feature in the above carousel, the user is greeted by an interactive popup that allows them click on the features items, see product information and pricing, and add products directly to cart.
Footer
The footer features some public award badges and customer reviews that help build trust with their users, as well as a link to signup for membership that gives them access to exclusive items and allows them to accumulate loyalty points. At the very bottom, there are icons listing the payment methods available on-site that add to the site's authenticity and therefore also help to build user trust.
Brand Listing
Each brand page on Rico Moda includes multiple sections that showcase and describe both the products and the brands. When it comes to high-end fashion, the aesthetics of the website, like the products themselves, are of key importance.
At the top of the page, you’ll notice a visually striking, brand-specific hero image along with a short text that tells the brand’s story.
Immediately after is the product listing, with impressively detailed filtering options on the side. Choosing a clothing filter, e.g. jackets, redirects you to another product listing page with jackets from that specific brand and a different, category-and-brand-specific hero image.
Below the products listing, there are additional sections that go into more detail about the brand’s history, as well as highlight specific products, materials, or manufacturing techniques.
To top it all off (or rather bottom it all off?), each brand page has a brand-specific FAQ at the bottom of the page to ease any doubts that potential customers may have about the brand’s products.
Whether this information has been provided by the brand itself or by a member of the Rico Moda team, it's clear that a lot of consideration has been put into how each brand is presented. This results in not only a fantastic experience for the end-customers, but likely for the brands themselves as well.
Category Page
While not as impressive as the brand-specific pages, the category PLPs also feature a unique hero image and granular filtering options.
Product Page
The product detail page is clean and crisp, with a grid layout of product photos making it easy to view the product from different angles without the need to click on anything.
All product information is neatly organized on the right-hand side within dropdowns, there is a size chart for the customers’ reference, an option to contact support, and shipping information.
Cart
The cart seamlessly slides out from the right side on desktop without interrupting the shopping experience, whereas on mobile it's a full screen popup. In both cases, it can be closed by clicking the 'x'.
Once the cart is populated, users can edit the contents by clicking the quantity dropdown below each products, and summary at the bottom draws attention to the free delivery.
Checkout
The last step of the customer journey, the checkout should have an official, trustworthy appearance to ensure the user that this is a legitimate business they intend to buy from.
Rico Moda’s checkout certainly does just that and also features a progress tracker so that they know what to expect during the checkout process, as well as a review score on the right-hand side (or at the bottom of the screen on mobile) as a sign of authenticity.
Summary & suggestions
Rico Moda is a well-polished example of a multi-brand ecommerce website, so much so that it's challenging to find a single fault or even suggest something that they could do better.
That being said, if they wanted to take their platform to the next level, they could consider introducing product bundles.
Product bundles are groupings of (not necessarily) related or matching products packaged together and often sold at a lower price than if the user were to buy each item separately.
The main benefit of including bundles from a business perspective is that, when done the right way, it can significantly increase average order value (AOV).
Seeing as Rico Moda already has shoppable images that present the outfit side-by-side with each individual item pictured, they could take it a step further and offer those outfits as bundles.
Besides improving sales, their fashion-passionate team will likely have a great time mixing and matching different brands' items into stylish outfits, and it would also give them a chance to show off (and sell!) some of the less popular products.
UX deliverables guidelines
When it's time to upgrade your storefront design by using a more custom solution, here a few things to help streamline the process:
- All layouts should be designed mobile-first, desktop-second (but you will need both)
- Using pre-made components shortens the implementation time
- Layouts should be presented following the user journey in an orderly fashion
- All actions and menu or navigation states should be included
- All brand or icon assets should be in SVG format
- UX design hand-over using Figma.com or a similar service is recommended
- UX questions & answers sessions should be included
- Follow up adjustments or corrections should be anticipated
{{blog-card}}
