The global energy giant was at a pivotal point in their history transforming into a digital-first company focused on sustainability and well-being. At the core of this energy transition is the e-commerce website—communicating the value of the company and product differentiation through new strategy and storytelling. The website was built on the Adobe Experience Manager platform, powered by data and connected to the design system in order to ensure optimal performance and scalability.
Repsol asked us to design the website into an immersive digital experience, using innovative UX and content creation to inspire and capture new customers. Because of the success of the project, our collaboration extended to many other digital products such as the loyalty app and food and beverage website.
Great design strategy starts with defining two visual concepts that connect design decisions to the company’s purpose. For this client, the concepts of light and forward movement were defined and then strategically infused into details big and small. This creates design that means something, feels unique and adapts to different touch points and audience segments.
We also reimagined the use of core brand assets—the “thirds” and the color orange. We rethought the “thirds”, three color blocks that create a layout, as animated blocks to load pages and campaign content. To ensure accessibility and achieve greatest impact, we designated the corporate orange within larger CTAs and backgrounds within important conversion modules.
A solid e-commerce design requires a modular card system that provides flexibility for a variety of messages within a controlled and scalable structure. Our system of eight content types and five card sizes provides optimal variety for marketing communication but ensures consistency and quality across the entire websit
In order to create a truly differentiated experience, we put together a team of experts across multiple disciplines—studio production, photography, 3D animation, motion, illustration, video, front-end development and art direction—to ideate and create original content. The branded content was used to develop rich interactive stories about important energy moments in a customers life and the value of the brand across core products.
We also concepted and shot mobile device images that combine the mobile phone within the “thirds” to create a unique, branded marketing asset that can be used across multitple communication touch points.
We selected world-renowned illustrator Miguel Camacho to collaborate with us on the global illustration style that will be used across all departments of the company, both online and offline. The style and accompaning system, includes micro-illustrations and illustrations that can be recreated and combined in an infinite amount of ways within a controlled structure that ensures scalability, consistency and quality.
A world-class brand and eCommerce destination achieved through strong design strategy, experience design, content creation and original storytelling; all with the purpose of differentiating the brand and capturing new clients.
The system of eight content types and five card sizes provides optimal variety and control for marketing communication
The new Repsol corporate illustration system to accompany the commercial web
Extending the new commercial patterns to all teams with the Oxygen Design System
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
