oneStrukt
Live Example Blueprint

This is what
a blueprint
looks like.

QuickBite — a food delivery app. Described in plain language. Returned as a complete, production-grade system spec with every screen, flow, API, and edge case defined.

26Screens
7Screen groups
24API endpoints
8Reusable components
🍔

QuickBite

Food Delivery App

MobileiOS · Android

Connects users with local restaurants. Browse menus, place orders, track deliveries in real-time, pay seamlessly.

500+
Restaurants
30 min
Delivery
5★
Rated

7 Screen Groups · 24 Screens

Every screen fully specified. Click any screen to see what an AI prompt looks like.

Onboarding Flow

First-time user introduction, location permission, and value proposition slides

4 screens
First-time userNo auth required
9:41

Splash Screen

Brand entry point

QuickBite

Loading...

Auto-nav

Checks auth token validity, then routes to Welcome or Home feed based on session state.

GET /auth/validate-token

Splash

Auto-navigates based on auth token

9:41

Welcome

Hero onboarding — slide 1 of 3

Food you love, delivered fast.

Order from 500+ local restaurants.

Illustrated hero with page dot indicator. Primary CTA: "Get Started". Secondary: "I already have an account".

Welcome

Value proposition entry

9:41

Feature Highlights

Slides 2 & 3 of 3

500+ Restaurants

Slide 2

Swipe →

Craving pizza, sushi, or a salad? Grid of restaurant logos with wide selection messaging.

Track your order live.

Slide 3 — Final

Animated map illustration. Driver moving toward home pin. Dual CTA: "Create Account" and "Sign In".

Feature Slides

Swipeable feature showcase

9:41

Location Permission

Request device location access

Find restaurants near you.

Map illustration with pulsing blue dot. Explains why location is needed. Falls back to manual address entry if denied.

GET /restaurants?lat&lng&radius=5km

Location

OS permission dialog trigger

Authentication

Login, signup, OTP verification, and password reset

4 screens
SecurityRequired
9:41

Login

Email, password & social sign-in

Email & Password

Input fields: Email + Password (show/hide toggle). Forgot Password link. Sign In CTA.

POST /auth/login

Social Sign-In

— or continue with —

OAuth

Google, Apple, Facebook buttons. Stores auth_token + refresh_token in local storage on success.

POST /auth/google · /auth/apple

Login

Supports Google, Apple, Facebook

9:41

Sign Up

Create account — Step 1 of 2

Create New Account

Fields: Full Name, Email, Phone (country code picker), Password, Confirm Password. Terms & Privacy checkboxes.

POST /auth/register · /auth/send-otp

Sign Up

Multi-field registration form

9:41

OTP Verification

Phone number confirmation

Enter verification code

We sent a code to +1 ***-***-4521

SMS

6-box OTP input (auto-focused). Countdown timer "Resend in 0:45". Resend link activates after timer. Verify CTA disabled until 6 digits entered.

POST /auth/verify-otp

OTP

6-digit SMS code entry

9:41

Forgot Password

Reset link via email

Reset your password.

Email input with envelope illustration. "Send Reset Link" CTA. Navigates to reset screen via email deep link.

POST /auth/forgot-password

Reset

Password recovery entry

Main Application

Core daily-use screens: home feed, search, restaurant detail, and cart

6 screens
CoreAuthenticatedDaily use
9:41

Home Feed

Personalized restaurant discovery

🍕 Pizza Palace

Italian · ⭐ 4.8 · 22 min

20% OFF

Featured near you. Delivery fee $1.99. Min. order $15. Open now.

0.3 mi away

🍣 Sakura Sushi

Japanese · ⭐ 4.9 · 35 min

Popular

Top rated in your area. Free delivery on orders over $30.

0.7 mi away

🍔 Burger Bros

American · ⭐ 4.6 · 18 min

Reorder

Order Again — your last order: Double Smash Burger + Fries.

0.2 mi away

Home

Promotions, categories, nearby restaurants

9:41

Restaurant Detail

Menu + info + cart entry

Pizza Palace

Sticky menu tabs: Popular · Starters · Mains · Drinks

Collapsing hero image. Rating, delivery time, delivery fee in info row. Heart icon to favorite.

GET /restaurants/{id}/menu

Margherita Pizza

Popular · $14.99

Fresh tomato sauce, buffalo mozzarella, basil. + button to add to cart.

Pepperoni Special

Popular · $16.99

🔥 Best Seller

Double pepperoni, extra cheese, oregano drizzle. Customer favourite.

Restaurant

Collapsing hero, sticky category tabs

9:41

Item Detail

Customize & add to cart (modal)

Pepperoni Special

Choose Size (required)

Radio: Small $14.99 · Medium $16.99 · Large $19.99. Extras: Extra cheese +$2, Jalapeños +$1. Special instructions field (140 char).

Quantity stepper + running total

Item Detail

Bottom sheet, 75% screen height

9:41

Cart

Order summary & checkout entry

Your Order — Pizza Palace

Cart items with quantity stepper and delete. Promo code field.

POST /promo/validate

Pepperoni Special (Lg)

Qty: 2 × $19.99

$39.98

