Facilio Helpdesk

What it is

A helpdesk for facilities and property-management teams, where the work is done by three AI agents you configure rather than three teams you staff. An Intake agentanswers the phone, WhatsApp, email, and a web widget, taking the request in the caller's own words and raising a ticket. A Dispatch agent reads that ticket against policies you wrote in plain English and recommends — or auto-assigns — the right technician. A Feedback agent closes the loop after the fix.

Wrapped around the three is one operational surface for the humans: an Inbox of every conversation with transcripts, recordings and tone; a Tickets list; a Technicians directory; Contacts; and Ask AI, which searches the whole thing and deep-links you into it. I led design, copy, and the frontend across all eleven modules.

Answers every channel, in the caller’s own words

Phone, WhatsApp, email, and a web widget — the agent takes the request as it’s spoken and raises the ticket.

The right technician, with the reasoning shown

Matched against policies you wrote in plain English — score, runners-up, and every step on the surface.

Closes the loop after the fix

You author the survey and the escalation rule that turns a poor rating back into an open ticket.

Where the humans watch it all and take over

Inbox, Tickets, Technicians, Contacts — and Ask AI, which searches everything and deep-links you in.

The problem

A facilities team's front door is a phone number and an inbox. A tenant calls about an AC unit; someone retypes what they heard into a ticket, losing detail on the way. Someone else guesses which technician is free, close enough, and actually certified. Then nobody asks whether the fix landed — unless the tenant calls back angry.

Three handoffs, all manual, all lossy. The product's bet: replace each handoff with a configurable agent, and give the team one place to watch all three and correct them when they're wrong. So the design problem was almost never “what should this screen look like.” It was how do you get someone to hand a tenant call to an AI, and keep them in control once they have.

URL in, agent out

An intake agent only works if it knows the business — buildings, services, tenant types, regions, assets. That's a long form, and it's the very first thing a new customer meets. A blank six-field screen on day one, before any value is shown, is where trials go to die.

So the first screen makes a promise before it asks for anything — “Your Facilities, on Autopilot. Finally.” — then asks for one thing: your website URL. “Finally” is the load-bearing word; it speaks to someone who has already tried to solve this and is tired. You watch it crawl — rotating status lines keep a genuinely slow read feeling attended-to — then land on “Here's What We Found”: company, segments, services, tenant types, assets, regions, all pre-filled, all editable. The whole contract sits in one subtitle: “Edit any field — your changes always win.”

Every field is a question, not a label: “What's your company name?”, “Who are your tenants?”, “What assets do you manage?”— because the screen is a conversation about your business, and it quietly sets up the product's whole premise: you configure this thing by describing your work in your own words. Nothing is client-side state either — every keystroke autosaves, so a resumed session lands exactly where you left it, and the failure case is a first-class view, not a toast: “We Couldn't Read Your Site”, retry or fill it in yourself.

Then: prove it works before asking anyone to trust it

Submitting is a build, not a spinner — “Configuring your AI agent”drops you into Ask AI rather than an empty dashboard, because the useful first move is asking the product something, not surveying a bare helpdesk. And the very first thing after that isn't a feature tour — it's an offer to hear the thing you just built. You verify your phone number, and your own agent calls you: six OTP cells, one button — “Verify & call me.”

That's the highest-conviction moment in the whole product and it costs thirty seconds — nothing on a welcome screen competes with an AI agent phoning you and handling a maintenance request in your own language. It's skippable (“Explore My Own”), because a demo you can't decline is a hostage situation. The first thing a customer does is correct an agent that already understands their business, not build one from nothing.

Screen to addOnboarding — the "Here’s What We Found" step, pre-filled chips across six questions with the "your changes always win" subtitle
Screen to addPost-onboarding — the "Verify & call me" screen: six OTP cells and one button, where your own agent phones you to demo itself

Configuring a personality

The Intake agent is the biggest configuration surface in the product, and what it configures isn't settings — it's behaviour. How it sounds, how it opens, what it's allowed to handle, where it draws the line, when it hangs up.

