Dashboard prototype built with AI
Built a working dashboard prototype and handover package from real product constraints.
Problem
The existing statistics page relied on pie charts and unclear terminology, which made campaign outcomes harder to read. We had no dedicated UX/UI function in the company, so interaction design and usability decisions also sat with me. At the same time, implementation capacity was constrained, so a full redesign through the normal handover flow would be slow.
I needed a way to reduce delivery time without lowering clarity or implementation quality.
Approach
I used AI as a prototyping and coding partner, while I stayed responsible for scope, language, quality checks, and delivery decisions.
The workflow was:
- Define user-facing outcomes and terminology rules
- Iterate rapidly in browser on layout, chart behaviour, and interaction details
- Pressure-test edge cases (for example, many UTM sources and PDF export behaviour)
- Package the result for front-end implementation with explicit handover documentation
What I learned
AI-assisted delivery worked best when I kept product ownership explicit. I defined the constraints, validated the behaviour, and documented unresolved API questions clearly.
This project also confirmed that strong handover quality can be a direct time-saver for engineering, especially on UI-heavy work.
One thing that would have made the handover package better: read access to the codebase. I had to ask developers which API endpoints were used to calculate the statistics, which added a round-trip and left some questions open. If I had been able to read the source code with AI support, without changing anything myself, I could have used the actual endpoint logic and data shapes to produce a more accurate prototype and a tighter handover. The output would have required less back-and-forth from engineering to implement.
That is the broader point I took from it. Product owners with read access to the codebase can close a lot of the gap between what gets prototyped and what actually ships.
Prototype
I delivered a full handover package to reduce front-end implementation effort:
- Standalone working prototype (
statistics.html) - Angular component version (
.ts,.html,.css) - Technical handover documentation and terminology guidance
- Change log and quick-start documentation
Package size was about 149 KB across 10 files, with both standalone and framework integration options.
