Nissan Leaf Commercial

Nissan Leaf Commercial

Client: Nissan

Agency: Moving Picture Company

Role: Motion Design Director

Teams: Leadership team, 2 PMs, 3 Designers

Duration: 3 months

Goal: Interface design, motion systems, automotive UX, VFX integration

Outcome: On-screen UI systems for advanced table maps and in-room vehicle displays

Client: Nissan

Agency: Moving Picture Company

Role: Motion Design Director

Teams: Leadership team, 2 PMs, 3 Designers

Duration: 3 months

Goal: Interface design, motion systems, automotive UX, VFX integration

Outcome: On-screen UI systems for advanced table maps and in-room vehicle displays

Project Introduction

Project Introduction

Automotive design is increasingly shaped by digital systems. Modern electric vehicles such as the Nissan Leaf rely heavily on connected interfaces, real-time data, and intelligent navigation systems to enhance the driving experience.  These systems extend beyond the dashboard, influencing how users interact with vehicles across planning, navigation, and decision-making.

The Nissan Leaf commercial explored this future by presenting a vision of advanced vehicle technology through cinematic storytelling. The project centred around a high-tech environment featuring an interactive table-based map system alongside a series of automotive interface displays embedded within the room. These systems visualised navigation, environmental awareness, and vehicle intelligence in a way that felt both futuristic and grounded in real-world innovation.

My role involved designing the UX and UI for these systems, as well as contributing to the visual effects that brought them to life. The goal was to create interfaces that felt believable within the context of advanced automotive technology while also being visually striking and immediately understandable to the viewer.

The challenge was to design systems that communicated complex data—such as mapping, positioning, and vehicle status—within seconds, while still supporting the cinematic narrative of the commercial.

Automotive design is increasingly shaped by digital systems. Modern electric vehicles such as the Nissan Leaf rely heavily on connected interfaces, real-time data, and intelligent navigation systems to enhance the driving experience.  These systems extend beyond the dashboard, influencing how users interact with vehicles across planning, navigation, and decision-making.

The Nissan Leaf commercial explored this future by presenting a vision of advanced vehicle technology through cinematic storytelling. The project centred around a high-tech environment featuring an interactive table-based map system alongside a series of automotive interface displays embedded within the room. These systems visualised navigation, environmental awareness, and vehicle intelligence in a way that felt both futuristic and grounded in real-world innovation.

My role involved designing the UX and UI for these systems, as well as contributing to the visual effects that brought them to life. The goal was to create interfaces that felt believable within the context of advanced automotive technology while also being visually striking and immediately understandable to the viewer.

The challenge was to design systems that communicated complex data—such as mapping, positioning, and vehicle status—within seconds, while still supporting the cinematic narrative of the commercial.

Project Story

Project Story

At the outset of the project, the key challenge was defining how future automotive systems might extend beyond the vehicle itself. Traditional car interfaces are limited to dashboards and infotainment screens, but the concept for the commercial imagined a broader ecosystem where users could interact with vehicle data in physical spaces.

The centrepiece of this idea was a table-based interactive map system, designed to visualise navigation, routes, and environmental data in a shared, spatial interface. This system needed to communicate location, movement, and planning in a way that felt intuitive while also appearing technologically advanced. The design drew on principles of spatial UX, where information is layered and visualised in relation to physical space.

Alongside the map system, the room featured multiple displays showing automotive mechanical data and vehicle intelligence systems. These interfaces represented the inner workings of the vehicle—battery status, system diagnostics, and environmental awareness—translated into visual formats that could be quickly understood.

As with cinematic UX work, the interfaces needed to balance realism with clarity. They had to feel like believable extensions of existing automotive technology, while still being simplified enough for audiences to understand instantly.

Another layer of complexity came from the integration with VFX. The UI was not static; it needed to exist within a dynamic environment, interacting with lighting, perspective, and camera movement. This required close collaboration between design and VFX teams to ensure that the interfaces felt physically embedded within the space.

At the outset of the project, the key challenge was defining how future automotive systems might extend beyond the vehicle itself. Traditional car interfaces are limited to dashboards and infotainment screens, but the concept for the commercial imagined a broader ecosystem where users could interact with vehicle data in physical spaces.

The centrepiece of this idea was a table-based interactive map system, designed to visualise navigation, routes, and environmental data in a shared, spatial interface. This system needed to communicate location, movement, and planning in a way that felt intuitive while also appearing technologically advanced. The design drew on principles of spatial UX, where information is layered and visualised in relation to physical space.

Alongside the map system, the room featured multiple displays showing automotive mechanical data and vehicle intelligence systems. These interfaces represented the inner workings of the vehicle—battery status, system diagnostics, and environmental awareness—translated into visual formats that could be quickly understood.

As with cinematic UX work, the interfaces needed to balance realism with clarity. They had to feel like believable extensions of existing automotive technology, while still being simplified enough for audiences to understand instantly.

Another layer of complexity came from the integration with VFX. The UI was not static; it needed to exist within a dynamic environment, interacting with lighting, perspective, and camera movement. This required close collaboration between design and VFX teams to ensure that the interfaces felt physically embedded within the space.

The turning point in the project came when the interfaces evolved into fully spatial, cinematic systems that combined automotive UX principles with immersive interaction design. The table-based map system became the focal point, acting as a large-scale interface where users could visualise routes, explore locations, and understand spatial relationships in real time.

Motion design played a crucial role in communicating how the system worked. Animated transitions, data flows, and responsive interactions helped guide the viewer’s attention and explain system behaviour without the need for dialogue. The map system needed to feel intelligent and reactive, reinforcing the idea of a connected, data-driven vehicle ecosystem.

