RIVE X CONTRA VEHICLE HMI CHALLENGE

I took lead on developing the user interface and project foundation for the Rive x Contra Vehicle HMI Challenge.

This challenge, hosted by Rive and Contra, entailed creating a vehicle HMI (Human-Machine Interface) in Rive. After two of my colleagues and I decided to join the challenge, we had just over a week to produce a fully functional HMI from scratch, and we landed on using the Porsche 911 Targa 4S for our vehicle. Since we are well versed in Unreal Engine, we used that as our HMI platform. The project utilizes the Rive plugin throughout the application, including the entire user interface and 3D avatar visual effects.

The project explores segments of a reimagined Porsche infotainment as a configurable real-time system. It contains vehicle health readouts, a customizable vehicle avatar, and driving dynamics settings. The Rive file is runtime ready and completely data driven. It contains our menu functionality, liveries for the avatar, and is fully data bound for bidirectional communication with Unreal Engine.

We developed this application after hours through rapid prototype creation and quick ideation. It was a really fun exercise to reimagine such an iconic vehicle. Below is a final cut put together by Justin, Design Manager at Ford, and screenshots of the final experience, including vehicle health, customization, and driving.

My contributions consisted of building the entire user interface and splash screen in Rive and implementing the Rive plugin in Unreal Engine. I approached creating the interface like I would with any other production-level project. I built foundational components with all necessary data exposed and ready to be used. Once I had my hierarchy in place, I imported it into Unreal Engine with the Rive plugin and created widget and actor blueprints for the project. I exposed the necessary listeners, functions, and data for our scene to be manipulated based on input from Rive. The screenshots below contain my Rive components, data view models, and the Unreal Engine widget blueprint.