united-tattoo/docs/brainstorming.md

151 lines
7.7 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# Brainstorming Log — United Tattoo Website Expansion
Date: 2025-09-17
Audience: Christy (owner), development team, future maintainers
Overview
This document captures the comprehensive brainstorming outputs from our planning sessions for United Tattoos public-facing website and internal admin/ops systems. It consolidates the four pillars we identified:
- Admin Dashboard & Artist Management
- Unified Booking & Client Management
- Public-Facing Experience
- Technical Architecture & Delivery
Goals
- Create a unified, scalable system that supports artist onboarding, portfolio management, and secure admin controls.
- Deliver a polished public site with immersive visuals, consistent design (ShadCN baseline), and robust content (education, aftercare, etc.).
- Implement a reliable booking and payment flow with client portals and calendar integration.
- Establish strong documentation, staging environments, and an approachable handoff for Christy.
Key Design & Tech Assumptions
- UI baseline: ShadCN components, aligned with homepage and /artist pages.
- Parallax layering and split-screen storytelling to achieve an oversized ecommerce-like experience.
- Asset hosting on Cloudflare R2; metadata in D1; server-side asset loading to minimize client storage.
- Context7 MCP and ShadCN MCP docs as primary sources for patterns and best practices.
- Admin users invited via email; role-based access; password onboarding; 2FA.
Brainstorming Focus Areas and Ideas
1) Admin Dashboard & Artist Management System
- User Management & Authentication
- Invite-based onboarding with time-limited signup links.
- Wizard-style onboarding for artists using ShadCN components.
- Two-factor authentication (2FA) to improve security.
- Sandbox mode to preview changes before going live.
- Optional passwordless login fallback for convenience.
- Asset Management & Optimization
- Manual cropping UI with grid guides; save as separate asset records.
- Optional AI-assisted cropping suggestions that can be toggled off in settings.
- Batch drag-and-drop portfolio uploads with progress tracking.
- Versioning for portfolio pieces to track edits/updates.
- Smart compression with a user-facing toggle to disable automatic aggressive compression if needed.
- Server-side asset loading from R2, pulling per-artist asset bundles when rendering.
- Permissions & Access Controls
- Fine-grained roles: viewer, editor (portfolio), admin (full control), owner.
- Activity logs with audit trail visuals.
- Emergency pause per-artist or system-wide control.
- Customizable notification preferences per user and per role.
- Data & Security Considerations
- Keep media assets offsite in R2; assets loaded server-side to minimize duplication.
- Access tokens with scoped permissions for asset retrieval.
- Basic content moderation hooks for uploaded media.
2) Unified Booking & Client Management System
- Multi-Form System
- Smart routing to route to consultation vs. booking based on user input.
- Appointment type taxonomy: first tattoo, cover-up, large piece, etc.
- Automated quote estimates based on options (size, complexity, artist rate tiers).
- Client Portal
- Account-based portal for appointment management: view, reschedule, cancel.
- Deposits, refunds, and payment history; secure checkout with PCI-compliant flows.
- Deposit policies clearly displayed during booking.
- Scheduling & Calendar
- Real-time availability across artists; conflict detection.
- Google Calendar two-way sync for artists; SMS/email reminders with opt-in controls.
- Automated scheduling confirmations and reminders.
- Payments
- Multi-merchant support (Stripe, PayPal) with deposit handling.
- Secure storage of payment intents and receipts; refunds workflow.
- Notifications & Communication
- Email and SMS channels; user preference granularity.
- Admin notifications for new bookings, cancellations, and changes.
3) Public-Facing Website Experience
- Design System & Visual Language
- All new pages follow the ShadCN baseline; homepage and /artist pages as references.
- Layered parallax and split-screen interactions for hero sections and portfolios.
- Oversized, image-forward design with heavy photography emphasis.
- Pages & Navigation
- Improve /aftercare, /deposit, /terms, /privacy, /book to align with the visual system.
- Smooth, consistent navigation with refined transitions.
- Search & Discovery
- Dedicated search page with filters (style, price, availability).
- Quick search (Ctrl+K) for artists and educational content.
- Enhanced artist gallery with style-based filtering and interactive zooms.
- Educational Content
- Detailed aftercare guides with visuals, progress tracking, and checklists.
- Healing process explanations with diagrams or annotated imagery.
- Downloadable PDFs and printable guides.
- Content Strategy
- Rich media: more images and photography across pages, focusing on shop and artists.
- Clear calls-to-action for bookings and consultations.
4) Technical Architecture & Delivery
- Cloudflare Integration
- D1 for structured data; R2 for media assets; 2-way data flow with server-side rendering patterns.
- Caching strategies to minimize data egress and optimize load times.
- Image processing on the server (parallax-friendly, optimized delivery).
- Performance & Experience
- Lazy loading for portfolio assets; progressive image loading for perceived speed.
- Service workers for offline support and faster revisit performance.
- Git & Documentation
- Git-free CMS-like experience for the owner-facing admin experience.
- Clear README, architecture docs, changelog, and contributor guidelines.
- Staging environment for Christy to preview progress before production.
- Delivery & Handoff
- Repository delivered as a ready-to-merge GitHub project; Cloudflare transfer instructions documented.
- Owner training materials focusing on non-technical management tasks.
Phased Implementation Plan (Summary)
- Phase 1: Foundation & Critical Fixes (Week 1-2)
- Admin dashboard bug resolution, invitation flow, onboarding, basic portfolio management, R2 integration scaffold.
- Phase 2: Core Features & UX (Week 3-4)
- Unified booking system, client portal, deposits, payments, and initial design unification.
- Phase 3: Polish & Visual Experience (Week 5-6)
- Parallax, split-screen, advanced search, education content, staging environment.
- Phase 4: Documentation & Delivery (Week 7)
- Documentation, git workflow, handoff, Cloudflare setup, owner training.
Risks & Mitigations
- Risk: Admin dashboard complexity and bugs
- Mitigation: Build incremental, testable components; implement the sandbox preview and role-based testing.
- Risk: Cloudflare integration pitfalls (D1/R2)
- Mitigation: Use MCP patterns, implement robust error handling, staging environment for preview, and strict access controls.
- Risk: Performance with rich visuals and parallax
- Mitigation: Lazy loading, image optimization, careful asset sizing, and performance budgets.
Next Actions
- Create the initial documentation skeletons and onboarding guides.
- Start implementing Phase 1: Admin dashboard bug resolution and onboarding flow.
- Establish a staging environment workflow for Christys preview and handoff.
Notes
- AI cropping suggestions are optional and can be toggled off in settings with manual fallback as requested.
- All design work will follow ShadCN patterns and Context7/MCP guidance.
- Staging and documentation will be integral to a smooth handoff and maintainability.
End of planning notes. Let me know if you want me to start implementing Phase 1 tasks immediately, and I will begin with the admin dashboard on-boarding flow and the artist asset handling scaffold. If you want a specific formatting or section ordering in this document, I can adjust accordingly.