Trangia
0
1
/
e-commerce | ux/ui-design | rebranding | 3d-spline
2025
making people independent
For over 100 years, Trangia’s storm stove has warmed and fed hikers in all kinds of weather. Since MSB 2018 recommended storm stoves as part of household emergency preparedness, it has found its way into more homes, even among those who’ve never been camping.
Trangia mobile design, with a background of a beautiful nature shot in the mountains
01/
project details
Trangia
/my role
I was deeply involved in both the UX/UI design and developing the website in Webflow. I really enjoyed the UX challenges of e-commerce and had fun diving deeper into the development side.
/
PROJECT TYPE
FINAL PROJECT - FICTIONAL
brobygrafiska
/
time
6 weeks
2025
/
members
johan pettersson | juno strömstedt | NATHALIE ÅSBERG | LINA ANDERSSON
/
scope
e-commerce | ux/ui-design | rebranding | 3d-spline
02/
about case↓
Trangia
/background
Trangia is a trusted brand among outdoor enthusiasts, but its communication and product experience have excluded newer audiences. As crisis preparedness grows in importance, Trangia stoves now offer value at home - but the digital experience and tone remain tailored to experts, making the brand feel technical and inaccessible to young adults, families, and urban users without outdoor experience.
/solution
To reach new and existing audiences, Trangia repositioned its brand to include everyday preparedness alongside outdoor life. By keeping core values - reliability, functionality, and durability - and updating its tone to be simpler and more inclusive, the brand now feels more accessible. The digital experience was redesigned with clearer navigation and simplified product structure, reducing barriers for new users while still serving experienced ones.
/results
Trangia’s new digital identity speaks to both seasoned adventurers and users seeking everyday security. The new website offers a more accessible and guided user experience, making the products easy to understand. By addressing new needs without losing its heritage, Trangia is now positioned as a trusted tool for both home and outdoors.
03/
UX & ANALYSIS↓
Trangia
/discovery
The website is informative but not beginner-friendly. Complex product names (requiring a guide) and dense copy make it hard for new users to choose. With 40+ products differing only by parts or materials, it’s confusing - especially for the growing audience with no prior knowledge of camping stoves.
We saw a clear opportunity to simplify the user experience by restructuring the navigation categories, renaming and redesigning the products, and introducing a new filtering system - making it easier for users to navigate and choose with confidence.
/process
We decided to narrow down the number of choices and create a more focused user journey, with fewer options to reduce the confusion of selecting the right stove. Instead, users choose the material they want. We wanted the buying process to be more informative and guided, making it easier for the new target group, who have less prior knowledge and experience.
/results
Instead of offering over 40 different options, we've now created 8 base kits, where the only difference is the choice of material.
We’ve made the product page more user-friendly and intuitive. Users can now choose from 8 base kits directly or filter by material to find their preferred option. After selecting a product, they can customize the size, burner type, and add accessories that match their chosen stove. With a dynamic shopping bar at the bottom of the screen displaying selections and price, customers get a clear overview of their purchase.
mockups/
mobile
Trangia
mockups/
desktop
Trangia
active
click here to view project
Laptop showing the products page
A 3d trangia stove
Laptop showing the home page
/website desktop
The website features a clean Scandinavian design with large nature images and well-placed typography. The focus has been on improving the user experience by simplifying navigation, reducing categories, and making it easier for less experienced users. It also includes interactive elements like a rotating 3D stove, scroll-triggered animations, and a parallax section that brings the site to life.
Image of the Desktop version of Trangias Website
mockups/
mobile
Trangia
/website mobile
All elements work just as well on desktop as they do in the responsive mobile version. Text and headings remain clear and readable. On mobile, it became even more important to focus on proportions and how the design scales down to a comfortable size.
Images of Trangia website on mobile version
Images of Trangia website on mobile version
Images of Trangia website on mobile version
Images of Trangia website on mobile version
Images of Trangia website on mobile version
Images of Trangia website on mobile version
An phone showing a guide
An phone showing a guide
Two phones showing the product page and the digital guide to setup a trangia stove
other projects/
cases
2024-2025
/throw a goat eye at some of my other projects
home page of the app
Links'up golf
Links'Up helps golfers connect and play, making the sport more social.
Two phones showing the product page and the digital guide to setup a trangia stove
Callaway
a new ai-technology revolutionize the new elyte driver.
let´s get in touch!
write a message