So the General tab is ordered the way a call unfolds — Identity, Greeting, Behaviour, Scope of Work, Scenarios, end condition, closing message — with Actions deliberately last, because everything above is who the agent is and that's what it can do. Read the section subtitles as a sequence and you've been taught the mental model of a voice agent without a line of documentation.

The hardest field gets the most help: Scope of Work has a template library for the common case and a Draft-With-AI path for the long tail. Voices are cards you preview by ear, not names in a dropdown. And publishing is explicit — one Save And Publish, disabled until something changed, because agent behaviour is live to callers and shouldn't drift on autosave.

Closing the feedback gap

The config sits on the left; a phone mockup sits on the right — and it isn't a mockup of a call. It captures your microphone, streams to the agent over a socket, plays the response back, and prints the transcript as it goes. A real conversation with the agent you just configured, in the browser, no phone involved. That collapses the loop from edit → save → find your phone → call → hope down to edit → save → talk.

Screen to addIntake General tab — the conversation-arc sections on the left, with the live call playground on the right

Trusting an AI assignment

Dispatch is the moment the product asks for real trust. Telling a dispatcher “we've assigned Marcus to this job” asks them to accept a judgment they can't inspect — and a dispatcher who can't audit a decision will override it every time, which means the automation buys nothing.

So the entire reasoning is on the surface, not in a tooltip. The card leads with its own state — “Atom recommends” when it's awaiting your click, “Auto-assigned” when it already acted — then discloses three things: a confidence score stated as a number (“96% match”, not “high”); the ranked runners-up with their scores, so the winner is legible and the override is one scored click; and “How Atom decided”, the six steps the engine actually walked, each rendered only if the backend produced real reasoning for it.

The technician profile is a scorecard, not a contact card — first-time-fix rate, SLA compliance, skills rated 1–5, certifications, territories — exactly the attributes the engine ranks on, so the explanation and its data live in the same vocabulary. The dispatcher's job shifts from making every assignment to auditing them.

Screen to addRecommendation card in a ticket — "96% match", ranked "Other matches", and "How Atom decided" expanded into its reasoning steps

Rules without a rule builder

Dispatch policies are genuinely complex — severity thresholds, certifications, after-hours behaviour, travel distance, workload, cost ceilings. The conventional answer is a visual IF/THEN builder, which is miserable and caps expressiveness at its own grammar. The opposite — a text box that returns a black box — is easy to write and impossible to trust. And this rule decides who gets sent to a gas leak.

So: write prose → get structure back → simulate before you trust it. You describe the policy in plain language; the AI returns not prose but four labelled blocks that mirror how the engine executes — when it applies, who's eligible (a hard filter), how they're ranked (weighted bars summing to 100%), and assignment. That split between a hard filter and a weighted score is the one thing worth teaching, and the layout teaches it without documentation.

Then a playground: pick a real ticket, run the policy, see the technicians it recommends with a Top matchbadge — validated against reality before the rule ever touches a live request. It's the piece of thinking from this project I'd most want to reuse.

Screen to addPolicy breakdown — the four labelled blocks with weighted-score bars, plus the simulation playground picking a real ticket

Tickets

Every request the agents raise — from a call, WhatsApp, email, or the web widget — lands in one Tickets queue: one list, one row, one detail pane, one set of filters, so there's a single count of open work the whole team can trust.

The AI summary is the ticket's headline, credited “Summarized by Atom,”with the raw conversation always one chip away — nobody triages from a five-minute transcript. The detail opens as an overlay that slides over the table rather than reflowing it, so you can open six tickets in a row without losing your place. Attachments stay read-only: they're the caller's evidence, not yours.

The Tickets queue and a ticket’s detail overlay — Atom’s summary up top, its recommended technician and the reasoning behind it inside.

Contacts

