Software | One month | UX lead

How do we build a AI Chat bot?

UL Solutions needs to protect its data, but the work flow of the Subject Matter Experts, SMEs, could benefit from having AI to find documents, client information, and other data records. UL Solution wants to create its own internal AI chatbot to help the SMEs while maintaining privacy.

Research: Current AI chatbots

What is everyone else doing?

How do current popular chat systems set up its chatbot? When and how does the chat start a section or tab?
Note: Claude did not exist at the time of this project.

ChatGPT

The number one most used AI (at the time of working on this project)

Messaging: Your messages are in a chat bubble, its messages are in open space.

Chat Tab: Created and auto-named as soon as your type into a new chat space. The chat section is visible unless you close the sidebar.

Microsoft Copilot

The current AI being used at DH Solutions

Messaging: Your messages are in a chat bubble, its messages are in open space.

Chat Tab: Created and auto-named as soon as your type into a new chat space. The chat section is not visible on first launch, you need to know it exists and open it.

Google Gemini

Typically embedded at the top of searches but does have its own seperate chat system.

Messaging: Your messages are in a chat bubble, its messages are in open space.

Chat Tab: Created and auto-named as soon as your type into a new chat space. The chat section is not visible on first launch, you need to know it exists and open it.

Research: Interviewing our users

What do our SMEs really want?

While UL Solutions has multiple SMEs teams, I want to focus on the research team who would use the chat the most. This SMEs research team is repsoibsle for finding all the regulations in one or more countries on a specific topic, like electrical outlets, to ensure the products are up to specific country standards.

Is there any feature or convince you wish the current AI (Copilot) had?

One woman mentioned that the PDFs they upload have the serial codes on them and sometimes that makes it hard to remember what is was. She would like a little paragraph summary under the file upload. The group agreed that its a feature they'd like to see.

Do you prefer seeing your sidebar immediatly opened when you enter the chat?

Overwhelming the answer was 'yes' and this is because of them typically building off previous asks or needing to review past work before starting fresh.

Sketch and Ideate

What is going to work?

How do we take the best of the chats while including the features the SMEs want to see?

Wireframes

I wireframed using pen and paper because this isn't a difficult UI and I knew I could be quick to ideate.

Chat bubble: Copilot doesn't use a chat bubble for the messages to UI but Gemini and ChatGPT do. I like the chat bubble because it helps give seperation between your typed message and the AI response.

Side Panel: I also thought about having a side panel that the SMEs could use their UL Solutions work screens and have the AI open in a side panel instead of going to a seperate tab. While it's an idea liked by the SMEs it was going to be too far out of scope and could be explored later.

Digitalize the wireframe

From paper to a better visual to use in conversation with stakeholders

This wireframe is what I took to the business team to make sure we got the approval before building in all the small details like how to add chats into a folder.

Final Product

What's after launch?

While I was able to deliver a quick turn-a-round project without much pushback, I did have the idea I wanted to explore of the side panal. In my sign-off with the business I reintroduced the idea and we agree to add time in a spirit for building a prototype that could be used for taking to SMEs. If the idea has positive feedback then we could slate it in for another quarter.