Tripbooks design system / lab 14 / command bar and notifications

Lab 14 / the two surfaces that are always there

One asks, one tells.

The command bar runs on all one hundred routes and is the only place a person addresses the platform in their own words. The notification centre is the only place the platform addresses them. Between them they are the whole conversation, and both had never been designed.

They share one idea, which is the same idea running through the rest of the system: show the reasoning, not just the result. The command bar echoes what it understood before it acts on it. A reminder shows the rule it fires on rather than a date somebody typed. In both cases the alternative is a box that behaves mysteriously, and mysterious is expensive when money is involved.

01 / the command bar

At rest, it offers what you were doing.

Six hundred and forty pixels, centred, entering at 140ms with five pixels of rise. It carries the active entity as a chip, because a search that silently spanned two sets of books would be the worst kind of quiet error.

Search, jump to a reference, or type what you want Northline Travel LLC
Recent
Marchetti Group · Kyoto incentive, autumn board offsite BKG-7QP2K4M9
Sterling Capital Group · corporate, 47 bookings CCN-1001
Fulfilment queue · 11 open, 5 already broken
Suggested
New enquiryE
Search flights · marketplaceF
↑↓moveopenrefineescclose

02 / the idea that makes it work

It shows you what it understood.

The platform's search box is asked four completely different kinds of question, and the failure mode is a person typing a route and getting a text match on a customer called Nairobi. So the bar parses first and prints the parse back as tokens before it shows a single result. If it read you wrong, you can see it read you wrong.

A reference · one answer, no ambiguity

bkg-7qp2 Northline Travel LLC
read as booking reference
Marchetti Group · issuing, 6 of 9 items, departs in 25 days BKG-7QP2K4M9
open the bookingsearch text instead

A route and a date · this is a live supplier search, not a text match

lhr nrt 14 sep 2 adults Northline Travel LLC
read as from LHR London Heathrow to NRT Tokyo Narita 14 Sep 2026 2 adults no return
Search flights, one way · live rates from the marketplace
Attach to a quotation · pick one after the results
run the searchadd a returndrop the last token

Plain words · everything at once, grouped and labelled

marchetti Northline Travel LLC
read as text · 6 matches
Customers
Marchetti Group · corporate, Italy, key account CCN-1055
Ms. Sofia Marchetti · individual, prospect ICN-2074
Trips
Kyoto incentive, autumn board offsite · issuing TRP-4KM2XN8Q
Milan showroom week · completed Jun 2026 TRP-9BX3L7QD
Travellers · 2 more
Marco Marchetti · passport valid to 2031 TRV-0041
opensearch only customers
The dashed token is the important one

"No return" is printed as an unfilled token rather than left silent, because the difference between a one way search and a return search is thousands of dollars and the person typing did not say which they meant. Every token the parser did not find, but could have used, is shown empty and is one keystroke from being filled. A parser that only reports its successes is a parser that hides its guesses.

03 / the notification centre

Two different things that every product mixes up.

A notification says something happened and you may have missed it. A reminder says something will happen and somebody asked to be told. They have different tenses, different severities and different lifespans, and putting them in one list is why notification centres get muted.

Notifications

Happened7 Will happen12
Today
Payment reversed09:41
$12,400.00 was reversed on Sterling Capital Group after four items had already issued. The booking is exposed and issuance is blocked.
BKG-1MC8V4TAOpen the incident
Ticketing limit inside 3 hours08:15
Four flight items on Marchetti Group. Two travellers still have expired passports.
BKG-7QP2K4M9Open fulfilment
Hotel confirmation landed07:03
Park Hyatt Kyoto returned HTL-99204817. The voucher released automatically.
ITM-7WB3N8LM
Rate moved on a sent quotation06:30
Suiran Kyoto fell $310.00. A rate sub-version v1.2.1 was minted and the customer has not been told.
QUT-5RD9K3WPReview the chain
Yesterday
Quotation accepted17:22
Marchetti Group signed v1.2 electronically. The booking was created and the deposit invoice raised.
QUT-5RD9K3WP
Undercut cleared14:08
Huda Aziz cleared the Park Hyatt Kyoto item at 2.0% against an 8.0% floor.
ITM-7WB3N8LM
Access requested11:47
Olivia Bennett asked to read a private customer you manage.
ICN-2044GrantRefuse
Severity uses the same edge as the queue, and unread uses a ground

