Zapp Active Trello Board

Zapp Active - Trello Board Structure

Location-Based Discovery App | Clean Architecture + Riverpod

Board Setup Instructions

Labels to Create:

Additional Labels:

Lists (Columns)

1. 📚 PROJECT INFO & RESOURCES

Pin important docs and links here

2. 📋 BACKLOG

All ideas and future work

3. 🎯 MVP MUST-HAVES

Critical features for launch

4. 🔜 UP NEXT

Ready to start

5. 🏗️ IN PROGRESS

Currently being worked on

6. 👀 IN REVIEW

Code review / testing

7. ✅ DONE

Completed and deployed

8. 🚀 RELEASE READY

Ready for app store

📚 List 1: PROJECT INFO & RESOURCES

Card: 🎯 Project Overview

Description:

Zapp Active - Location-based discovery app with AR gamification

Tech Stack:
- Flutter + Riverpod 2.x
- Clean Architecture (Domain/Data/Presentation)
- GraphQL API
- Mapbox GL
- ARKit/ARCore

Key Features:
1. Discover Tab - Map-based exploration
2. Search Tab - Intent-driven discovery
3. AR Scan - Camera-based item finding
4. Saved Tab - Favorites management
5. Profile Tab - User settings & achievements

Card: 📖 Architecture Guide

Links: - Clean Architecture Pattern - Two-Mapper Data Flow - Riverpod State Management - Feature Structure Template

Card: 🎨 Design System

