At a glance
Aunoo turns news, research and social media into signals a team can act on. It was built before anyone designed it: users were dropping off, and the team struggled to work inside it. I built one UI system for its three apps. In internal testing, 4 of 4 people now finish the daily analysis, up from 1 of 4.
Role & team
Sole product designer, working with one developer and open-source contributors. From the first audit to internal testing.
Timeline
2 months
An analyst opening Explore saw every card shout at once: tags, a summary, a credibility note, leads and six buttons, all at the same weight. Stakeholders told us users were dropping off, and even the team found the product hard to work in.
Each screen made its own choices about color, spacing and controls, so Operations HQ, Anticipate, Explore and Gather felt like four products. Accessibility had never been part of the work, and it showed on every screen. With one designer and outside contributors adding pages, each new screen drifted further from the last.
Three screens from before the rebuild. Each picks its own colors, buttons and spacing.
The brief: fix the UX without stopping the product
There was no blank canvas and no pause button. People used the product every day and the developer and contributors kept shipping. Three questions shaped the work.
Q1
Where do we start, when every page has problems?
Q2
How does one developer build to a system that doesn’t exist yet?
Q3
How do pages stay consistent when open-source contributors write some of them?
Time was tight, and halfway through, a team member quit. Fixing pages one at a time through Figma handoffs would have taken months, and we had two. I took responsibility for the gap and changed how we would build the new experience.
Design in code instead of Figma
I considered handing Figma files to the developer page by page, but each page would have waited weeks for a build. Instead I designed directly in code, using Claude to build. The first screens showed me the risk: without rules, AI fills gaps with guesses.
Radix over a ready-made kit
A styled kit would have been faster to start with, but Aunoo would look like every other product built on it. Radix is open source like Aunoo, handles keyboard behavior in tabs, menus and dialogs, and leaves the styling to us. It cost more work up front.
Rules before screens
So I wrote the rules by hand: tokens, components, contrast and keyboard behavior. Charts never rely on color alone. One shared library feeds all three apps, every change is checked against each of them, and new tokens stay “proposed” until I review them.
Start with Explore, then rebuild everything
Stakeholders said users got stuck in Explore, so I redesigned it first. The new page leads with who the briefing is for, then what is collected and why, and only then the articles. Once it worked, we rebuilt the rest of the interface in one pass.
Analysts compare sentiment, timing and market signals across hundreds of articles. Every chart pairs color with a label and a number, and the distribution charts switch to a bar chart or a plain table. Anticipate lists every trend in words under its chart, so nobody has to decode a radar to get the point.
Testing is still in progress. So far we have run internal sessions with four colleagues, each doing a daily news analysis, the core task in Aunoo. The same four people used both versions, so some of the gain may come from knowing the task.
TASK SUCCESS
Lost in buried filters
On the old interface, one person in four finished the daily analysis. The other three got lost: the filters they needed were buried inside other filters, and button text was too low in contrast to read.
What changed
I moved the three most-used filters into the top bar, and every button now meets WCAG AA contrast. All four finished on the rebuilt interface.
ERROR RATE
Wrong and missed fields
Testers typed into the wrong fields and skipped required ones: 12 errors across 4 sessions.
What changed
Each case traced to a UI bug in the fields. After the fixes, errors dropped to 0.
PAIN POINT
A crash wiped five minutes of work
A tester configured topics for five minutes, then the page crashed and lost every selection.
What changed
We fixed the crash and added Save draft, so topic setup is never lost again.
The first screens we built followed no rules, and fixing them took time a short document would have saved. The surprise: those written rules ended up doing more for consistency than any mockup. Next time they come before the first screen.
Not done yet: testing with real users, automated tests, real data and a proper component catalog. Internal sessions show the core task now works; the next round will show whether it holds for customers.