Diamond Stone: design sketch
Rebuilt to read by picture first. Phone frames are real size. Sample data; stone, map and faces are stand-ins.
The visual language
Before and after, using the block you flagged. Then the six rules every screen now follows.
Staff app
Home for each role
Same shell, different first questions. Warehouse uses the larger size set for outdoor, gloved use; the driver's home is the job screen further down.
Records
Tap a total or any row to open it. Scroll inside a phone.
Lists, map, dashboard, forms
Accounts and reports
Sample figures. Every figure opens what it is made of, down to the document.
Added from the flow review
Screens the user-flow diagrams (user-flows.html) showed were missing. Each one is a step somebody could not have taken.
Back-to-back orders and what the customer sees
Ordered at the factory and delivered straight from there. Staff see the factory and the driver; the customer sees the city, an area, and their own contact.
Where content comes from
Photographs and facts captured during normal work, checked and masked automatically, then offered as drafts. Map and pipeline in content-map.html.
Asking customers for installation photos
Asked at the right moment, in one message they can answer with a photo, at most twice. Customers who are traders are treated differently: they are never asked about their own customers.
Social channels
Written, approved and scheduled here. Sent by the separate channel service. Results and replies come back here.
More of each role's work
Screens each role needs that were specified but not yet drawn. Use the role buttons at the top to see one role's whole app.
HR, in full
Every person's papers, time, leave and pay, with reminders before anything lapses.
Where AI helps
Always a suggestion with its reason and its source, one tap to accept or change. It never posts, approves or sends by itself.
Halo and Omnibar: arranging and modes
The person adds, removes and reorders rings; work can be put off or handed over but never removed. The Omnibar's further modes. Plan: SHELL.md.
US dollars and other currencies
A record stays in its own currency; the books stay in rials; the rate is locked on the record. Plan: CURRENCY.md.
Documents and terms
Every document is made from the record, fixed once issued, and shared as a link or a PDF. Terms are kept as versions and attached by rule. Sample wording only.
Catalogue: one stone record, everywhere
A stone is entered and changed in one place. Its names (ours, the market's, each supplier's), variants, facts and photographs feed the site, the store, quotes, purchase orders, documents and listings. Sample data. Plan: CATALOGUE.md.
Catalogue: a customer's name for a stone, as staff see it
The customer keeps their name for the stone from search to invoice. Only staff see which of our stones it is.
Catalogue: the names, in public
In the website's own look (SITE-DESIGN.md). One page per stone. It answers to whichever name the visitor came with, and never explains itself.
Website: the home page, top to bottom
In the website's own look (SITE-DESIGN.md). One long page shown as four screens of scrolling. Each part answers one question, in the order a stranger asks them. Stones and uses lead; the "For architects" links come lower, as the evidence advises. Plan: LANDING.md.
Website and portal: at a desk
The public site and the portal get a real layout for wide screens. The staff app stays phone only, except Money (below).
Website and portal: fields, a tablet, a desk
Every kind of field in the site's look, and the same pages on other screens.
Website: deciding and trusting
Pages that help a buyer choose between stones and judge the company. In the site's own look.
Website: what the best stone sites have, and ours lacked
Added after reading the sites of leading marble companies page by page (COMPETITORS.md). Each closes a gap, in the site's own look and by our rules: facts with sources, the true origin, nothing we cannot show.
Website and portal: WhatsApp, contact and chat
The word "WhatsApp", fixed in the action bar of every page: always on screen and under the thumb, like a floating button, without covering the page. One tap opens WhatsApp with the message ready. Every other way (chat here, a call, a visit) is under Contact, which is always in view. Plan: SITE-DESIGN.md section 21.
Website: things worth asking for
Lead magnets: each gives the visitor something made for them, and asks only for what is needed to deliver it. Everything about the stones stays free to read. Plan: MARKETING.md.
Website: the opening redrawn, and the pages that were missing
From the critique: the laid-out floor as the opening picture; proof high on the page; the public quote form; one sample flow that can be paid from abroad; the legal set; not found; a withdrawn stone; the consent notice; a full footer. Rows are now of three kinds: a link (arrow), a fact (a small mark), a choice (a circle that fills).
Website and portal: desk and Arabic sets
A grid, a form, an approval and a footer at a desk; a stone, a form, an approval and delivery day in Arabic, with the Arabic face on every level of text and no capitals or letter spacing.
Outdoor template: driver, warehouse, factory
For work done standing, in sunlight, with gloves: the role's own Halo, one action 92 px tall always in the same place, icon first, nothing that wraps, done steps small. Stage buttons are held, not tapped.
States that were not drawn
Loading, no permission, Arabic for staff, long names and large amounts, the keyboard open, and the three states of "done". Last: a proposal for the compact Halo.
Settings: everything configured in the app
Twelve groups. Every setting shows its value and where it came from. An override sits on the customer, supplier or order it belongs to. Money, security, privacy and masking need a second person. Every change is dated, recorded and can be put back. Plan: SETTINGS.md.
Suppliers: asking for prices, and registering
No supplier portal. A factory answers on WhatsApp or email as it does today; the system drafts, reads, reminds and compares, and a person approves every send and every choice. Registration in seven steps, by our person or by a link. Plan: SUPPLIERS.md.
Logistics: drivers, routes and papers
Orders go direct from the factory. Five routes; the least about each driver that the route needs; a checklist of papers by route and destination; loading witnessed; collection by a named person; originals held until paid. Plan: LOGISTICS.md.
Money: at a desk
The one exception to the phone-only staff app. The same Halo, the same command (the Omnibar as a field), the same records; laid out for a wide screen and a keyboard. Approvals and release of payments stay on the phone. Plan: MONEY-DESK.md.
Website and portal: tiles and slabs that match
The promise: one lot, a range approved first, the job laid out and approved before it ships, spare kept. No blocks are sold. Plan: MATCHING.md.
Matching: how staff do it
The lot is the unit of matching. The customer sees their range, their layout and their spare; tone groups, refusals and suppliers stay here.
WhatsApp, contact and chat: set from the staff app
Marketing: run from the staff app
Who came from where, what to follow up, what is planned, and who has agreed to hear from us.
Website: landing pages
In the website's own look (SITE-DESIGN.md). Built from the same few blocks as the home page. Each kind exists only when it has something of its own to say.
Website: learning, products and arrivals
In the website's own look (SITE-DESIGN.md). Pages the first plan lacked: a library of answers, guides, history, facts and articles; a page for specifiers; and how a stone page greets people arriving from a product result, a sample label or an AI answer. Sample wording. Plan: WEBSITE.md revision 2 and EDITORIAL.md.
Website and portal: everything managed from the staff app
Content and settings are changed here; the look is fixed in the design and cannot be changed from the app.
Website: managing it from the staff app
One place for pages, facts, articles, product listings and what people ask.
Installing the app
Staff install once, from Chrome only (Samsung Internet cannot install on current Android), before signing in. Customers are offered it after a useful moment and never need it. Drivers install nothing. Plan: INSTALL.md.
Signing in
Inbox: one contact, one place
Everything said with a person, on any channel, in one timeline. The team answers by WhatsApp or email from the same screen.
Messages, chat, help, notifications
Client portal
For a customer who is signed in. The website's look: a line of words with counts, and the same bar. No Halo. Approvals are the range, then the layout (drawn in full under "tiles and slabs that match").
Public website
Nobody is signed in, so there is no Halo. One action per page. Every page is built from the catalogue and is readable by search and answer engines without scripts.
Store
Samples ordered and paid for online.