overview
Youth eco-brand, aimed at modern people of different ages. The company had only 5 people in staff 9 years ago, and now more than 50 team members, of 8 different nationalities, are putting their efforts into a brand of wooden products that will last a lifetime.
Woodwatch is an online store of watches that are made of natural materials
Eco-brand for modern people of different ages
WoodWatch started in 2013 with just 3 models: male, female and unisex ones. The company had only 5 people in staff 9 years ago, and now more than 50 team members, of 8 different nationalities, are putting their efforts into a brand of wooden products that will last a lifetime.
2013
2022
Work Process
Grid
The 12-column grid is well divided into three, four and six columns that is quite flexible, and suitable for different types of content.
Typography
Typography plays an important role in UI as it is one of the main ways to communicate with the user. The selected fonts convey the essence of the company.
Colors
The color palette conveys the message and the brand positioning based on natural motives.
Aa
EPILOGUE
Aa
WORK SANS
STYLES
SIZE
INSCRIPTION
H1
104px
ExtraBold
H2
56px
Bold
H3
36px
Bold
H4
20px
Bold
H5
18px
SemiBold
Button
14px
Bold
Text 1
20px
Medium
Text 2
18px
Regular
The Key Challenge in designing
Our biggest challenge is all about getting new people interested in products and making sure they stay excited about what Woodwatch offers. It involves improving how we show up online, creating interesting content, and learning from the audience to keep improving.
Grid
The 12-column grid is well divided into three, four and six columns that is quite flexible, and suitable for different types of content.
Grid
The 12-column grid is well divided into three, four and six columns that is quite flexible, and suitable for different types of content.
We used data-driven approach
Over the course of several weeks, we collected recordings of user sessions. This helped us see how real users interact with the interface and identify bottlenecks.
Based on this information, we formed hypotheses on how to improve the site's UX.
Timelines
This visual representation of timelines serves as a critical reference point for understanding the chronological progression of our project, helping to manage project schedules effectively and ensuring that each phase receives the appropriate attention and resources.
UX Design
UI Design
650 h
hours spent
34 h
zoom meeting hours
100+
screens created
Mobile first approach
Although we followed the mobile-first approach, first of all we created the design for the desktop version and only after that worked on the responsive version of the website. It is always easier and quicker to optimize a large desktop screen for a small mobile one than vice versa. This approach helped us to save both time and money for the client at the front-end development stage.
Mobile-focused success
Our journey to success is marked by two remarkable achievements, each of which underscores our dedication to optimizing the mobile experience and retaining satisfied users
57.30%
Mobile interface
Most orders are placed by users via mobile phones.
67.14%
Retained users
The number of mobile orders has increased.
Visual materials
All our products contain natural wood, from all over the world. Each type of wood has its own colours, grain, hardness and beauty. In selecting wood types we only take the best, sustainable sources that we can find.
Engraving
Engraving your productDo you have a favorite phrase? Want to make your gift more personalized and stand out?
On your WoodWatch, you can add an engraving to make it truly unique and special.
Sandalwood
Sandalwood has several species that can be found all over the world, each with its own color. Typically sandalwood has a wonderful and unique smell, often used as scents and as notes in perfume. WoodWatches are made of two types of sandalwood, each owning a unique color and texture.
Walnut
Walnut wood can either be a light or dark brown color. In addition, there are tones of grey and red often visible. The structure is characterized by straight lines that are frequently alternated with curls, rings and corners. Darker strips also occur with regularity.
VISUAL OVERVIEW
Action bar
Analytics data showed that users are more likely to click on the Add to cart button if it's in the user's field of view. That's why we added an action bar to the page of the product, as well as placing information on the price and the name of the product.
Visual part
WoodWatch’s big draw is a large number of high-quality product photos and videos. Our specialists emphasized the visual materials, so now the customer can see not only product photos but also real-life watch-on videos. We provided a clear and legible split with large-scale product images.
Buy faster
According to Google Analytics, returning visitors buy 14% more often than new visitors. We integrated the Add-to-Favorites feature, so the customer can add a product to his favorites. When the user returns to the site, he can see the product he liked. By going to Favorites you can immediately find a previously saved product and buy it.
Catalog
Our specialists have divided the catalog into 4 main categories: men’s watches, women’s watches, men’s sunglasses, and women’s sunglasses. Navigation was too cumbersome, so we suggested switching between collections already in the catalog as “Instagram stories” and attached to the top tabs, this allows the user to shift quickly between collections and view more products, so the chance that the customer will find the right product, add it to the shopping cart and buy it increases significantly.
Redesign outcomes
There was a gradual release of the website. Our decision was to implement new pages and flows step by step that gave us an opportunity to implement new solutions and test them immediately.
During this stage we were tracking user activity on the new pages. This approach helped us provide the most suitable solutions for increasing conversion rates and improving the user interface.
TRANSACTION RATIO
Before
After
REVENUE
Before
After
AVERAGE ORDER VALUE
Before
After
TRANSACTION
Before
After
Conclusion
This is what we’ve come up with
It took us nine months to complete the bulk of the project’s work at all stages.
Flows for seven different user types;
500+ displays;
When it comes to mobile apps and VR/AR, there are ten clickable prototypes;
There are a total of six extra channels.
See what their users say
Feedback for the new design is generally positively received by the internal team. The redesign has also significantly improved the site's conversion rate. The team continues to work with the client for further improvements and optimization.
CTO, WoodWatch
