The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Hey everyone, this is my submission for the @Rive HMI Challenge 🚀
Excited to share my Vehicle HMI (Human-Machine Interface) design, focused on a Boat Dashboard UI built using @Rive.
This project explores a modern marine interface that combines real-time data, navigation insights, and smooth interactive animations to create a seamless user experience 🌊
The experience is designed as a clear flow:
connection → system sync → navigation → monitoring → alerts → control
The interface highlights key elements like speed, fuel, GPS tracking, weather conditions, and risk indicators — all structured to keep the information clear, minimal, and easy to understand.
A major focus of this project is how motion communicates system behaviour. Each animation reflects a state change, helping users instantly understand what’s happening in the system.
Built using State Machine, Data Binding, and Layout in Rive.
Would love to hear your thoughts 👇
That marine dashboard layout is super clean — using motion to signal state changes instead of alerts is the right call for a cockpit UI
Appreciate that, Stephanie! 🙌 Motion felt like a natural fit for a cockpit UI — would love to hear how you approach state feedback in similar systems.
Looks damn good man!
Thanks bro! Glad you liked it 🔥
NAVIRUN HMI SYSTEM
A modern Boat Dashboard UI built with Rive for real-time navigation and smooth interactions.
🔗 Live Preview
Explore the full interactive experience here: https://navirun.framer.website/
Best viewed on desktop for the complete experience.
navirun.framer.website
Navirun HMI
Vehicle HMI — Boat Dashboard UI A modern Human-Machine Interface designed for real-time marine navigation, built using Rive.
really nice! would love to collaborate with you on something
Thank you for appreciating. I would love to get in touch.
Coooool😍
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Kumo — Interactive Matcha Tea Landing Page UI-UX
Choosing a drink online is often a flat and boring experience — static product cards don’t convey taste, freshness, or emotion. For a premium product like matcha, this makes it harder to stand out and convert.
This animated landing page for Kumo turns product selection into an interactive and sensory experience. Instead of reading long descriptions, users visually explore flavors through motion, ingredients, and composition.
yummy =)
Close up UI reveal animation. Created in 3dsMax, Vray render.
Toptop!
FlowGen AI build in Framer.
A modern, conversion-focused AI landing experience designed and developed in Framer. Built with a strong emphasis on clean visual hierarchy, refined interactions, and performance-driven UI.
Crafted to feel premium, intuitive, and product-ready from the first interaction.
Check it out
Sleek
Challenges
View all
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
MagicPath
The canvas is infinite, and exploration is becoming the workflow. How are you using MagicPath?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?
