1. Overview

Cutting through the noise

For two years, I was an integral par of the UX/UI product team at Roller Technic, tasked with transforming a complex B2B dashboard into something sharp, smart, and actually enjoyable to use.

My mission: blend AI-powered search, seamless shipping tools, and automated support into a single platform that made sense, no matter how tangled the business logic got. Here’s how I navigated the chaos, made design decisions stick, and brought a little intelligence to every click.
Company
Roller Technic
2. Role

Into the deep end

Switching gears from video production and marketing, I dove headfirst into the world of UX/UI at Roller Technic.

My mission: untangle complexity and bring clarity to a fast-paced B2B dashboard where speed and automation rule.

I partnered up, learned fast, and kept the team moving forward. Especially when it came to weaving AI into the everyday workflow.

Outcomes

Conversational AI Search

Users can ask questions in plain language and get instant, visual answers. Whether it’s a revenue breakdown or a year-over-year comparison, the data is always at their fingertips.

AI-First Support

Support is now proactive and intuitive. The AI hub delivers instant answers, smart documentation search, and a smooth path to human help when needed. Every interaction is designed for clarity and ease.

Integrations and Automations

The dashboard connects seamlessly with tools like Google Drive, Airtable, Power BI, and Zapier. Everything works together, turning the platform into a true command centre.

Shipping Dashboard

Shipping information is clear and accessible. Users can quickly check shipment status, carrier details, and linked orders, all in one place.

Warranty Claims, Upgraded

The claims process for rollers and CNC machines is now AI-powered. Reporting, tracking, and resolving issues is faster and more transparent, making life easier for everyone involved.
3. Key challenges

Making complexity simple

Challenge

Managed a full slate of projects at once:

  • Charts and table upgrades

  • Conversational AI search

  • Warranty claims automation

  • Shipping dashboard redesign

  • AI-driven support

  • Workflow integrations

Each project brought its own mix of stakeholders, shifting priorities, and technical puzzles. The B2B pace demanded both speed and polish

Solution

Used a 70-20-10 focus split to stay sharp:

  • 70% of effort on top priorities (AI search, charts and tables, claims)

  • 20% on secondary projects (shipping dashboard)

  • 10% on everything else (support, integrations)

Kept the framework flexible—always ready to pivot as needs changed.

4. UX design

My spin on familiar

Yes, I borrowed from the best—Jakob’s Law, YouTube’s layout—but I wasn’t interested in just another “familiar” dashboard. I wanted users to feel like they’d upgraded, not just settled in. That meant obsessing over the details: a font you never have to squint at, icons that actually help, and colours that make data pop without screaming for attention.

Problem

  • Limited Resources: Tight deadlines, lots of moving parts, lean team.

  • Collaboration Hiccups: Needed smoother handoffs between design and dev—especially as AI features moved fast.

  • Testing on the Fly: Without time for formal research, we relied on rapid prototyping and real-world feedback.

Solution

  • Trusted Patterns: Used proven UI components to cover most needs right away.

  • Design Tokens: Established a unified look and feel, speeding up both design and development.

  • Prototype, Test, Repeat: Quick iterations meant smarter releases and fewer surprises.

Payoff

  • Quicker Launches: With 70% of the basics handled, we could focus on the 30% that made a real difference.

  • Iterate Where It Matters: More time for the details users actually notice.

  • Better Feedback: Early, frequent, and actionable.

UX strategy

70% familiar

Our strategy: make the dashboard feel like a tool users already know (Jakob's Law). Sticking to familiar patterns minimised the learning curve and boosted user confidence from the first click.

30% fresh

But the difference is in the fresh details. Crisp typography, smart spacing, and clear content transform complex data into something users can actually use—and enjoy.

Design foundation

Boring, but brilliant

No time for endless research? No problem. I went straight to what works: familiar patterns, proven layouts, and zero guesswork for users. Inspired by YouTube’s clarity, I built a dashboard that feels instantly comfortable—so users can dive in, get things done, and maybe even smile at how easy it all is.

The UX model (YouTube)

The design

Typography

We picked Nunito for its clean readability and sharp character set.

Iconography

IBM Carbon Icons gave us a huge library, seamless integration, and quick workflows.

Data visualisation colours

Classic signals—green for go, orange for caution, red for stop—made insights obvious at a glance.

Grid layout

A flexible 1,440px grid with a 1,016px container, and a mobile layout inspired by YouTube, ensured it looked sharp everywhere.

Tiny tweaks.
Big results.

We sweated the small stuff—because in data design, the tiniest adjustments can turn confusion into clarity.

No More Number Fuzz: I swapped out confusing digits for crystal-clear ones—think slashed zeroes and unmistakable 1s—so you can scan a table without squinting.

Digits That Behave: Used open-form numbers and fixed-width spacing, so every column lines up and every trend stands out. No more wobbly KPIs.

KPIs That Snap Into Place: No more messy columns—fixed-width numbers mean every metric lines up with military precision. Trends jump out, comparisons make sense, and your eyes never have to work overtime.

Alignment That Makes Sense: Names left, numbers right. It’s the fastest way to compare, spot outliers, and get on with your day.

Dates Without Drama: Localised formats, everywhere. Whether you’re in Melbourne or Munich, you’ll know if 09/10 is September or October.

Green Days, Made Obvious: Shipping’s cleanest and busiest moments are highlighted—peak days and green milestones jump out, so the team can act, not guess.

Categorical Colours: Ten distinct hues—every status or team stands out.

Sequential Colours: Colour ramps make trends and totals pop, tuned for light and dark themes.

Diverging Colours: Contrasts spotlight what’s up, down, or needs attention.

The fresh 30%

With the basics locked in, the UI details turned property data into something genuinely useful.

Charts

Three sizes—small, medium, full—kept data readable and beautiful, balancing density with clarity.

Tables

Our tables handled everything: invoices, project management, claims, orders, inventory. Instead of reinventing, we upgraded off-the-shelf tables with smart tweaks for clarity and scan-ability—no bloat, no extra dev cost.
4. Closing

Closing

This project pushed my adaptability and focus, delivering growth in unexpected ways. Here are the highlights.

Highlands

  • Key Contributor: Helped shape the dashboard’s UX, weaving advanced AI features into every layer.

  • AI at the Core: Enabled users to “talk to their data”—ask questions and see instant, visual answers.

  • Smarter Claims: Built an AI-powered warranty claims system for industrial parts, streamlining the process.

Lessons learned

  • Trusted Patterns: Leaning on proven UI patterns and components covers most needs right out of the gate.

  • Design Tokens: A unified design language speeds up everything.

  • Prototype, Test, Repeat: Quick feedback cycles make for smarter, more resilient releases.

Tools used