Updated . Built against the tool’s current screens and checked step by step. How we check this lesson
Stop losing customer requests in a shared inbox. Build a customer form and a staff dashboard in Atoms for under two free credits, test it like a customer, and close the access gap our test found before anyone sees it.
At a glance
| Question | Answer |
|---|---|
| What you build | Stop losing customer requests in a shared inbox. Build a customer form and a staff dashboard in Atoms for under two free credits, test it like a customer, and close the access gap our test found before anyone sees it. |
| Tools | Atoms |
| Time | About 10 minutes, 28 steps in 5 parts |
| Level | Beginner, no coding needed |
| Cost | Free |
| Ways to learn it | Practice it step by step |
The 5 parts, in short
- Describe the app: Describe the app, Send the brief, Let it build.
- Test it like a customer: Read what it wrote, Check the footer, Send an empty form, See the form push back, and 4 more steps.
- Test it like your staff: Open the staff page, Read the error, Click Resolve, Let Alex explain it, and 3 more steps.
- Ask who can get in: Ask who can get in, Send the question, Read the answer, Tell it who is allowed, and 2 more steps.
- Clean it up: Fix what you noted, Send the fixes, Check the fix yourself, Stop before Publish.
Start here first: AI Receipt Extractor: Receipts to Google Sheets with n8n (module 1 of Business Automations)
In the course: Part 9 · n8n Automation Toolkit (Module 115 of the full course)
Part of: AI Apps Worth Knowing (step 110 of 111). Next up: Landbot: Build a Law Firm Intake Chat That Flags Urgent Deadlines
What you'll build
Maple Ridge Insurance Agency is a made-up small agency. Certificate requests, policy changes and billing questions land in one inbox, and an urgent one can sit for a day. In this lesson you build a customer form and a staff dashboard in Atoms, then test them the way a customer and a stranger would. Our test found a failed dashboard, a broken heading, invented business details, and a staff page any signed-in stranger could have read. You fix each one.
You built the app, tried it as a customer, fixed what failed, and asked the question that matters before launch: who can read this data? Before real customers use your version, sign in with your real staff email, confirm the queue opens, and remove the sample requests.
- Tools: Atoms
- Time: about 10 minutes, 28 steps in 5 chapters
- Level: beginner, no coding needed
- Price: free
Practice first, then build it for real
Practice copy built from real Atoms screens (atoms.dev), captured 31 October 2026 on the Free plan. Nothing here touches an Atoms account. The agency, its customers and the requests are made up. The app and the answers are what Atoms produced, and yours will differ. We stopped before Publish and could not sign in as the made-up staff account, so the allowed path was not tested. To build it for real you need your own Atoms account, and some services charge once you use them for real work, so check each tool's current pricing.
Try it yourself, free
Reading the steps is a start. Doing them is how it sticks. The interactive module walks you through every click in a practice copy of Atoms, checks each step, and never touches your real accounts.
Start “Atoms: Build a Request App, Then Lock the Staff Page”Step by step: Atoms: Build a Request App, Then Lock the Staff Page
All 28 steps of the interactive module, in order. In the module you watch each one, then do it yourself in a practice copy that checks your work.
1. Describe the app
- Describe the app. You run Maple Ridge Insurance Agency, a made-up small agency. Certificates, policy changes and billing questions all land in one inbox, and an urgent one can sit for a day. Describe a customer form and a staff dashboard, and say who must never see what. Leave the power setting on Free.
Requests land in one inbox, and an urgent one can sit for a day. Describe a customer form and a staff dashboard, and say who must never see what.
Build a service request app for Maple Ridge Insurance Agency, a small independent insurance agency. Customer page: a public form with name, email, policy number, request type (Certificate of insurance, Policy change, Billing question, Claim help), urgency (Normal, Urgent) and details. After submitting, show a confirmation with a request number. Staff page: a dashboard listing every request with its status (New, In progress, Done), counts by status, filters for type and status, and a way to change the status. Customers must never see the staff dashboard or other customers' requests.
- Send the brief. Click the arrow. Atoms names the project and starts working.
- Let it build. Alex, the engineer agent, writes a backend and two pages while you watch. You do not need to read the code. The first version used less than one credit in our test, and the Free plan gives you daily credits. Click the build view.
Atoms writes the backend and the pages while you watch. The first version used less than one credit in our test.
2. Test it like a customer
- Read what it wrote. It looks finished. Now read it. You never gave a phone number or opening hours, and it wrote (555) 014-8820 and Mon-Fri, 8:30a-5:00p. The page also promises a reply usually the same day. Click the phone number, and scroll to the bottom of the page.
It looks finished, so read it. You never gave a phone number or hours, and here they are.
- Check the footer. It says Independent since 1978, which is also invented. The right side says this form is not for new claims, but the Claim help button says you can start one. You will fix all of this at the end. Click the footer line.
Independent since 1978 is invented too. And the footer contradicts the Claim help button. You will fix these at the end.
- Send an empty form. A real customer will skip a field. Click Send request with everything empty.
A real customer will skip a field.
- See the form push back. Each missing field gets its own message, and the details box asks for at least 10 characters. This part passed. Click the message.
Each missing field gets its own message. This part passed.
- Fill it in. We typed a made-up customer, Jonah Reed, with an example.com email and a made-up policy number. Click Certificate of insurance. Then choose Urgent, because the landlord needs the certificate by Friday.
We typed a made-up customer.
- Send the request. The details say the office lease closes Friday, and the landlord must be named on the certificate. Click Send request.
- Spot the broken heading. The request went through, but look at the heading: it’s logged. That is a code showing where an apostrophe should be. A customer would see it. Click the heading, and scroll down.
It went through, but look at the heading. There is a code where an apostrophe should be. A customer would see that.
- Check the request number. The customer gets MR-2026-0007, plus the type, urgency and status. That is what you asked for. Click the number.
The customer gets a request number, plus the type, urgency and status. Good.
3. Test it like your staff
- Open the staff page. Now switch sides. Use the page picker above the preview, and click /staff.
Now switch sides.
- Read the error. All the counts say 0, and a red ValidationError fills the page. The request you just sent is not showing. This is why you test before anyone else does. Click the error.
All the counts say zero, and there is a red error. Your request is not showing. This is why you test first.
- Click Resolve. Atoms noticed the failure and put an Issue Report in the chat. You do not have to understand the error. Click Resolve.
Atoms noticed the failure and offers an issue report. You do not have to understand it.
- Let Alex explain it. Alex reads the error, says what went wrong and fixes it. This fix used about 0.2 credits in our test. Click the explanation.
Alex reads the error, explains it and fixes it, for about a fifth of a credit.
- Check the numbers. Now it shows 3 New, 2 In progress, 2 Done, 7 in all. Six of those are sample requests Atoms added on its own, so clear them before real use. Only yours is real test data. Click the counts, and scroll down.
Now the numbers show. But six of these are samples Atoms added on its own. Clear them before real use.
- Open your request. Jonah Reed is at the top, marked Urgent and New. Click the row.
Your request is at the top, marked urgent and new.
- Move it along. Everything the customer sent is here, including the Friday deadline. Click In progress. The badge and the counts at the top both changed. Reload your own copy once to confirm it stays.
Everything the customer sent is here.
4. Ask who can get in
- Ask who can get in. The most important test in this lesson needs no code. Your brief said customers must never see the dashboard. Ask directly, and tell it not to change anything yet.
This is the most important test, and it needs no code. Ask directly who can read this data, and tell it to change nothing yet.
Before I publish: exactly who can open /staff and read customer requests? Could any stranger who signs in with their own account see them? Answer first and change nothing yet.
- Send the question. Click the arrow.
- Read the answer. Alex says it plainly. A person who creates a throwaway account gets names, emails, policy numbers and full details for all customers, plus the ability to change statuses. The app looked locked because it asked for a sign-in, but any account could get through. Credit to Atoms: it told us as soon as we asked. Click the paragraph.
Alex says it plainly. Anyone with a throwaway account could read every customer's details. It looked locked because it asked for a sign-in, but any account got through. Good thing we asked.
- Tell it who is allowed. Alex proposes an allowed list of staff emails. Say yes and name the one account. We used a made-up address, so our own account would be refused. That is the test. Use your real staff email in your own app.
Say yes, and name the one staff account. We used a made-up one, so our own account would be refused. That is the test.
Yes, make that change. Only staff@mapleridge.example may open /staff or change a status. Anyone else who signs in should see a clear message that the account isn't a staff account.
- Send the fix. Click the arrow.
- Watch your own account get refused. This isn't a staff account. We were signed in with a real account that is not on the list, and the queue stayed closed. We could not test the allowed side, because the staff address is made up. In your app, sign in with your staff email and confirm the queue opens. Click the heading.
This is what you want to see. A real account that is not on the list gets refused. In your own app, also confirm your staff email gets in.
5. Clean it up
- Fix what you noted. Now go back to your notes: the broken heading, the invented details and the footer that contradicts the button. Put them in one message.
Now go back to your notes: the broken heading, the invented details and the footer. Put them in one message.
Fix the customer page: 1) The confirmation heading shows it’s instead of it's. 2) Remove the phone number, the opening hours, the email address, 'Independent since 1978' and 'usually the same day'. I never gave you those. 3) The footer says this form is not for new claims, but the Claim help button says start a claim. Remove that footer line.
- Send the fixes. Click the arrow.
- Check the fix yourself. We sent one more made-up request to check. The heading now reads properly, and the phone button is gone. Alex also reworded the heading and the Claim help text, so read those too. One line still says to call or email you, so give it real contact details or remove it. Click the heading.
We sent one more request to check. The heading reads properly now. Alex also changed some wording, so read it again.
- Stop before Publish. The invented details are gone. Publish is your call, and we did not click it. First: sign in with your staff email, clear the samples, and decide how staff will notice new requests, because nothing here alerts them yet. The pricing page also lists private projects and custom domains under Pro, so check that if you handle real customer data. Click Publish to finish this practice.
Publish is your call, and we did not click it. First confirm your staff email works, clear the samples, and decide how staff will notice new requests.
Screenshots
More in Business Automations
AI Receipt Extractor: Receipts to Google Sheets with n8nDrop a photo of a receipt into an n8n chat. An AI agent reads it, pulls out the date, vendor and amount, picks a category, and adds a row to Google Sheets.
Free · Live ~12 min Intermediate
n8n AI Email Responder: Draft Gmail Replies AutomaticallyBuild an n8n agent that watches your Gmail, reads each new customer email, and writes a reply as a draft in the same thread, ready for you to check and send.
Free · Live ~12 min Intermediate
Daily Job Alerts: Email Each Tech Their Jobs from Google Sheets with n8nEvery morning at 7, n8n reads a plumbing company's jobs sheet, skips anything not assigned yet, and emails each job to the tech it's assigned to — customer, address…
Free · Live ~10 min Intermediate
Gmail AI Triage: Auto-Label Every Email and Draft RepliesBuild an n8n workflow that reads each new email, sorts it as a lead, a client or an invoice with a Text Classifier, adds the matching Gmail label, and drafts a reply to…
Free · Live ~18 min Advanced
A Support Agent That Answers from Your Own DocsTurn an n8n chat agent into a support agent that answers only from your policies in a Google Doc, refuses what it should, and hands off to a person by email.
Free · Live ~13 min Advanced
Chatbase: Answer Customer FAQs with an AI AgentA business case for a small firm that answers the same customer questions every week: build a Chatbase AI agent on your FAQ in the real app, make it say when it does…
Free · Live ~15 min Beginner
All 26 modules in Business Automations
Terms in this lesson
Plain-English definitions, each with an example from a free lesson.