The surrounding displays complemented this system by presenting detailed vehicle information. These interfaces translated complex mechanical and environmental data into clear visual representations, drawing inspiration from real automotive systems such as navigation platforms and connected vehicle services, which provide real-time information and mapping within modern vehicles. 

My role involved designing both the structure and visual language of these systems, ensuring consistency across all displays while contributing to the motion and VFX integration that made them feel alive within the environment. The interfaces needed to feel cohesive as part of a single system rather than separate elements.

Through this process, the project combined automotive UX, spatial interaction design, and cinematic storytelling into a unified visual experience.fect, the produc transformed the smartphone into a complete field-service toolkit.

The turning point in the project came when the interfaces evolved into fully spatial, cinematic systems that combined automotive UX principles with immersive interaction design. The table-based map system became the focal point, acting as a large-scale interface where users could visualise routes, explore locations, and understand spatial relationships in real time.

Motion design played a crucial role in communicating how the system worked. Animated transitions, data flows, and responsive interactions helped guide the viewer’s attention and explain system behaviour without the need for dialogue. The map system needed to feel intelligent and reactive, reinforcing the idea of a connected, data-driven vehicle ecosystem.

The surrounding displays complemented this system by presenting detailed vehicle information. These interfaces translated complex mechanical and environmental data into clear visual representations, drawing inspiration from real automotive systems such as navigation platforms and connected vehicle services, which provide real-time information and mapping within modern vehicles. 

My role involved designing both the structure and visual language of these systems, ensuring consistency across all displays while contributing to the motion and VFX integration that made them feel alive within the environment. The interfaces needed to feel cohesive as part of a single system rather than separate elements.

Through this process, the project combined automotive UX, spatial interaction design, and cinematic storytelling into a unified visual experience.fect, the produc transformed the smartphone into a complete field-service toolkit.

As the project progressed, the integration between UX design and visual effects became increasingly refined. The interfaces were no longer individual screens but part of a connected system that communicated how the vehicle interacted with the world around it.

The table-based map system successfully conveyed spatial awareness and route planning, while the surrounding displays reinforced the idea of a vehicle powered by intelligent systems and real-time data. Together, these elements created a cohesive vision of how automotive interfaces might evolve beyond traditional dashboards.

The collaboration between design and VFX ensured that the systems felt physically grounded within the space, responding naturally to movement, perspective, and lighting. This helped create a believable representation of advanced automotive technology while maintaining the clarity required for cinematic storytelling.

The result was a set of interfaces that not only supported the narrative of the commercial but also reflected the broader direction of connected vehicle experiences.

As the project progressed, the integration between UX design and visual effects became increasingly refined. The interfaces were no longer individual screens but part of a connected system that communicated how the vehicle interacted with the world around it.

The table-based map system successfully conveyed spatial awareness and route planning, while the surrounding displays reinforced the idea of a vehicle powered by intelligent systems and real-time data. Together, these elements created a cohesive vision of how automotive interfaces might evolve beyond traditional dashboards.

The collaboration between design and VFX ensured that the systems felt physically grounded within the space, responding naturally to movement, perspective, and lighting. This helped create a believable representation of advanced automotive technology while maintaining the clarity required for cinematic storytelling.

The result was a set of interfaces that not only supported the narrative of the commercial but also reflected the broader direction of connected vehicle experiences.

Conclusion

Conclusion

The Nissan Leaf commercial demonstrated how UX design can extend beyond traditional screens to explore future interaction models for automotive systems. By combining spatial interfaces, real-time data visualisation, and cinematic storytelling, the project presented a vision of how users might interact with vehicles in more immersive and connected ways.

The work highlighted the importance of clarity, motion, and system thinking when designing interfaces that must communicate instantly. It also reinforced the role of UX design in shaping how emerging technologies are perceived, even within speculative or conceptual environments.

By translating complex automotive systems into intuitive visual experiences, the project showed how design can bridge the gap between innovation and understanding.

The Nissan Leaf commercial demonstrated how UX design can extend beyond traditional screens to explore future interaction models for automotive systems. By combining spatial interfaces, real-time data visualisation, and cinematic storytelling, the project presented a vision of how users might interact with vehicles in more immersive and connected ways.

The work highlighted the importance of clarity, motion, and system thinking when designing interfaces that must communicate instantly. It also reinforced the role of UX design in shaping how emerging technologies are perceived, even within speculative or conceptual environments.

By translating complex automotive systems into intuitive visual experiences, the project showed how design can bridge the gap between innovation and understanding.

Takeaways

Takeaways


  • Cinematic UX can explore future product experiences.
    Designing for film allows teams to prototype ideas that may shape future real-world interfaces.

  • Spatial interfaces extend beyond traditional screens.
    The table map system demonstrated how users might interact with vehicle data in physical environments.

  • Clarity is critical when communicating complex systems.
    Interfaces must simplify data without losing meaning, especially in fast-paced visual contexts.

  • Motion design enhances understanding.
    Animation and interaction help explain system behaviour and guide user attention.

  • UX and VFX collaboration is essential.
    Seamless integration ensures interfaces feel believable within cinematic environments.




  • Cinematic UX can explore future product experiences.
    Designing for film allows teams to prototype ideas that may shape future real-world interfaces.

  • Spatial interfaces extend beyond traditional screens.
    The table map system demonstrated how users might interact with vehicle data in physical environments.

  • Clarity is critical when communicating complex systems.
    Interfaces must simplify data without losing meaning, especially in fast-paced visual contexts.

  • Motion design enhances understanding.
    Animation and interaction help explain system behaviour and guide user attention.

  • UX and VFX collaboration is essential.
    Seamless integration ensures interfaces feel believable within cinematic environments.



Final

Final

More Work

Create a free website with Framer, the website builder loved by startups, designers and agencies.