Cars&Co

OWN PROJECT / 2026

The Cars&Co start screen on desktop with the phone version overlapping it, on a light grey background: fleet figures in four tiles, critical alerts grouped by type and today's tasks, in a dark interface with a lime primary button.
The Cars&Co start screen on desktop with the phone version overlapping it, on a light grey background: fleet figures in four tiles, critical alerts grouped by type and today's tasks, in a dark interface with a lime primary button.

SCOPE

ux/ui design

information architecture

design system

ai workflow

SCOPE

ux/ui design

information architecture

design system

ai workflow

INDUSTRIES

fleet management

HIGHLIGHT

135 screens designed in an AI workflow, now in development

PREVIEW

view in Figma

→

01

/ 05

The Cars&Co start screen on desktop with the phone version overlapping it, on a light grey background: fleet figures in four tiles, critical alerts grouped by type and today's tasks, in a dark interface with a lime primary button.

ABOUT

Cars&Co is a fleet management system for company cars, a web app for desktop and mobile. It replaces a spreadsheet with up to 47 columns per car, where nothing showed what was overdue or who was handling it. Version one covers 12 cars and is planned to scale to around 200. It is my own project: I work in fleet operations, so the requirements came from the job, not from a brief. The whole thing was made in an AI workflow. I made the design decisions, Claude Code ran file audits and bulk changes in Figma through a custom plugin. The result is 135 screens and a token based design system. The project is now in development.

ABOUT

Cars&Co is a fleet management system for company cars, a web app for desktop and mobile. It replaces a spreadsheet with up to 47 columns per car, where nothing showed what was overdue or who was handling it. Version one covers 12 cars and is planned to scale to around 200. It is my own project: I work in fleet operations, so the requirements came from the job, not from a brief. The whole thing was made in an AI workflow. I made the design decisions, Claude Code ran file audits and bulk changes in Figma through a custom plugin. The result is 135 screens and a token based design system. The project is now in development.

CHALLENGES

The first version of the start screen tried to do everything: alerts, tasks and a Gantt chart of the whole fleet. I split it. Start answers one question, what needs a reaction today. The timeline got its own page, Forecast, where each car is a row and overlapping tasks stack in lanes. Color follows one rule across both: it appears only where it means something. Event types have their own colors, red means overdue and nothing else, lime is reserved for the primary action. Even the today line is neutral.

The wireframes looked finished before they were. An audit of the file showed that none of the six user flows ran end to end on consistent data, and no desktop screen was built on auto layout. I fixed that before any visual work: one car carries every flow, every action has a state after it, all 135 screens sit on auto layout and a 4 px grid. A second check before hi-fi caught color pairs below WCAG AA and statuses with no token assigned. There is no user testing yet. That is the next step, alongside development.

CHALLENGES

The first version of the start screen tried to do everything: alerts, tasks and a Gantt chart of the whole fleet. I split it. Start answers one question, what needs a reaction today. The timeline got its own page, Forecast, where each car is a row and overlapping tasks stack in lanes. Color follows one rule across both: it appears only where it means something. Event types have their own colors, red means overdue and nothing else, lime is reserved for the primary action. Even the today line is neutral.

The wireframes looked finished before they were. An audit of the file showed that none of the six user flows ran end to end on consistent data, and no desktop screen was built on auto layout. I fixed that before any visual work: one car carries every flow, every action has a state after it, all 135 screens sit on auto layout and a 4 px grid. A second check before hi-fi caught color pairs below WCAG AA and statuses with no token assigned. There is no user testing yet. That is the next step, alongside development.

The Cars&Co view map from FigJam on a dark background: a global navigation bar on top and seven colored columns of notes below it, one per view, from the start screen to the forecast.

view map, FigJam

The header of the vehicle card shown twice on a light grey background: the grey low fidelity wireframe above and the dark hi-fi version below, with the licence plate WX4821K as a chip and colored alert badges.

wireframe to hi‑fi, vehicle card

Three before and after figures from the file audits on a dark background: 999 to 0 spacing values off the 4 px grid, 0 to 98 desktop screens built on auto layout, 0 to 6 user flows that run end to end on consistent data.

file audits, before and after

The Forecast view on a lime background: a week timeline with one row per car, task bars colored by event type, a dashed bar for an unassigned task and a white line marking today.

forecast, week view

The task list with the details panel open on a light grey background: status, car, deadline, service, assigned user, attachments and comments for the task Naprawa zderzaka.

tasks, details panel

A design system board on a dark background showing tokens in use: buttons, four stat tiles, alert rows with licence plate chips, event type bars and status badges in the Grafit theme.

design system in use

Four Cars&Co mobile screens in phone frames on a light grey background: the start screen with alerts, the vehicle card, the documents and deadlines tab, and a bottom sheet for editing the OC insurance deadline.

mobile flow, editing a deadline

The Cars&Co view map from FigJam on a dark background: a global navigation bar on top and seven colored columns of notes below it, one per view, from the start screen to the forecast.

view map, FigJam

The header of the vehicle card shown twice on a light grey background: the grey low fidelity wireframe above and the dark hi-fi version below, with the licence plate WX4821K as a chip and colored alert badges.

wireframe to hi‑fi, vehicle card

Three before and after figures from the file audits on a dark background: 999 to 0 spacing values off the 4 px grid, 0 to 98 desktop screens built on auto layout, 0 to 6 user flows that run end to end on consistent data.

file audits, before and after

The Forecast view on a lime background: a week timeline with one row per car, task bars colored by event type, a dashed bar for an unassigned task and a white line marking today.

forecast, week view

The task list with the details panel open on a light grey background: status, car, deadline, service, assigned user, attachments and comments for the task Naprawa zderzaka.

tasks, details panel

A design system board on a dark background showing tokens in use: buttons, four stat tiles, alert rows with licence plate chips, event type bars and status badges in the Grafit theme.

design system in use

Four Cars&Co mobile screens in phone frames on a light grey background: the start screen with alerts, the vehicle card, the documents and deadlines tab, and a bottom sheet for editing the OC insurance deadline.

mobile flow, editing a deadline