I’ll walk you step-by-step like a workshop you can follow live
👉 Goal: Queue System App (Call Next / Finish / Auto Flow)
🚀 🧩 OVERVIEW (What you’ll build)
At the end you will have:
-
📱 Queue list (waiting)
-
📢 Now Serving screen
-
🔘 Button: Call Next
-
🔘 Button: Finish
-
🔁 Auto move queue
🧱 STEP 1: Create Google Sheet (Foundation)
Create Sheet: Queue
Columns:
Column Type Description ID Text Key Name Text Customer name QueueNumber Number Running queue Status Text Waiting / Serving / Done CreatedAt DateTime Time
| Column | Type | Description |
|---|---|---|
| ID | Text | Key |
| Name | Text | Customer name |
| QueueNumber | Number | Running queue |
| Status | Text | Waiting / Serving / Done |
| CreatedAt | DateTime | Time |
🔥 IMPORTANT FORMULAS
ID (Key)
UNIQUEID()
QueueNumber
👉 (optional simple version: manual first)
⚙️ STEP 2: Create AppSheet App
-
Go to AppSheet
-
Create App → From Google Sheet
-
Select your Queue table
Go to AppSheet
Create App → From Google Sheet
Select your Queue table
🧠 STEP 3: Configure Columns (VERY IMPORTANT)
Status Column
-
Type: Enum
-
Values:
Waiting
Serving
Done
Type: Enum
Values:
Waiting
Serving
Done
CreatedAt
-
Initial value:
NOW()
Initial value:
📱 STEP 4: Create SLICES (Best Practice)
🔹 Slice 1: WaitingQueue
[Status] = "Waiting"
🔹 Slice 2: ServingQueue
[Status] = "Serving"
🔹 Slice 3: DoneQueue
[Status] = "Done"
📊 STEP 5: Create Views
🟢 View 1: Waiting List
-
Table / Deck
-
Source: WaitingQueue
-
Sort by QueueNumber ASC
Table / Deck
Source: WaitingQueue
Sort by QueueNumber ASC
🔵 View 2: Now Serving
-
Detail View
-
Source: ServingQueue
Detail View
Source: ServingQueue
👉 Show only 1 row (top)
🟣 View 3: Dashboard
👉 Combine:
-
Now Serving
-
Waiting List
⚡ STEP 6: ACTIONS (Core Learning 🔥)
🟢 ACTION 1: “Call Next Queue”
Type:
👉 Data: set the values of some columns
Target:
👉 Referenced Row
🔥 Expression (IMPORTANT)
ANY(
ORDERBY(
SELECT(Queue[ID], [Status]="Waiting"),
[QueueNumber],
TRUE
)
)
ORDERBY(
SELECT(Queue[ID], [Status]="Waiting"),
[QueueNumber],
TRUE
)
)
Set this:
Status = "Serving"
🔴 ACTION 2: “Finish Queue”
Type:
👉 Data: set the values
Status = "Done"
🟡 ACTION 3: “Auto Next Queue”
Type:
👉 Grouped Action
Steps:
-
Finish current
-
Call next
Finish current
Call next
🎯 STEP 7: SHOW ONLY WHEN (Pro Trick)
Show “Call Next” ONLY when no one is serving:
COUNT(SELECT(Queue[ID], [Status]="Serving")) = 0
Show “Finish” ONLY when serving:
[Status] = "Serving"
🧠 STEP 8: UX IMPROVEMENT (Make it feel real)
🔥 Add Format Rule
-
Serving → Green
-
Waiting → Yellow
-
Done → Gray
Serving → Green
Waiting → Yellow
Done → Gray
🚨 STEP 9: TEST (IMPORTANT!)
Test cases:
✅ Add 3–5 queue
✅ Press Call Next
✅ Press Finish
✅ Check auto flow
💥 STEP 10: BONUS (Make it WOW)
Add:
🔊 Sound Alert
👉 Use:
-
Automation (Bot)
-
Send notification
📺 Big Display Mode
👉 Create view:
-
Show ONLY Serving
-
Large text (UX setting)
🧠 BEST PRACTICE (VERY IMPORTANT)
1. Use ONE Status Column
👉 Don't create multiple flags
2. Always SORT Queue
👉 QueueNumber OR CreatedAt
3. Split Actions → Then Group
👉 Easier debug
4. Think like “State Machine”
Waiting → Serving → Done
🎯 WHAT YOU JUST LEARNED
-
Action (set value)
-
Action (execute on another row)
-
Grouped Action
-
Slice design
-
UX logic control
Action (set value)
Action (execute on another row)
Grouped Action
Slice design
UX logic control
🚀 NEXT LEVEL (If you want)
I can guide you to upgrade this into:
✅ Ticket machine (auto number)
✅ Multi-counter queue
✅ QR check-in system
✅ POS + Queue system

ليست هناك تعليقات:
إرسال تعليق