Contacts is the directory behind every conversation — everyone the desk has spoken to, searchable by name, email, or phone. A caller who rings twice is one record, not two strangers, with their details and activity kept together in one place.

Contacts — the people directory behind every conversation.

Ask AI

Ask AI searches the whole product in plain language and answers with the work itself — ask about tickets, technicians, policies, or trends and it comes back as the real records, each one a deep-link into the right filtered view rather than a paragraph describing them. Every conversation is kept in the rail, so you can pick a thread back up instead of re-asking.

Ask AI answering across the whole product — open tickets ranked by urgency, each one a deep-link, with your past chats in the rail.

Designing and building the same screen

Two windows, one screen. On the left, Figma — where I rough out the structure and hierarchy and nothing more: what sits next to what, roughly how much room each thing needs. On the right, Cursor — where that layout becomes the real thing in code, with Claude doing most of the typing while I keep the calls on whether it's right.

There's no handoff between the two, because there's nobody to hand off to — and that turns out to be the point. The decisions I care most about here only survive when the same person designs and builds: how a screen moves and how fast it feels — an optimistic jump into a drafting state, a response that streams without shoving the page around. A static frame can only show those at rest, which is the least interesting moment. So I build what I design, and judge it running.

The loop, in one frame — I lay out the structure and hierarchy in Figma (behind), then build the real thing in code in Cursor with Claude doing most of the typing (front), while I keep the design calls.

Voice and tone as a system

I wrote the copy and treated it as part of the interface. Four rules did real work. Never name the state — name what to do about it: a busy phone number reads “In use by ‘Front Desk Agent’. Remove it from there to use it here,” not “Occupied.” Empty states teach the model: “Your workforce lives in the tools you already use — set up a data source and your technicians sync in here.”

Borrow the user's vocabulary per channel:a call has a “Duration”; an email thread was “Closed in” three days. And ban the wrong noun outright — the people calling a facilities desk are occupants and requesters, never “customers.” Every rule has a reason attached, which is what makes it usable by someone else.

How I actually worked

I'm a product designer. I didn't become an engineer — I stopped needing one to find out whether an idea was any good. The loop is rough layout in Figma → build the real thing in code with AI → judge it running. Figma is where the thinking happens now, not where the design is finished: structure, hierarchy, what sits next to what. I stopped producing pixel specs, because a spec exists to transfer a design to someone else and there was nobody to transfer it to.

The real work happens in the browser — not a preference, a requirement of what this product is: almost everything hard here moves.A voice agent answering a call, tokens streaming into a scroll container, a fifteen-second crawl that has to hold attention, a card expanding into six reasoning steps. A static frame only tells you what those look like at rest, which is the least important moment. The judgments I'm proudest of here — anchoring the prompt instead of chasing the scroll, navigating optimistically into a drafting state — are ones I could only make with the thing running in front of me.

AI writes most of the code— implementation velocity, the parts of frontend that are knowledge rather than judgment. It removed the tax that used to make a designer's idea “too expensive to try.” What I keep is the problem framing, the information architecture, the interaction model, the copy, and the call on whether the result is actually right. Ask AI to build a dispatch policy editor and you get a rule builder with condition rows — competent, conventional, and the wrong answer.

So the risk is specific: AI is fastest at producing the average version of any interface.It has read every settings page ever written and will happily hand you one, which makes resisting the generic default a real part of the job. It held up because the product is live with facilities teams and I could act on real feedback the same day I heard it — not lab studies, but the shortest distance from “this confuses people” to a fix in production I've had in my career.

What I'd take to the next thing

Explainability is an interface problem, not a model problem. The score, the runners-up, and the reasoning steps were design decisions — and auditable is the only version of AI automation that gets adopted.

Prose in → structure out → simulateis the most reusable pattern here: natural language for input, structured rendering so the interpretation is inspectable, a sandbox to verify before it's live. Draft, don't demand — reduce first-run setup to correcting a good guess. And perceived speed is design material, the one that most needs the designer's hands on the code.