Reusable Face Mask Handmade in Europe



UX Design
UI Design

April 2020

In light of the COVID-19 pandemic, we partnered with a Portuguese tailoring company to produce a better face mask.

The idea behind it was to create a product that would be accessible to everybody, no matter the location, age or lifestyle.

The Everyone, Everyday Mask.

Endresult of FibraMask on Desktop and Mobile

The Brief

Design a responsive e-commerce website with a seamless shopping experience that highlights the unique selling propositions of the product.

User Research

Our user interviews, however, indicated that the product would mostly appeal to young and adult professionals ages between 24-49 years, most of which are women.

We decided to keep the design focus on the product differentiators, while also highlighting style, comfort and reusability.


Information Architecture


Mobile Exploration

We started the design process with outlining the information architecture. The goal was to create a product-focused user experience on both, mobile and desktop.


Desktop Exploration


Moving from UX → UI

UX is never done. But with tight deadlines approaching, we knew it was time to move on.


Green has strong associations to health, nature, freshness and safety. All of which are values strongly aligned with the brand.

Blue was also tested throughout, but showed a strong association to the medical field. As a producer of non-medical masks, it was important for us to differentiate.



Paralucent combines beautifully sharp corners and curves. It comes in two versions, one for headers and UI elements, and another optimized for body copy.

Putting It All Together

Built on top of a 4px soft grid, the design provides calm through visual rhythm, clear structure and hierarchy.


In Numbers

3 weeks

Start to finish


Total sales


Unique customers


Conversion rate


Returning customers

Numbers based on first 60 days after launch.


Creating an e-commerce brand for single product came with a number of interesting challenges.

Due to the fact that the project was time-sensitive, collecting all necessary data from user research and competitor analysis became a race against the time. To make it work, we had to find balance and work with some assumptions about the customers.

Hence, it was even more important to launch quickly and verify our design decisions using user-data sources such as Hotjar, Facebook Ads and Google Analytics.

We knew we had to put a strong emphasis on social proof and customer feedback. It was also important for us to clearly communicate that FibraMask is a non-medical face mask brand, powered by technology.

Analysing user interactions also showed that there is a fine line between presenting the users with all the information available and not discouraging them from making the purchase.

Overall, we are excited to have launched the project so quickly and contributed to making this pandemic a little less stressful. Overwhelmingly positive customer reviews confirm the success of this project.

Ready to tackle e-commerce?


© Sunstory Design 2021

Made with ❤️ in Dubai, UAE.