Sion
HMI Systems, Concepts and Metaphors
Duration
1 years
Made with
Icon Incar
Stakeholder
Sono Motors
Industry
Automotive
Sion
HMI Systems, Concepts and Metaphors
Duration
1 years
Made with
Icon Incar
Stakeholder
Sono Motors
Industry
Automotive
Sion
HMI Systems, Concepts and Metaphors
Duration
1 years
Made with
Icon Incar
Stakeholder
Sono Motors
Industry
Automotive




Project overview
Sono Motors needed an intuitive, scalable interface for their infotainment system, one that seamlessly blended usability, aesthetics, and brand identity. The challenge? Aligning a cutting-edge EV experience with a clear, human-centered design, ensuring drivers stay focused while engaging with the digital cockpit.
Project overview
Sono Motors needed an intuitive, scalable interface for their infotainment system, one that seamlessly blended usability, aesthetics, and brand identity. The challenge? Aligning a cutting-edge EV experience with a clear, human-centered design, ensuring drivers stay focused while engaging with the digital cockpit.
Project overview
Sono Motors needed an intuitive, scalable interface for their infotainment system, one that seamlessly blended usability, aesthetics, and brand identity. The challenge? Aligning a cutting-edge EV experience with a clear, human-centered design, ensuring drivers stay focused while engaging with the digital cockpit.






My Role
I led the visual exploration and crafted a cohesive design system that ensured consistency across screens, simplified interaction flows, and maintained visual harmony within Sono’s brand identity. I designed a custom full icon set, including an icon style guide, and established component libraries, file architecture, and naming conventions.
My Role
I led the visual exploration and crafted a cohesive design system that ensured consistency across screens, simplified interaction flows, and maintained visual harmony within Sono’s brand identity. I designed a custom full icon set, including an icon style guide, and established component libraries, file architecture, and naming conventions.
My Role
I led the visual exploration and crafted a cohesive design system that ensured consistency across screens, simplified interaction flows, and maintained visual harmony within Sono’s brand identity. I designed a custom full icon set, including an icon style guide, and established component libraries, file architecture, and naming conventions.
Key focus areas
The scalable design system provided a structured and adaptable UI framework, ensuring consistency across platforms. The user-centered interaction was designed to offer intuitive, distraction-free infotainment navigation for seamless in-car use. The brand-aligned aesthetics created a digital experience that seamlessly integrated with Sono Motors' vision for sustainable mobility.
Key focus areas
The scalable design system provided a structured and adaptable UI framework, ensuring consistency across platforms. The user-centered interaction was designed to offer intuitive, distraction-free infotainment navigation for seamless in-car use. The brand-aligned aesthetics created a digital experience that seamlessly integrated with Sono Motors' vision for sustainable mobility.
Key focus areas
The scalable design system provided a structured and adaptable UI framework, ensuring consistency across platforms. The user-centered interaction was designed to offer intuitive, distraction-free infotainment navigation for seamless in-car use. The brand-aligned aesthetics created a digital experience that seamlessly integrated with Sono Motors' vision for sustainable mobility.
Concept
I proposed "Ethereal", a concept inspired by lightweight design principles and a futuristic, architectural aesthetic. Emphasizing open, minimalistic spaces, it explores the interplay of energy, light, shadows, and reflections to create a subtle and refined atmosphere.
Concept
I proposed "Ethereal", a concept inspired by lightweight design principles and a futuristic, architectural aesthetic. Emphasizing open, minimalistic spaces, it explores the interplay of energy, light, shadows, and reflections to create a subtle and refined atmosphere.
Concept
I proposed "Ethereal", a concept inspired by lightweight design principles and a futuristic, architectural aesthetic. Emphasizing open, minimalistic spaces, it explores the interplay of energy, light, shadows, and reflections to create a subtle and refined atmosphere.











Final screens
Final screens
Final screens
























Design System
I developed a UI pattern library that aligns with the design direction by following a cohesive concept, ensuring that every component adheres to the visual style, functionality, and user experience goals outlined in the project vision.
Design System
I developed a UI pattern library that aligns with the design direction by following a cohesive concept, ensuring that every component adheres to the visual style, functionality, and user experience goals outlined in the project vision.
Design System
I developed a UI pattern library that aligns with the design direction by following a cohesive concept, ensuring that every component adheres to the visual style, functionality, and user experience goals outlined in the project vision.











Icon Design
I developed a complete icon set to ensure visual consistency and usability across the entire interface. Each icon was meticulously crafted using a custom perfect grid system, maintaining harmony, balance, and scalability at any size. To support seamless integration, I also created a comprehensive icon style guide documentation, detailing design principles, sizing rules, stroke weights, and usage guidelines to establish a cohesive and recognizable visual language across all platforms.
Icon Design
I developed a complete icon set to ensure visual consistency and usability across the entire interface. Each icon was meticulously crafted using a custom perfect grid system, maintaining harmony, balance, and scalability at any size. To support seamless integration, I also created a comprehensive icon style guide documentation, detailing design principles, sizing rules, stroke weights, and usage guidelines to establish a cohesive and recognizable visual language across all platforms.
Icon Design
I developed a complete icon set to ensure visual consistency and usability across the entire interface. Each icon was meticulously crafted using a custom perfect grid system, maintaining harmony, balance, and scalability at any size. To support seamless integration, I also created a comprehensive icon style guide documentation, detailing design principles, sizing rules, stroke weights, and usage guidelines to establish a cohesive and recognizable visual language across all platforms.




Outcome
The final design transformed complexity into clarity, delivering an intuitive, visually coherent, and functional infotainment system that supports Sono Motors’ mission of sustainability and innovation.
Outcome
The final design transformed complexity into clarity, delivering an intuitive, visually coherent, and functional infotainment system that supports Sono Motors’ mission of sustainability and innovation.
Outcome
The final design transformed complexity into clarity, delivering an intuitive, visually coherent, and functional infotainment system that supports Sono Motors’ mission of sustainability and innovation.
Related Projects
Related Projects
Related Projects
E.
Take the first step and explore what we can achieve together. hello@edoardosportelli.design
© Edoardo Sportelli - 2024. Living in Italy, in Fiastra, nestled in the Sibillini Mountains. Like Tuscany, but better. Policy Privacy and Data Protection.
E.
Take the first step and explore what we can achieve together. hello@edoardosportelli.design
© Edoardo Sportelli - 2024. Living in Italy, in Fiastra, nestled in the Sibillini Mountains. Like Tuscany, but better. Policy Privacy and Data Protection.
Take the first step and explore what we can
achieve together.
hello@
edoardosportelli.design
© Edoardo Sportelli - 2024
Living in Italy, in Fiastra, nestled in the Sibillini Mountains. Like Tuscany, but better.
Policy Privacy and Data Protection.
E.