Insulation for a Better Tomorrow

(URSA)

Designing the corporate website of one of Europe’s top insulation companies.

URSA’s global website is a great example of Cocota co-creating and coordinating with various project partners.

We collaborated with several URSA departments as well as external professionals who helped put our ideas and know-how at the service of this project. Working together, we were able to transform a vague concept into a solid, friendly and intuitive digital experience.

The team included URSA representatives, their web development partner and, on our side, one designer, one strategist and a copy-editor (one of our trusted collaborators).

The goal was to design a website that could at once represent the company, communicate its values and facilitate access to local pages for prospective buyers from different countries.

drag-arrow
Drag me!

About URSA

URSA is one of Europe’s top insulation companies, manufacturing glass mineral wool and extruded polystyrene (XPS) for residential and non-residential buildings. Headquartered in the centre of Madrid, the company has 13 production sites in 8 countries and a commercial presence in around 50 markets around the world.

Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio

User experience (UX) research

After a phase of alignment, we took a deep dive into understanding the company through the use of questionnaires and interviews with key URSA personnel, basing our strategy on the data gathered.

Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio
Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio

Designing for people

To create an effective project design, we needed to stop talking about users in general and start talking about specific people. With the help of Mamen, Efrén and Beatriz from URSA, we defined the profiles of URSA’s various users and their needs. Our ‘user personas’ reflected three core audiences:

  • Partners, investors and distributors looking for accessible, up-to-date and official info about the company.
  • Architects, installers and other technical people looking for info about URSA’s products and how to get hold of them.
  • Prospective employees.
capturas de pantalla de la página 404 con el nuevo diseño web hecho por Cocota Studio para Ursa Insulation
capturas de pantalla de la página 404 con el nuevo diseño web hecho por Cocota Studio para Ursa Insulation diseñad

Studying the competition

We carried out a detailed study of the websites of competitors, companies from a range of sectors and localised URSA pages from various countries to identify bad and good practices in the resolution of specific problems.

captura de pantalla de la página 404 con el nuevo diseño web hecho por Cocota Studio para Ursa Insulation

Content strategy

A company like URSA deals with very technical information. But in terms of website concept, what it was looking for was pretty universal: clarity and user-friendliness.

URSA offers high-quality insulation solutions for every type of building, with benefits for both people and the environment.

With that idea in mind, we defined the content map and information architecture and planned the content creation, which involved extensive work in cleaning up, updating and synthesising existing texts.

In the co-creation sessions with URSA, all decisions were taken on the basis of whether a design idea made sense for the three user personas.

Wireframing

Wireframes were especially useful in this project. They helped us make decisions, define details and prevent problems during the development phase.

  • Structure: The location of each screen in the global map and the navigation flow between them.
  • Content and hierarchy: What information is shown on each screen, as well as each step of the navigation flow and its arrangement.
  • Functionality: How the interface works; how intuitive the function of each element is and the navigation from point A to point B.
  • Behaviours: How the user interacts with each element and which sections should be highlighted through the interaction design.
1. Low-fidelity wireframe
2. High-fidelity wireframe
Diferentes imágenes del diseño de la web de Ursa Insulation
3. Design
1/0

User interface (UI) design

The site’s UI design required tackling an area that ended up becoming a project in itself: the evolution of URSA’s corporate identity in the digital environment.

Among other things, we defined the behaviour of circular shapes, a key element of URSA’s visual identity that needed to be present on its website.

We worked meticulously to guarantee coherence and intuitiveness across the site.

Every time we designed a screen or an interface element, we checked its performance on both desktop and mobile. Sometimes what works well on desktop doesn’t on mobile and vice versa, so this helps us avoid having to make changes to a screen that has already been approved.

Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio
Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio

The Cocota team really got to grips with the nature of our business and what we needed from our website. Their research produced some really key insights, and throughout the process our questions were handled on the basis of solid data and sound experience.

Mamen Fernández, Comms Manager at URSA
Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio
capturas de pantalla de la versión en móvil y tablet del diseño de la nueva web de Ursa Insulation diseñado por Cocota Studio
capturas de pantalla de la página 404 con el nuevo diseño web hecho por Cocota Studio para Ursa Insulation
Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio
Diferentes imágenes del diseño de la web de Ursa Insulation diseñado por Cocota Studio

Diseño de interacción (IxD)

For users less familiar with URSA’s products, it can be a challenge to figure out which is most suitable to their needs. So we designed a simple interactive infographic based on the image of a 3D house to filter the products by application.

URSA has been around for 70 years. So structuring its large volume of information while maintaining fluid navigation required some creative thinking. We used ‘animation on scroll’ to engage the attention of the user during interaction with such extensive content.

Other sections we emphasised through IxD were the insulation material factsheets on the home page and the product lifecycle infographic, illustrating very simply how sustainability isn’t just in URSA’s insulation products but built into the company’s DNA.

Otras secciones en las que se trabajó el diseño de interacción fueron las tarjetas de materiales de la página de inicio y el ciclo de vida de los productos de URSA, que demuestra de forma muy sencilla cómo la sostenibilidad no es sólo un beneficio que se obtiene al usar estos productos de aislamiento sino que forma parte del ADN de la compañía.

Cocota has been the ideal partner in the creation of our global website. The result is a cogent, functional and intuitive digital product.

Mamen Fernández, Comms Manager at URSA

Fancy a virtual cup of coffee with us?
We’re friendly and love chatting about new projects and ideas.