Product Design

Instant answers from building code documents

Role

UI/UX Designer

Timeline

October - December 2025

Team

Salma El Gohary (Designer)
Keenan Yang (Designer)
Tia McQuaid (Project Manager)

Role

UI/UX Designer

Timeline

October - December 2025

Team

Salma El Gohary (Designer)
Keenan Yang (Designer)
Tia McQuaid (Project Manager)

Role

UI/UX Designer

Timeline

October - December 2025

Team

Salma El Gohary (Designer)
Keenan Yang (Designer)
Tia McQuaid (Project Manager)

Challenge

How can Trax increase the use of their AI tools?

Our goal was to design a more intuitive experience for building compliance officers searching for answers within 500+ pages of highly technical building code documents. We had just 8 weeks.

problem

Trax Copilot was hard to find…

…hidden away in dropdown menus, uncommon names, and a cluttered UI.

The experience felt a bit clunky, leading to users not knowing what Copilot could achieve. What should be a fast way to get information becomes a whole new task to learn how to use.

Solution

Trax Copilot Sidebar: Ask anything about a specific document

With just one click, you can open Copilot beside your documents and reference any part or ask a general question.

Design supports 43+ documents

The design is flexible enough to account for all sorts of documents and formats.

Search time reduced by 40%

Spend less time trying to find the relevant search result and checking if it is accurate.

15%+ projected increase in conversion of Pro users

Users can see what features are available in the Pro plan and see if it is suitable for them.

Research insights

4 types of search but no visual distinctions

Trax supports different types of searching depending on the expected results and the documents they are referencing. This lead to confusion on the responses and results afterwards.

Market Research

Other international platforms flesh out their AI-native features

When comparing Trax to similar platforms, it's clear they put more emphasis on their AI tools and integrate it into every screen.

Competitor analysis

Competitor analysis

Competitor analysis

A great copilot should…

Have context.

A question about a specific sentence or document will provide more helpful answers.

Communicate what it can do.

Not sure what you can ask it? Try some of our suggestions for an idea.

Be there when you need it.

Just one click away from accessing copilot can make or break its usage.

design process

We prioritized a simple, familiar interface

Users were either familiar with Trax's interface already or were used to looking through paper textbooks. A simpler design will guarantee higher usability.

Design Decisions

Send to Copilot

Want to ask about a specific sentence? Reference it in your answer

Separated from the navigation

Copilot and search were moved to the right side, leaving the main content in the center and the main focus.

Suggestions and prompts

Easily switch between keyword searching and AI searching through a toggle or a suggestion.

New global search options

Want to ask about the entire database? Search directly from the top nav bar or use Trax Copilot's new landing page for Pro members.

The Final design

A clean interface with AI-native features easily accessible

Reflection

What I learned

It's ok to say no.

Considering the time constraints and technical feasibility, we had to cut out some ideas that we liked but did not have enough time to prototype and test.

Copywriting needs testing early on.

Wording matters. By putting actual text instead of filler text, it made it easier to test if something is clear and help connect users to their actual workflow.

Create a free website with Framer, the website builder loved by startups, designers and agencies.