How 3D-animation & targeted UX turned Emons into a digitally successful brand.
An insight into our joint project with Emons.
Over several iterative concept phases, the eight-month-long project evolved into a comprehensive digital transformation involving more than ten participants from both Blue World Studio and Emons. The focus was on combining brand realignment, clear user guidance, and an interactive 3D experience that reduces complexity and provides orientation.
From sitemap to visual identity, from UX/UI to 3D – a digital presence that truly stands out.
The new digital experience of Emons goes far beyond a conventional website. It shows how complex content can be made accessible through clear structure, intentional user guidance, and interactive 3D experiences. It highlights the importance of interdisciplinary collaboration in todays world of digital brands.
Challenges & goals
The status quo of Emons & what we were able to take away from it.
1. An uninspired start & inadequate visual guidance
- No visual hierarchy, The gaze is not guided intuitively
- Key focus points Like the freight request form recede into the background
Getting started does not convey a clear message or concrete added value. Instead of directing the eye in a targeted manner, several elements compete with each other, which makes orientation difficult and weakens the first impression.
2. The basic structure is in place, but the path is confusing for visitors
- Objective: To accommodate the extensive content in a structured way without losing the fun of scrolling
Emons already had good approaches to presenting their service portfolio. The problem: content. Although the existing system allowed new pages, it offered hardly any design options. Content was difficult to read and confusing.
3. Essential functions for user navigation
- Too low information density and unclear user guidance
- Lack of filtering and sorting functions, not scalable for a growing number of locations
A central focus is on lead-generating pages such as the location overview and the location sub-pages. Objective: Connect visitors directly with a branch near them.
4. Suspense, storytelling & interaction
The entire website lacks a clear structure, user guidance and, above all, interaction. Through interactivity, sections can be playfully convincing and increase engagement.
Solutions & Approaches
From concept to immersive brand world. Our solution for Emons.
1. Strategy & Foundation
- Common brand understanding
- First drafts and key ideas
- Defining the strategic direction
The start took place with a joint workshop at Emons headquarters in Cologne. The aim was to create a deep understanding of the brand, goals and potential and to define a clear strategic and visual direction.
2. Structure & brand development
- Clear structure and user guidance
- Development of wireframes and concepts
- Iterative development of branding
Based on the findings, information architecture, site maps and wireframes were developed. At the same time, a new visual language was created, which serves as the basis for the entire digital experience.
3. UX/UI design & user guidance
- Precise user guidance and clear hierarchies
- Reducing complexity through structure
- Consistent UI system and visual logic
The next step was to holistically think and design the interface. The aim was a clear, intuitive user interface that structures content in an understandable way and creates a consistent, high-quality user experience.
4. 3D experience & implementation
- Modular animation with smooth transitions
- Using Animatics for Iterative Tuning
- Spatial awareness for orientation in space
- Final rendering and technical implementation
The 3D animation was developed in modular stages and implemented as a seamless, interactive experience. Targeted transitions and loops create a smooth scrolling experience with high visual continuity.
Results
Still have questions?
We provide the answers.
In short: No
However, there are many different methods to integrate 3D animations on a website. For Emons, we released the 3D animations as videos and integrated the corresponding sequences and loops into the website. In this way, visitors do not have to spend any additional computing power, but simply load the video. The rest just happens by itself.
Alternatively, you could integrate 3D animations natively into the website. However, this entails other hurdles that can influence performance, among other things. With the right preparation, however, such disruptions can be reduced to a minimum.
Together with Emons, we have set a weekly appointment, in which we agreed on progress on both sides.
We designed the website in parallel with content creation, which required close coordination with the Emons team.
In general, we deliberately keep feedback loops short by actively using our Monday project management tool communicate and bundle all updates there. Our customers can send us wishes and suggestions directly on Monday, to which we usually respond the same day.
Yes We attach great importance to the scalability of our websites, after all, we don't want headaches as much as our customers. That is why we strategically plan our projects in advance, create sophisticated sitemaps and link structures and design UX/UI and CMS in such a way that new pages can be added at any time and existing content can be flexibly adapted.
On request, we can also implement the entire website in a completely modular system that our customers can expand and edit independently.
Come to Blue World Studio. But seriously, we cover a wide range, from strategy, UX/UI, 3D & Motion to frontend and backend development to SEO and AI search.
A project with 3D animations, precise user guidance and distinctive interactivity is no small undertaking. It requires time, experience, and patience. With Blue World Studio, you're in the right hands.