Nothing new was invented. Already broken is a solid leading edge, about to break is hatched, and unread is the paper ground rather than a dot or a bold weight, because a bold weight would fight the record names and a dot would be a third thing to learn. When a row is read it simply becomes card white, which is the quietest possible way for a state to leave.

04 / the reminders half

A reminder is a rule, not a date.

This is the part of the platform's doctrine that has no equivalent in a normal calendar. A person does not want to be told on 25 August. They want to be told three days before the hotel's free-cancel deadline, and if that deadline moves, the reminder moves with it. Some anchors have no date at all: "when the supplier confirmation arrives" fires on an event that may never happen.

Reminders

Happened7Will happen12
Anchored to a deadline
Chase the balanceNorthgate Equity
Before the hotel's free-cancel window closes, so a cancellation is still free if they go quiet.
3 days beforethefree-cancel deadline fires 25 Aug
Re-price if unacceptedHalloran & Co
Airline fares are not held by us, so an unaccepted quotation is worth re-checking before it expires.
24 hours beforethequotation expires fires 22 Aug
Anchored to an event · no date exists
Send the travel packMarchetti Group
The pack is incomplete until every supplier reference has landed, so there is no date to put here.
whenevery item is confirmed 7 of 9 so far
Ask for the reviewMarchetti Group
After they are home, not after the invoice is settled.
2 days afterthelast item ends fires 23 Sep
Recurring
Board meeting weekMarchetti Group
This account books its travel around the quarterly board meeting, so this is when to call.
every quarteron thefirst Monday fires 5 Oct
New reminder
Tell me 3 days before the free-cancel deadline
on BKG-9WD3R7KP · Northgate Equity
This will fire on 25 Aug 2026, and it will move if the deadline does.
There is no date field anywhere in that builder

That is the whole design. A typed date is a copy of a fact that lives somewhere else, and copies go stale silently. The builder offers the anchors the record actually has, computes the date from them, and prints the computed date underneath so nobody has to trust it blindly. The one sentence at the bottom, and it will move if the deadline does, is the entire product difference stated in nine words.

The laws

N1Happened and will happen are separate lists

Different tenses, different lifespans, different actions. A notification is dismissed and gone; a reminder is edited, snoozed or cancelled, and it exists until its anchor resolves.

N2A reminder stores its rule, never its date

The date is always computed and always re-computed. If a deadline moves, every reminder anchored to it moves. Nothing in the platform stores a date a person typed for something the system already knows.

N3Every row names its record

A notification without a reference is an anecdote. The reference is shown, in mono, and it is the link.

N4Severity is the same edge everywhere

The queue, the attention rail and this panel share one mechanism. A person learns it once and reads it in three places.

N5The bell counts what is broken, not what is unread

Nineteen unread items is not information. Two things already broken is. The dot on the bell is the count of critical rows, and everything else waits quietly.

Three, then the overlay layer

All three are consequential and cheap to change now.

  1. The parse echo. The command bar prints what it understood before it acts, including the tokens it did not find. It costs a row of chips and it is the difference between a search box people trust with a route and one they only use for names.
  2. No date field on a reminder. Anchors only, with the computed date shown underneath. This is the strongest position in the lab and the one most likely to get pushback from somebody who just wants to type a date. My answer is that a typed date is a copy that goes stale in silence, but it is your call whether a free date anchor exists as a last resort.
  3. The bell counts broken, not unread. Nineteen unread is noise; two broken is information. It means a person can leave things unread forever without the interface nagging, which is either the right respect or the wrong permission depending on how your team works.