IArt

Redefining In-Car Interfaces with Adaptive AI Visuals

While many AI tools and LLMs focus on text-based interactions, IArt goes further by enabling users to generate and explore information visually.

Latest concept screen

Project Type

Product Design

Collaboration

Directors
Dev Leads
Product Managers

Platforms

Web, Vehicle Console

Timeline

Q1 2024 - Ongoing

Role & responsibilities

Lead Product Designer

UX Consulting, Visual Design, Branding, Prototyping, Interaction Design, Dev handoff

I led the ideation, branding, and UX design for IArt’s ForceGraph, a platform redefining AI-driven interactions.

Unlike traditional text-based AI, IArt introduces a visually immersive experience, enabling users to engage with AI through adaptive visuals rather than static prompts.

Problem

Text-based AI interactions feel static and fail to engage users who benefit from visual learning. This gap limits intuitive exploration and makes processing complex information harder.

Project Goals

The goal was to move beyond basic GPT integration and create an adaptive, scalable AI interface that met both stakeholder expectations and real user needs. The focus was on three key areas:

Experience Personalization

Allow users to customize their interface with flexible layouts, color schemes, and font choices.

Responsiveness and Scalability

Ensure seamless performance across different screen sizes with a desktop-first approach and modular components.

Ease of development

Use design systems and pre-built libraries to streamline development and accelerate implementation.

Brainstorming & Research

With tight timelines and limited funding, this project was largely conceptual, leaving little room for testing. I focused on solving key usability challenges while aligning with stakeholder and developer constraints. My approach balanced scalability, feasibility, and intuitive AI-driven interaction design.

Starting the Process

I started by researching visual trends and gathering references to define the right aesthetic for IArt. From this, I built a cohesive style guide, focusing on scalability and usability. By refining colors, typography, and branding early on, I established a strong design foundation that would ensure consistency across the platform.

Building Out the App

With the core branding established, I began designing the interface—starting with a basic layout before integrating theming and user customization. The goal was to create a flexible system that adapts to different user preferences while maintaining a cohesive experience.

Addressing Additional Feedback

I refined and expanded the initial themes based on stakeholder and developer feedback, creating component sets to improve clarity and consistency. These refinements ensured the design system was well-documented and easy to implement.

Finishing the Scoped Product

At this stage, the core product was functional, with most components and features in place while final refinements were still in progress. This version was presented to stakeholders to showcase the interactive experience and ensure alignment before finalizing the themes.

Stakeholder Showcase by Lead Developer

HI-FI Concept Screens

Adapting to New Priorities & Constraints

As we showcased the app to investors and startups, a major car manufacturer expressed interest in integrating it into vehicle center consoles. This introduced new technical and accessibility requirements, requiring a rebuild of components to meet automotive UI standards.

At the same time, shifting priorities meant we couldn't afford to build everything from scratch again. To maintain momentum, I researched pre-built libraries and code generators, selecting tools that balanced speed, flexibility, and accessibility without compromising quality.

Moving Forward

With the project direction shifting, I took the initiative to redefine ForceGraph for a new context—designing an interface optimized for in-car use. This adaptation retained the core experience while integrating updated accessibility standards for safer interaction while driving.

Figma Prototype for Investor preview

Bridging the Gap to the Final Product

Before introducing the final product demo, we needed to adapt the design approach. While the previous mock-ups established a strong foundation, the development team leveraged prebuilt libraries and automation tools from my research to accelerate the build.

This shift allowed them to focus on functionality and scalability, resulting in a refined product that differs visually but remains aligned with the original design principles.

Closed-beta product showcase

Conclusion

This project evolved from ForceGraph’s original vision into a new direction, driven by investor interest. Adapting to shifting priorities made this one of the most dynamic and rewarding projects I’ve led.

Lessons

This experience reinforced the value of leveraging frameworks and automation to speed up development while maintaining design quality—an approach I’ll continue refining.

Future Steps

Next, we’ll refine, test, and iterate toward a Q4 2025 launch. However, as a startup, flexibility is key—the product may need to pivot again based on user feedback, market shifts, or investor needs.

Team Comments

How was your experience
working with Moe?

>

Yunfei, CEO:“I’m thrilled to have Moe on our team. He consistently delivers accessible and visually impressive products, and I look forward to collaborating with him on future projects.”

>

Winni, Product designer:“Moe is a pleasure to work with—highly creative and resourceful in any situation. Throughout this project and our previous presentation tool, he demonstrated exceptional attention to detail.”

>

Henrik, Front-end Engineer:“Moe is a breeze to work with, consistently delivering well-annotated designs that are easy to develop. The Forcegraph project was no exception to his high standards.”

More to see :)

Auto Finance Dealer

Password Required

Reducing Drop Rates and Improving the Flooring process

View Project

Sharpstakes

Designing AI-Powered Betting Solutions That Work for Users