A picture for every state of the app that has no data to show: 37 states, read from the app’s code, served by 22 pictures. Each state is shown where it sits, with the sentence the app shows today. The sentence stays; the picture and, where it helps, a line saying where the first row comes from are the proposal.
The pictures are drawn on one 200 × 140 grid in the app’s tokens: a 2 px line in the action green, the primary and Land tints for fills, grays for what is missing, the status colors only for an error, a sun and a planted flag. They are still: a state is read, not watched. In a list, a panel or an auth card they show at 140 px, on a page area at 200 px; below, side by side, all at one size.
Not in the app yet. What adding them would take is item 9 of App changes. The Not found page has six fuller pictures of its own on the Not found page.
Side by side
Every picture at one size, and how many states each serves. A picture that serves several states says the same thing in each: an empty register, a name badge, an open field.
Empty plan 2 statesEmpty rail 3 statesCard index 1 stateNo one yet 2 statesEmpty register 3 statesNothing matches 2 statesBlank board 1 stateHard hat 1 stateName badge 2 statesUnsigned 1 stateOpen list 1 stateQuiet line 1 stateNo score 1 stateOpen field 2 statesAll clear 3 statesSunrise 1 stateOpen calendar 1 stateTorn sheet 2 statesClosed gate 1 stateDoor ajar 1 stateFlag planted 4 statesSignpost 1 state
The rules
The sentence is the app’s. Every sample keeps the words the code shows today. Where a line is added under it, it says where the first row comes from, with the name of the button that adds it.
One line, two tints. The action green for the line, primary-100 and the Land tint for fills, gray-300 for what is missing or not yet there. No other color unless the state is an error (crit), all clear (a warm sun) or done (good).
Still. No movement in an empty state. The Not found page is the one place that moves, because it is a whole screen.
Three sizes. 200 px for a page area, 140 px in a table or a panel, 140 px above the title on an auth card. Never smaller: below 100 px the lines merge.
Not everywhere. Loading, inline facts, locked fields and form bars stay text; the last section says why.
1. Empty lists
Proposed
The six list pages with no rows yet, and the same lists when the filters or the search match nothing. The first kind is seen once, on a fresh system; the second is seen every day. The sentence is the app’s; a line under it says where the first row comes from.
Leads Overview, no leads yet
Site
Stage
Region
Owner
There are no leads yet.
The first one comes in through New lead.
Where
/leads, the table
Today
"There are no leads yet." in the table’s empty row.
Picture
Empty plan
Opportunities Overview, none yet
Site
Stage
Deal type
Fee
There are no opportunities yet.
A Lead becomes one when it is Instructed.
Where
/opportunities
Today
"There are no opportunities yet."
Picture
Empty rail
Accounts Overview, none yet
Account
Type
Contacts
Live deals
There are no accounts yet.
Add the first one with New account.
Where
/accounts
Today
"There are no accounts yet."
Picture
Card index
Contacts Overview, none yet
Name
Job title
Account
Phone
There are no contacts yet.
A contact belongs to an account; add it from there or with New contact.
Where
/contacts
Today
"There are no contacts yet."
Picture
No one yet
Interest register, none yet
Buyer
Site
Stage
Since
There are no live interests yet.
A buyer added to a deal shows here.
Where
/registers/interest
Today
"There are no live interests yet."
Picture
Empty register
Offers register, none yet
Buyer
Site
Offer
Stage
There are no offers yet.
An offer recorded on a buyer shows here.
Where
/registers/offers
Today
"There are no offers yet."
Picture
Empty register
Filters match nothing
Site
Stage
Region
Owner
No leads match these filters.
Where
Every list page, with a filter set
Today
"No leads match these filters." and a Clear filters button. The same on the other five lists.
Picture
Nothing matches
Search finds nothing
Account
Type
Contacts
Live deals
No accounts match these filters.
Nothing is called "Greenfield". Check the spelling, or clear the search.
Where
/accounts and /contacts, with a search
Today
The same sentence as a filter: "No accounts match these filters." The search counts as a filter.
Picture
Nothing matches
2. On a record
Proposed
A panel on a Lead, an Opportunity, an Account or a Contact with nothing in it yet. These are small: the picture is 140 px and sits in the panel, and the sentence stays the app’s. The panels that can be filled from the page keep their Add button beside the picture.
Buyers tab, no buyers
Buyers
No buyers on this deal yet.
Partnerships adds the first with Add buyer.
Where
/opportunities/:id/buyers
Today
"No buyers on this deal yet." as a gray sentence.
Picture
Blank board
Contractors tab, no tenders
Tenders
No contractors on this deal yet.
Construction invites the first with Add contractor.
Where
/opportunities/:id/contractors
Today
"No contractors on this deal yet."
Picture
Hard hat
Key Contacts tab, none
Key contacts
No key contacts on this deal yet.
Where
/opportunities/:id/key-contacts
Today
"No key contacts on this deal yet."
Picture
Name badge
Legals tab, no tasks
Legal progress
No legal tasks on this deal yet.
Where
/opportunities/:id/legals
Today
"No legal tasks on this deal yet." There is no way to add one: the demo’s tasks come from the seed.
Picture
Unsigned
Follow-up tracker, no actions
Next actions
No actions yet.
Add action puts the first one here.
Where
Lead and Opportunity pages
Today
"No actions yet."
Picture
Open list
Activity timeline, nothing logged
Activity
No activity yet.
Log activity records the first call, email, meeting or visit.
Where
Lead, Opportunity, Account and Contact pages
Today
"No activity yet."
Picture
Quiet line
Recommended buyers, none to score
Recommended buyers
No Buyer / RP accounts to score yet.
Where
The Opportunity page, Buyers tab
Today
"No Buyer / RP accounts to score yet."
Picture
No score
Landowner account, no sites
Sites owned
No sites yet.
Where
/accounts/:id, Sites owned
Today
"No sites yet."
Picture
Open field
Buyer or Contractor account, on no site
Deals
Not on any site yet.
Where
/accounts/:id, the deals panel
Today
"Not on any site yet."
Picture
Open field
Account, no contacts
Contacts
No contacts yet.
New contact adds the first.
Where
/accounts/:id, Contacts
Today
"No contacts yet."
Picture
No one yet
Contact, on no deal
Opportunities involved
Not a Key Contact on any deal yet.
Where
/contacts/:id, Opportunities involved
Today
"Not a Key Contact on any deal yet."
Picture
Name badge
Contractor account, no bids
Bid history
No bids with this outcome.
Where
/accounts/:id, Bid history, with an outcome picked
Today
"No bids with this outcome."
Picture
Empty register
3. All clear
Proposed
The dashboards and the Morning Meeting Board with nothing to flag. This is the good kind of empty, and the picture should say so: a mug, a sunrise, a flag planted. The sentences are the app’s.
Deals requiring attention, none
Deals requiring attention
Nothing needs attention.
Where
The Individual dashboard
Today
"Nothing needs attention."
Picture
All clear
Stalled deals, none
Stalled deals
No deal is stalled.
Where
The Executive dashboard
Today
"No deal is stalled."
Picture
All clear
Legal blockers, none
Legal blockers
No legal blockers.
Where
The Executive dashboard
Today
"No legal blockers."
Picture
All clear
My actions, none open
My actions
No open actions for your function.
Where
The Individual dashboard
Today
"No open actions for your function."
Picture
Flag planted
Overdue follow-ups, none
Overdue follow-ups
No follow-ups are overdue.
Where
The Land role card
Today
"No follow-ups are overdue."
Picture
Flag planted
My deals, none
My deals
You have no open deals.
A deal you own, or one with an action for your function, shows here.
Where
The Individual dashboard; Open deals on the Executive one
Today
"You have no open deals." / "No open deals."
Picture
Empty rail
Exchange forecast, no dates
Exchange forecast
No target exchange dates.
Where
The Individual dashboard
Today
"No target exchange dates."
Picture
Open calendar
Morning Meeting Board, nothing on it
Deal
Next deadline
Open actions
Health
Nothing on the board today.
Every Active Opportunity shows here; there is none.
Where
/morning-meeting, both views
Today
An empty table.
Picture
Sunrise
Role cards, nothing waiting
Leads awaiting contact or appraisal
No leads are waiting on you.
Where
The Back Office, Partnerships and Construction cards
Today
"No leads are waiting on you." / "No deals are in the buyer stages." / "No tenders in progress."
Picture
Empty plan
Funnel, no deals
Funnel conversion
No deals yet.
Where
The Executive dashboard
Today
"No deals yet."
Picture
Empty rail
4. Errors and access
Proposed
A page that could not load, a page a role may not open, and an address that does not exist. Today the first two are a red bar at the top of an otherwise empty page; the picture takes the page area and gives the way out.
A page could not be loaded
Leads couldn’t be loaded.
The server did not answer. Refresh the page to try again; if it keeps happening, tell the team.
Where
Every page that reads the API: the lists, the records, the board, the dashboard
Today
A red bar: "Leads couldn’t be loaded. Refresh the page to try again." (and "This lead", "This account", "The board", "Your account").
Picture
Torn sheet
Only an admin may open this
Only an admin can create staff users.
Ask the admin to add the new colleague.
Where
/staff/new for a Valere role
Today
A red bar: "Only an admin can create staff users."
Picture
Closed gate
Page not found
Page not found
Six fuller pictures for this page are on the Not found page.
Where
Any address no route matches, or a removed record
Today
The Not found page: "Page not found", two sentences, the actions.
Picture
Signpost
5. Session and done
Proposed
The auth pages: a session that ended, a reset link that is broken, and the two things that finish well. These sit on the auth card, so the picture is small and above the title.
Signed out when the session ended
Valere CRM
You were signed out.
Your session ended. Sign in again to carry on where you were.
Where
/auth/sign-in, after a failed token refresh
Today
Nothing: the app returns to Sign in without a word.
Picture
Door ajar
Reset link without its token
Valere CRM
This reset link is incomplete.
Open the link from the email again, or ask for a new one.
Where
/auth/restore-password opened without ?token
Today
A red bar: "This reset link is missing its token."
Picture
Torn sheet
Password updated
Valere CRM
Your password is updated.
Sign in with the new one.
Where
/auth/restore-password, after a successful reset
Today
The success mark above the title, and a Sign in link.
Picture
Flag planted
Password changed from My account
Valere CRM
Password changed.
You are signed out everywhere. Sign in with the new password.
Where
/account
Today
A green bar, then the session ends and Sign in opens.
Picture
Flag planted
6. Where there is no picture
States a sentence serves better. They are listed so the question is settled, not forgotten.
State
Where
Why no picture
Loading
"Loading leads…" in the table, the dash in a tile
A picture would appear and vanish in under a second; movement where nothing has happened yet.
Inline facts
"No landowner yet", "No address yet", "No contact yet", "No job title", "No phone or email", "No next action", "None open"
One value in a row of values. The sentence in gray is the right size.
Locked fields
"Set by Land. Read only for Construction." and the admin’s "Read only."
The lock line names the owner; that is the information. A picture would say less.
Score popovers
"No score: the deal is closed", "No open next action", the Buyer match and Buyer health notes
A popover is a reading of a number; it stays text.
Form errors and successes
"Wrong email or password.", "Profile saved.", "Staff user created. …", a field that could not save
The bar sits by the form, which stays on screen for the next try. A picture would push the form down.