Extra cheese, Jalapeños. Line total: $39.98.

Order Total

Breakdown

Subtotal $39.98 · Delivery $1.99 · Service $2.50 · Tax $4.35 · Total $48.82.

Cart

Items, promo, pricing breakdown

9:41

Checkout

Payment & order confirmation

📍 123 Main St, Apt 4B

Delivery address · Edit

ASAP delivery (28 min est.) or Schedule Later. Date/time picker for scheduling.

💳 Visa ···· 4521

Expires 09/27 · Default

Change → payment method sheet. Apple Pay / Google Pay quick options.

POST /payments/stripe/payment-intent

Total: $48.82

By placing your order you agree to our terms. PCI-DSS compliant via Stripe.

Checkout

Address, timing, payment, place order

Order Tracking

Real-time status updates and live driver location

3 screens
Real-timePost-orderWebSocket
9:41

Order Confirmed

Success screen with ETA

Order Placed! 🎉

Order #QB-20481

~28 min

Lottie checkmark animation. Estimated delivery: ~28 min. Order summary card below.

Confirmed

Lottie animation + order summary

9:41

Live Tracking

Map view with driver location

🗺️ Driver En Route

Google Maps — Live driver pin

8 min away

Animated scooter icon + route polyline. Order status stepper: Received → Preparing → Picked Up → On the Way → Delivered.

WS: /ws/orders/{id}/tracking

Marco D. · ⭐ 4.9

Toyota Yaris · QB-3421

Driver info card with photo. Contact Driver button: call or in-app chat.

Live Map

WebSocket updates every 5s

9:41

Order Delivered

Delivery confirmation & ratings

Enjoy your meal! 🍔

Your order from Pizza Palace has arrived.

Rate the restaurant and the driver separately with interactive star components. Optional text review field.

Delivered

Dual rating: restaurant + driver

Orders History

Order list with active and past tabs, and order detail view

2 screens
HistoryAuthenticated
9:41

My Orders

Active · Past tabs

Pizza Palace · Active

Pepperoni Special + 1 more

On the Way

Status: On the Way. Driver 8 min away. Track Order button.

Sakura Sushi · Past

Feb 18 · 3 items · $52.40

Delivered

Dragon Roll, Miso Soup, Edamame. Delivered on time. Rated ⭐⭐⭐⭐⭐.

5 days ago

Orders

Paginated, pull-to-refresh

9:41

Order Detail

Full breakdown — #QB-20481

Order #QB-20481

Pizza Palace · Delivered

Delivered

Pepperoni Special (Lg) ×2 · $39.98 Delivery $1.99 · Service $2.50 · Tax $4.35 Total: $48.82

Paid: Visa ···· 4521

Order Detail

Receipt view with help link

Profile & Settings

Account management, addresses, payments, and preferences

3 screens
AccountConfiguration
9:41

Profile

Account overview & nav hub

Alex Johnson

alex.johnson@email.com

Stats: 48 Orders · 12 Favorites · 31 Reviews. Menu: Addresses, Payment Methods, Notifications, Dietary Preferences, Help, About.

GET /users/me

⚠️ Sign Out

Destructive

Confirm dialog. Clears auth_token + refresh_token from local storage. Navigates to Login.

Profile

Stats, menu links, sign out

9:41

Address Book

Saved delivery addresses

🏠 Home · Default

123 Main St, Apt 4B, New York, NY

Default

Pinned at top. Swipe left reveals Edit and Delete. Set as Default toggle.

🏢 Work

350 Park Ave, Floor 12, New York, NY

Secondary address. Tap to select as delivery address.

GET /users/me/addresses

Addresses

Swipe left to edit / delete

9:41

Payment Methods

Cards, wallet & digital pay

💰 QuickBite Wallet

Balance: $12.50

$12.50

Add Money button. Instantly applied to next order as discount.

Visa ···· 4521

Expires 09/27 · Default

Set Default or Remove via kebab menu. Apple Pay and Google Pay shown if device supports.

DELETE /payments/methods/{id}

Payments

Stripe integration, wallet balance

Help & Support

In-app chat, FAQ, and issue reporting

2 screens
SupportAuthenticated
9:41

Help Center

FAQs, quick actions, live chat

📦 Issue with current order?

Order #QB-20481 is on the way

Active Order

Quick actions: Order is late · Wrong item · Missing item · Contact driver.

FAQ — Orders

How do I cancel my order? What if my driver doesn't arrive? How do refunds work?

GET /support/faqs

Help

Context-aware if active order

9:41

Support Chat

Live in-app chat with agent

QuickBite Support · Online

Agent: Sarah K.

🟢 Online

Hi Alex! I see your order #QB-20481 from Pizza Palace. How can I help you today?

Just now

Type a message...

Send text, attach photos (to document wrong/missing items). Pinned order reference card at top of conversation.

WS: /ws/support/chat/{sessionId}

Chat

WebSocket, attachments, order context

Ready to build?

Your app. Fully architected.
Before you write a line.

Describe your idea. Answer a few questions. Get a complete blueprint like this one, every screen, every flow, every edge case, ready for any AI builder.

Create your blueprint → See pricing