A guided walkthrough.
Fifteen chapters covering everything a first-time user needs to know — from creating a list four different ways, through the AI surfaces, sharing, store layouts, and walking mode. Mockups are built from the real SwiftUI source.
Chapter 01
Welcome to GroceryApp.
The Grocery Lists tab is your home base. Every list shows its item count and how many need restocking, plus a sharing indicator if it's collaborative.
- ●The bottom tab bar has four destinations: Lists, Shop, Stores, More.
- ●The floating bottom bar holds the search field and the new-list button — that + icon is a clipboard with a small plus badge.
- ●Tap it to open a menu with four ways to start a list (chapter 02).
Grocery Lists
Grocery Lists
Chapter 02
Four ways to start a list.
After picking an option from the menu, you'll see a clean form with just a name field, an icon grid, and a color grid. Tap Save for an empty or copy list, or Next for Import CSV / Ask AI to continue to the next step.
- ●Empty — start with a blank list and add items manually.
- ●Copy — duplicate an existing list with a sub-screen to choose which items.
- ●Import CSV — multi-step wizard with duplicate detection.
- ●Ask AI — opens the prompt builder (chapter 03).
Chapter 03
Ask AI to seed a list.
Pick "Ask AI" → fill out the list details → tap Next. The prompt builder opens with the title Build AI Prompt. Pick a provider, describe what you want, and tap the purple action button to send.
- ●Provider chips at top: Apple Intelligence (on-device when available), Claude, ChatGPT, Gemini, Share….
- ●Action button text changes per provider: "Generate (On-Device)" for Apple, "Open Claude" for Claude, etc.
- ●"About how many items?" is a hint — the AI may return slightly more or fewer.
- ●Tap Prompt Preview to see the exact text that will be sent.
Roast chicken dinner for 4, sides & dessert
Generate about 15 items as CSV with columns:
name, category, quantity, units, notes
Categories: Produce, Dairy, Meat, Bakery, Frozen, Pantry, Beverages, Snacks, Household, Personal Care, Other
Output only the CSV. No commentary.
Chapter 04
Add items.
Open a list to see your items. The segmented picker at the top filters between All, In Stock, and Need to Buy. The quick-add field below it accepts plain text — type and hit return.
- ●Tap any item row to open the full editor (chapter 05).
- ●Items group by category, each with an icon header.
- ●The toolbar has Plan with AI (✦) and Share for the list itself.
- ●The bottom-bar + opens a menu with five ways to add — see mock B.
Weekly Groceries
Chapter 05
Every item, fully editable.
Tap any item row to open the editor. Quantity uses big +/− buttons for the on-hand and target counts. Toggle Custom Restock Threshold to override the global threshold for this item alone.
- ●The ✦ button next to Category is "Suggest Category" (chapter 06).
- ●"In Freezer" is only enabled when "In Stock" is on — frozen items always route last.
- ●Multiple stores supported per item — each gets its own aisle pin.
- ●Sections continue below: Notes, In Stock, In Freezer, Photo, List, Added by, Delete Item.
Chapter 06
Categorize with one tap.
Tap the ✦ next to Category in the item editor. Apple Intelligence runs on-device first — no prompt leaves your phone. The button shows a spinner; when it returns, the category populates silently.
- ●The ✦ is disabled until you've typed an item name.
- ●If on-device isn't available or fails, the prompt builder opens with Claude / ChatGPT / Gemini / Share preselected.
- ●If the on-device response can't be parsed, an alert offers to "Ask External AI" instead.
Chapter 07
From a recipe, or from gaps.
Two more AI shortcuts live in the + menu. AI: Suggest More looks at your current list and proposes things you forgot. From Recipe URL turns a recipe link or text into a clean shopping list. Both round-trip CSV — when you bring it back, you preview the items before they import.
recipes/1024812-classic-bolognese
Chapter 08
Time to shop.
The Shop tab unifies items needing restock from every list. The hero card shows your current scope and counts. Tap a store chip to focus — and when a store has a layout, the hero card sprouts a Start Route button.
- ●Each item shows a list-name badge so you remember which list it came from.
- ●"All Stores · All Lists" is the default scope — uniqued so an item in two stores shows once.
- ●Empty state: "All Stocked Up!" with a checkmark seal.
Shop
Shop
Chapter 09
Plan with AI.
The ✦ in any list's toolbar opens the prompt builder pre-filled with the meal-plan template. Pick a provider, add any constraints, and send. Your list is packaged as JSON the AI can read.
- ●"● ON DEVICE" badge means no prompt leaves your phone.
- ●External providers always show a disclosure card the first time — explaining exactly what's about to happen.
- ●"Always Allow" persists per-provider. You can override per use.
Chapter 10
Hands-free with Siri.
Four App Intents register as Siri shortcuts. Use them in your kitchen, on your watch, or via the Action Button. Discover them in More → AI → Try Siri.
- ●"Hey Siri, what do I need at the store?" reads back the unified Need to Buy list.
- ●"Add item to my groceries…" appends to your default list.
- ●"Mark an item as bought…" updates inventory across devices.
- ●Open Shortcuts takes you to the system gallery for GroceryApp.
Chapter 12
Add a store.
Open the Stores tab → tap +. The form has the basics — name, type, address — plus an icon and color. Defaults: storefront icon and blue color. Save is disabled until you've entered a name.
- ●Type picker covers Grocery, Pharmacy, Convenience, Restaurant, etc. — each with an SF Symbol.
- ●Tap the address on Mac or iOS to open it in Apple Maps.
- ●Stores are private to you — they're not shared via CloudKit.
Chapter 13
Build a store layout.
Tap a store from the Stores tab → tap 2D Editor → the layout editor opens full-screen. A segmented control at the top switches between three modes: Shapes, Template, and Photo trace.
- ●Template mode has 3 presets: Big Box, Corner Market, Warehouse. Picking one prompts to replace the existing layout.
- ●Shapes mode lets you drag aisles and zones onto a feet-based canvas.
- ●Photo mode imports a store photo as an underlay so you can trace over it.
Choose a preset layout to start from.
Chapter 14
Walking mode.
Tap Start Route on the Shop tab to enter walking mode. The map up top shows your current stop pulsing. The card below shows what to grab from this aisle.
- ●Tap items to check them off; tap Next Stop › to advance.
- ●If items are still unchecked when you advance, you'll get a "Skip this stop?" confirmation.
- ●Last stop's button becomes Finish. The progress badge in the top-right shows checked / total across the trip.
- ●Frozen aisles always route last for cold-chain safety.
Chapter 15
Make it yours.
The More tab is where you personalize defaults and toggle AI features. Eight sections cover profile, appearance, list defaults, sharing, AI, data, advanced, and about.
- ●AI Features master toggle hides every AI surface — toolbar ✦, the FAB AI rows, Suggest Category, Siri tips.
- ●Default AI picks which provider gets used first; per-prompt override is always available.
- ●Hidden Easter egg — tap the version number 7× in About to unlock the diagnostics console.
More
That's the tour.
Free to download — works offline, syncs through your iCloud.