Links: - Design System Docs - Interactive Showcase (v2.5) - Component Library - Color Palette (#E11D48 primary) - Lucide Icons

Card: 📱 Specifications

Links: - Discover Tab Spec (60+ pages) - Search Tab Spec (70+ pages) - AR Scan Button Spec - Design vs Search Comparison

Links: - GitHub Repository - GraphQL API Docs - Figma Designs - Testing Environment - Production App

Card: 📊 Success Metrics

Checklist: - [ ] 100 active users in first month - [ ] 30% weekly retention - [ ] 5 hidden items discovered per user - [ ] 4.0+ app store rating - [ ] <2s average load time

📋 List 2: BACKLOG (Future Ideas)

Card: 💡 Phase 2 Features

Checklist: - [ ] Social sharing of discoveries - [ ] User-generated content - [ ] Custom map themes - [ ] Advanced achievement system - [ ] Leaderboards - [ ] Friend system - [ ] Chat/messaging

Card: 💡 Phase 3 Features

Checklist: - [ ] 3D building mode - [ ] AR navigation - [ ] Voice control - [ ] Offline mode - [ ] Custom collections - [ ] Event calendar integration - [ ] Premium subscriptions

Card: 💡 AI Enhancements

Checklist: - [ ] Natural language search - [ ] Smart recommendations - [ ] Auto-generated summaries - [ ] Personalized feed - [ ] Predictive discovery

Card: 💡 Business Features

Checklist: - [ ] Business analytics dashboard - [ ] Promoted pins - [ ] Featured listings - [ ] Booking integration - [ ] Review system

🎯 List 3: MVP MUST-HAVES

Epic 1: 🏗️ Foundation & Setup

Card: Project Setup & Configuration

Labels: 🟥 Critical, 🟦 Technical, 🎯 MVP Checklist: - [ ] Create Flutter project - [ ] Configure Clean Architecture folder structure - [ ] Set up Riverpod dependencies - [ ] Configure GraphQL client - [ ] Add Mapbox SDK - [ ] Add ARKit/ARCore plugins - [ ] Set up Lucide icons package - [ ] Configure build variants (dev/staging/prod) - [ ] Set up environment variables - [ ] Initialize Git repository

Notes:

dependencies:
  flutter_riverpod: ^2.x
  graphql_flutter: ^5.x
  mapbox_gl: ^0.x
  dartz: ^0.10.x

Card: Design System Implementation

Labels: 🟥 Critical, 🟪 Design, 🎯 MVP Checklist: - [ ] Create color constants (#E11D48 primary) - [ ] Set up typography styles (Aktiv Grotesk) - [ ] Configure spacing tokens (8-point grid) - [ ] Create base component library - [ ] Implement dark mode support - [ ] Add Lucide icon integration - [ ] Create reusable card variants - [ ] Build button system (5 sizes, 6 variants)

Card: Core Architecture Setup

Labels: 🟥 Critical, 🟦 Technical, 🎯 MVP Checklist: - [ ] Create domain layer structure - [ ] Set up data sources (abstract + impl) - [ ] Implement repository pattern - [ ] Create entity models - [ ] Build two-mapper pattern - [ ] Set up use cases - [ ] Configure Riverpod providers - [ ] Implement error handling (Either)

Epic 2: 🗺️ Discover Tab (Map)

Card: Basic Map Integration

Labels: 🟥 Critical, 🗺️ Map, 🎯 MVP Checklist: - [ ] Integrate Mapbox GL - [ ] Implement user location tracking - [ ] Add location permissions handling - [ ] Create map controller - [ ] Implement pan/zoom gestures - [ ] Add recenter button - [ ] Show loading states - [ ] Handle map errors

Technical Notes:

Domain Layer:
- MapDataSource (abstract)
- MapRepository
- GetUserLocationUseCase
- GetNearbyPinsUseCase

Presentation Layer:
- MapProvider (StateNotifier)
- DiscoverPage
- MapWidget

Card: Pin System & Display

Labels: 🟥 Critical, 🗺️ Map, 🎯 MVP Checklist: - [ ] Create pin entity models - [ ] Implement GraphQL pin queries - [ ] Create custom map markers - [ ] Add category icons to pins - [ ] Implement pin tap handling - [ ] Add pin clustering (basic) - [ ] Show pin count on clusters - [ ] Handle pin loading states

Card: Preview Cards & Bottom Sheet

Labels: 🟥 Critical, 🗺️ Map, 🎯 MVP Checklist: - [ ] Design preview card component - [ ] Implement bottom sheet - [ ] Add swipe-to-dismiss gesture - [ ] Show item details in card - [ ] Add “View Details” button - [ ] Add “Save” button - [ ] Implement smooth animations - [ ] Handle sheet state management

Design Specs: - Card height: 200px - Corner radius: 16px - Swipe threshold: 100px - Animation duration: 300ms

Card: Category Filtering

Labels: 🟧 High Priority, 🗺️ Map, 🎯 MVP Checklist: - [ ] Create category filter chips - [ ] Implement filter state management - [ ] Update pins based on filter - [ ] Add “Clear filters” option - [ ] Show active filter count - [ ] Smooth filter transitions - [ ] Persist filter preferences

Categories: - 🍽️ Food & Drink - 🛍️ Shopping - 🎭 Entertainment - 🏛️ Culture - 🌳 Outdoors - 💎 Hidden Items

Epic 3: 🔍 Search Tab

Card: Search Bar & Input

Labels: 🟥 Critical, 🔍 Search, 🎯 MVP Checklist: - [ ] Create search bar component - [ ] Implement debounced search (300ms) - [ ] Add clear button - [ ] Show search icon - [ ] Implement autocomplete dropdown - [ ] Handle keyboard focus - [ ] Add loading indicator - [ ] Cache recent searches

Card: Search Results List

Labels: 🟥 Critical, 🔍 Search, 🎯 MVP Checklist: - [ ] Create result card component - [ ] Implement infinite scroll - [ ] Add pagination (20 items per page) - [ ] Show distance from user - [ ] Add “Save” button on cards - [ ] Implement card tap navigation - [ ] Show empty state - [ ] Add skeleton loaders

Card: Filtering System

Labels: 🟧 High Priority, 🔍 Search, 🎯 MVP Checklist: - [ ] Create filter panel UI - [ ] Add distance slider (0-10km) - [ ] Add price range selector - [ ] Add rating filter - [ ] Add category multi-select - [ ] Show active filter badges - [ ] Implement “Apply” button - [ ] Add “Clear all” option

Card: Sorting Options

Labels: 🟧 High Priority, 🔍 Search, 🎯 MVP Checklist: - [ ] Create sort dropdown - [ ] Implement Distance sort - [ ] Implement Rating sort - [ ] Implement Price (Low to High) - [ ] Implement Price (High to Low) - [ ] Implement Newest sort - [ ] Show current sort indicator - [ ] Persist sort preference

Epic 4: 📷 AR Scan Button

Card: Center Button Component

Labels: 🟥 Critical, 📷 AR, 🎯 MVP Checklist: - [ ] Create floating action button - [ ] Position in center of tab bar - [ ] Add elevation/shadow - [ ] Implement pulse animation - [ ] Add tap haptic feedback - [ ] Handle button states - [ ] Design icon (camera/scan)

Design: - Size: 56px diameter - Position: Center, elevated 8px - Color: Primary red (#E11D48) - Shadow: 0 4px 12px rgba(0,0,0,0.15)

Card: AR Camera View

Labels: 🟧 High Priority, 📷 AR, 🎯 MVP Checklist: - [ ] Integrate ARKit/ARCore - [ ] Request camera permissions - [ ] Implement camera preview - [ ] Add GPS overlay - [ ] Show nearby items in AR - [ ] Add scan indicator - [ ] Implement QR code detection - [ ] Handle AR errors

Card: Item Discovery Mechanics

Labels: 🟧 High Priority, 📷 AR, 🎯 MVP Checklist: - [ ] Create hidden item models - [ ] Implement proximity detection - [ ] Add unlock animation - [ ] Show discovery notification - [ ] Award achievement badge - [ ] Update user stats - [ ] Add confetti effect - [ ] Store discovered items

Gamification: - Detection radius: 5m - Discovery animation: 500ms - Badge reveal: Scale + fade - Haptic: Heavy impact

Epic 5: 💾 Saved Tab

Card: Favorites List

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Create favorites data model - [ ] Implement local storage (Hive) - [ ] Show saved items list - [ ] Add remove button - [ ] Group by category - [ ] Add search within saves - [ ] Show empty state - [ ] Sync with backend

Card: Collections Feature

Labels: 🟨 Medium Priority, 🎯 MVP Checklist: - [ ] Create collection models - [ ] Add “New Collection” button - [ ] Show collections grid - [ ] Add items to collections - [ ] Edit collection names - [ ] Delete collections - [ ] Show collection count

Epic 6: 👤 Profile Tab

Card: User Profile Display

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Show user avatar - [ ] Display username - [ ] Show discovery stats - [ ] Add settings button - [ ] Implement logout - [ ] Show account details - [ ] Add edit profile option

Card: Achievements System

Labels: 🟨 Medium Priority, 🎯 MVP, 🎮 Gamification Checklist: - [ ] Create achievement models - [ ] Design achievement badges - [ ] Show earned achievements - [ ] Add progress bars - [ ] Implement unlock logic - [ ] Add achievement notifications - [ ] Show total points

Achievement Ideas: - First Discovery (1 hidden item) - Explorer (10 discoveries) - Master Explorer (50 discoveries) - 7-Day Streak - Category Expert (all items in category)

Card: Activity History

Labels: 🟨 Medium Priority, 🎯 MVP Checklist: - [ ] Show recent discoveries - [ ] Display check-ins - [ ] Add timestamps - [ ] Show activity map - [ ] Implement date filters - [ ] Export activity data

Epic 7: 🔐 Authentication

Card: Login/Signup Flow

Labels: 🟥 Critical, 🎯 MVP Checklist: - [ ] Create login screen - [ ] Create signup screen - [ ] Implement email/password auth - [ ] Add Google Sign-In - [ ] Add Apple Sign-In - [ ] Handle auth errors - [ ] Store auth tokens - [ ] Implement logout

Card: Onboarding Screens

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Design welcome screen - [ ] Create feature highlights (3-5 screens) - [ ] Add progress indicators - [ ] Implement swipe navigation - [ ] Add “Skip” option - [ ] Request permissions (location, camera) - [ ] Show only on first launch

Epic 8: 🔌 Backend Integration

Card: GraphQL API Setup

Labels: 🟥 Critical, 🟦 Technical, 🎯 MVP Checklist: - [ ] Set up GraphQL client - [ ] Define schema models - [ ] Implement queries (pins, search) - [ ] Implement mutations (save, discover) - [ ] Add authentication headers - [ ] Handle API errors - [ ] Implement retry logic - [ ] Add request caching

Card: Data Layer Implementation

Labels: 🟥 Critical, 🟦 Technical, 🎯 MVP Checklist: - [ ] Create data source entities - [ ] Implement repository entities - [ ] Build Mapper 1 (API → Repository) - [ ] Build Mapper 2 (Repository → Model) - [ ] Implement error handling - [ ] Add logging - [ ] Write unit tests

Data Flow:

API Response
↓
DataSourceEntity
↓
MAPPER 1
↓
RepositoryEntity
↓
MAPPER 2
↓
Model (Use Cases)
↓
Riverpod Provider
↓
UI

Epic 9: 📱 Core Features & Polish

Card: Navigation System

Labels: 🟥 Critical, 🎯 MVP Checklist: - [ ] Implement bottom navigation - [ ] Add 5 tabs (Discover, Search, AR, Saved, Profile) - [ ] Handle tab switching - [ ] Add tab icons (Lucide) - [ ] Implement deep linking - [ ] Preserve tab state - [ ] Add navigation animations

Card: Loading & Error States

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Create skeleton loaders - [ ] Add spinner components - [ ] Design error screens - [ ] Implement retry buttons - [ ] Add network error handling - [ ] Show offline mode message - [ ] Add toast notifications

Card: Animations & Transitions

Labels: 🟨 Medium Priority, 🎯 MVP Checklist: - [ ] Page transition animations (300ms) - [ ] Card hover/press animations - [ ] Button press feedback - [ ] Bottom sheet slide animations - [ ] Toast slide-in/out - [ ] Loading state animations - [ ] Implement easing curves

Animation Timing: - Fast: 100-200ms (buttons, toggle) - Medium: 300ms (transitions, cards) - Slow: 500ms+ (page loads, reveals)

Epic 10: 🧪 Testing & Quality

Card: Unit Tests

Labels: 🟧 High Priority, 🟦 Technical, 🎯 MVP Checklist: - [ ] Test use cases - [ ] Test repositories - [ ] Test mappers - [ ] Test providers - [ ] Test utilities - [ ] Achieve 70%+ coverage

Card: Widget Tests

Labels: 🟨 Medium Priority, 🟦 Technical, 🎯 MVP Checklist: - [ ] Test core components - [ ] Test navigation - [ ] Test form inputs - [ ] Test gestures - [ ] Test animations

Card: Integration Tests

Labels: 🟨 Medium Priority, 🟦 Technical Checklist: - [ ] Test complete user flows - [ ] Test API integration - [ ] Test authentication - [ ] Test data persistence

Epic 11: 🚀 Pre-Launch

Card: Performance Optimization

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Optimize map rendering - [ ] Implement image caching - [ ] Reduce bundle size - [ ] Optimize API calls - [ ] Profile app performance - [ ] Fix memory leaks - [ ] Target <2s load time

Card: App Store Preparation

Labels: 🟥 Critical, 🎯 MVP Checklist: - [ ] Create app icons (iOS/Android) - [ ] Design splash screens - [ ] Write app description - [ ] Take screenshots (5+ per platform) - [ ] Create preview videos - [ ] Set up app store listings - [ ] Submit for review

Card: Beta Testing

Labels: 🟧 High Priority, 🎯 MVP Checklist: - [ ] Set up TestFlight (iOS) - [ ] Set up Google Play Beta - [ ] Recruit 20-50 beta testers - [ ] Collect feedback - [ ] Fix critical bugs - [ ] Iterate based on feedback - [ ] Prepare for launch

🔜 List 4: UP NEXT

Cards ready to be started - pull from MVP list

🏗️ List 5: IN PROGRESS

Active work - limit to 3-5 cards max

👀 List 6: IN REVIEW

Code review, testing, QA

✅ List 7: DONE

Completed features - archive after 2 weeks

🚀 List 8: RELEASE READY

Features ready for production deployment

📊 Sprint Planning Template

Week 1-2: Foundation

Goal: Project setup complete Cards to complete: - Project Setup & Configuration - Design System Implementation - Core Architecture Setup

Week 3-4: Discover Tab Core

Goal: Basic map working Cards to complete: - Basic Map Integration - Pin System & Display - Category Filtering

Week 5-6: Search Tab Core

Goal: Search functional Cards to complete: - Search Bar & Input - Search Results List - Filtering System

Week 7-8: AR & Saved Tabs

Goal: All tabs functional Cards to complete: - Center Button Component - AR Camera View - Favorites List

Week 9-10: Profile & Auth

Goal: User accounts working Cards to complete: - Login/Signup Flow - User Profile Display - Achievements System

Week 11-12: Polish & Testing

Goal: Production ready Cards to complete: - Loading & Error States - Animations & Transitions - Unit Tests - Performance Optimization

Week 13-14: Beta & Launch

Goal: Live in app stores Cards to complete: - Beta Testing - App Store Preparation - Final bug fixes - Launch! 🎉

🎯 Definition of Done

For All Cards:

For Features:

📈 Velocity Tracking

Story Point Guide:

Target Velocity:

🎨 Power-Ups to Add

  1. Calendar - Track deadlines and sprint dates
  2. Custom Fields - Add story points, priority
  3. Card Repeater - Recurring tasks
  4. Slack/Discord - Team notifications
  5. GitHub - Link commits and PRs

🔥 Motivation Cards

Card: 🎉 Launch Countdown

Create a card that counts down to launch day! Update daily with: - Days until MVP launch - Features completed % - Tests passing % - Performance metrics

Card: 🏆 Team Achievements

Celebrate wins: - ✅ First feature completed - ✅ 100% test coverage milestone - ✅ 1000th commit - ✅ Beta launch - ✅ App store approval - ✅ First 100 users

Card: 📸 Progress Screenshots

Add screenshots weekly to show progress Shows visible progress to keep motivated!

💬 Sample Card Descriptions

Example: Basic Map Integration

GOAL: Get Mapbox GL working with user location

USER STORY:
As a user, I want to see my location on a map so that I can discover nearby places.

ACCEPTANCE CRITERIA:
✅ Map displays correctly on iOS and Android
✅ User location shown with blue dot
✅ Map can be panned and zoomed smoothly
✅ Recenter button returns to user location
✅ Loading state shown while map initializes
✅ Error message if location permission denied

TECHNICAL TASKS:
- [ ] Add mapbox_gl dependency
- [ ] Configure Mapbox API key
- [ ] Create MapWidget component
- [ ] Implement location permissions
- [ ] Add MapProvider (Riverpod)
- [ ] Create GetUserLocationUseCase
- [ ] Handle map loading states
- [ ] Test on real devices

DESIGN SPECS:
- Map style: Mapbox Streets
- User location: Blue circle, 16px
- Recenter button: Bottom-right, 44x44px

NOTES:
- Need Mapbox API key from project manager
- Test in various locations for accuracy
- Consider offline map caching later

BLOCKED BY:
- None

LINKS:
- Mapbox Flutter docs
- Design spec: Discover Tab section 2.1

🚀 Getting Started Guide

For New Team Members:

  1. Read Project Info cards in List 1
  2. Review Architecture Guide to understand structure
  3. Check Design System for UI patterns
  4. Pick a card from “UP NEXT” that matches your skills
  5. Move card to “IN PROGRESS” and assign yourself
  6. Create a branch from main
  7. Follow Definition of Done checklist
  8. Submit PR when ready
  9. Move card to “IN REVIEW”
  10. Celebrate when it’s DONE! 🎉

📞 Support

Questions? Check:

  1. Architecture docs in Project Info
  2. Design specs for UI questions
  3. API docs for backend questions
  4. Ask in Slack/Discord

Stuck? Create a card:

Title: [BLOCKED] - Issue description Label: ⬛ Blocked Description: What’s blocking you and what you need

Board Version: 1.0 Created: October 2025 Status: Ready to use!

🎯 QUICK START ACTIONS

Right Now (Day 1):

  1. Create Trello board
  2. Set up labels
  3. Create all lists
  4. Add Project Info cards
  5. Add Epic 1: Foundation cards
  6. Start “Project Setup & Configuration”

This Week (Week 1):

  1. Complete Foundation epic
  2. Start Discover Tab epic
  3. Get basic map showing
  4. Celebrate first feature! 🎉

This Month (Month 1):

  1. Complete Discover + Search tabs
  2. Start AR button
  3. Add authentication
  4. Begin testing
  5. Target: 60% MVP complete

Two Months (Month 2):

  1. Complete all 5 tabs
  2. Finish testing
  3. Begin beta testing
  4. Performance optimization
  5. Target: 100% MVP ready

Three Months (Month 3):

  1. Beta feedback incorporated
  2. App store submissions
  3. Marketing prep
  4. LAUNCH! 🚀🎉

Now stop reading and start building! You’ve got this, boss! 💪