adhd-morning-launchpad

bySteve Scicluna

Build a micro-niche mini app called "ADHD Morning Launchpad". Audience: ADHD/Neurodivergent - someone who: can't start mornings Core job: 15-min guided launch with choices not to-dos Pasta-water insight: Built for ADHD paralysis. Encode this lived experience into the logic, not just generic AI text. Features: - Single page, dark premium UI, Tailwind - Input form for user's specific context - Instant transformation output (not info dump) - Save/export result as image or copy - Pricing: show $12-$27 value badge Tone: Specific, empathetic, practical. No generic fluff. Stack: React + Tailwind + local state. No backend. CTA: "Get my personalized ADHD Morning ->" Build it so it delivers an outcome in <60 seconds

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 7

System Requirements Document for adhd-morning-launchpad

1. Introduction

The "ADHD Morning Launchpad" is a micro-niche mini app designed for ADHD/neurodivergent individuals who struggle to start their mornings. The app provides a 15-minute guided launch with choices instead of to-dos, aiming to overcome ADHD paralysis by encoding this lived experience into its logic. It features a single-page, dark premium UI built with React and Tailwind, delivering an outcome in under 60 seconds without a backend.

2. System Overview

The app is a single-page application targeting ADHD/neurodivergent users who find it challenging to start their mornings. It provides a personalized, empathetic, and practical experience by transforming user input into a guided morning launch. The app's design and functionality are tailored to deliver quick, impactful results, emphasizing the user's specific context and avoiding generic AI text.

2a. Product Interpretation and Delivery Boundary

The "ADHD Morning Launchpad" is delivered as a single-page application with no backend, using local state management. It features a dark premium UI and operates entirely within the browser, ensuring user privacy and quick response times. The app's core functionality is to guide users through a 15-minute morning launch, using choices to help them overcome ADHD paralysis. The app's tone is specific, empathetic, and practical, avoiding generic fluff.

Page 2 of 7

2b. Source Content Inventory

Not applicable as no content source directive is provided.

2c. Page Content and Component Coverage

Page 3 of 7

Landing

  • Introduction Panel

    • Brief explanation of the ADHD Morning Launchpad.
    • Empathetic and practical tone.
    • CTA: "Get my personalized ADHD Morning ->"
  • User Context Input Form

    • Fields for users to enter their specific morning context.
    • Floating glass panel design with luminous strokes.
  • Transformation Output

    • Instant transformation of user input into a personalized morning launch.
    • Radial layout for data presentation.
  • Result Export Options

    • Save or export the result as an image.
    • Option to copy the result to the clipboard.
  • Value Badge

    • Display of a $12-$27 value badge.
  • UI Elements

    • Dark premium UI with Tailwind.
    • Electric violet and teal accents.
    • High-contrast text for readability.
  • Loading and Error States

    • Loading animation during transformation.
    • Error message for invalid input or transformation failure.
Page 4 of 7

3. Functional Requirements

  • As a Morning Launch User, I should be able to enter my specific morning context through an input form to receive a personalized guided launch. (explicit)
  • As a Morning Launch User, I should receive an instant transformation output that provides a choice-based 15-minute guided launch, not an information dump. (explicit)
  • As a Morning Launch User, I should be able to save or export the personalized launch result as an image or copy it to the clipboard. (explicit)
  • As a Morning Launch User, I should see a $12-$27 value badge displayed on the page. (explicit)
  • As a Morning Launch User, I should experience the app's specific, empathetic, and practical tone throughout the interaction. (explicit)
  • As a Morning Launch User, I should be able to complete the entire process and receive an outcome in under 60 seconds. (explicit)

4. User Personas

Morning Launch User

The Morning Launch User is an ADHD/neurodivergent individual who struggles to start their mornings. Their primary goal is to overcome morning paralysis by using the app's guided launch. They provide their specific context, select among guided choices, and use the personalized 15-minute launch to initiate their morning routine. Success is measured by the user's ability to start their morning effectively within the app's 60-second outcome delivery.

5. Core User Flows

Page 5 of 7

5.1 Morning Launch Flow

  1. Start Context: User opens the app on their device.
  2. Landing Page: User reads the introduction and clicks the CTA "Get my personalized ADHD Morning ->".
  3. Input Form: User enters their specific morning context into the floating glass panel form.
  4. Transformation: The app instantly processes the input and presents a personalized 15-minute guided launch.
  5. Result Display: User views the transformation output with a radial layout.
  6. Export Options: User chooses to save the result as an image or copy it to the clipboard.
  7. Completion: User sees the $12-$27 value badge and completes the process within 60 seconds.

6. Visuals Colors and Theme

  • Muse: Gleb Kuznetsov
  • Palette:
    • Background: #0D0D0D
    • Surface: #1A1A1A
    • Text: #E0E0E0
    • Primary: #BB86FC
    • Accent: #03DAC6
    • Muted: #2D2D2D
  • Typography:
    • Headings: Space Grotesk, Bold, uppercase
    • Body: Orbitron
    • Scale: 1.25 modular, 48/32/24/18/16
  • Shape Language: Floating glass panels, thin luminous strokes, radial layouts
  • Imagery: Abstract 3D objects and particle fields
Page 6 of 7

7. Signature Design Concept

The landing page features a full-bleed 3D abstract scene with floating glass panels displaying the input form. Luminous strokes highlight the CTA, with electric violet and teal accents against the dark ground. This design aligns with the cinematic future tech theme, enhancing user engagement and emphasizing the app's premium aesthetic.

8. Interaction Model & Motion Direction

  • Interaction Model: Animated
  • Motion Tempo: Cinematic
  • Hero Dimensionality: WebGL
  • Landing Hero Motion Brief: The focal subject is a 3D abstract scene with floating glass panels. The transformation involves user input leading to a personalized launch output, using continuous slow orbit and parallax with light sweep animations. The first frame shows the input form with luminous strokes, and a reduced-motion state is available for accessibility.

9. Non-Functional Requirements

  • The app must operate entirely within the browser using local state management. (explicit)
  • The UI must maintain high contrast for readability and accessibility. (required_inference)
  • The app must load and deliver results quickly to meet the 60-second outcome delivery requirement. (explicit)

10. Tech Stack

  • React
  • Tailwind CSS
  • Local state management (no backend)
Page 7 of 7

11. Assumptions and Constraints

  • The app is designed for a single-page experience with no backend, relying on local state management.
  • The app's tone and design must align with the specific, empathetic, and practical requirements.
  • The app must deliver an outcome in under 60 seconds to meet user expectations.

12. Glossary

  • ADHD Paralysis: A state where individuals with ADHD find it difficult to initiate tasks or activities.
  • Pasta-water Insight: A metaphor for the lived experience of ADHD paralysis, emphasizing the need for practical, empathetic solutions.
  • Radial Layout: A design layout where elements are arranged in a circular pattern, often used for data visualization.

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: Read introduction
Landing: Click CTA
Landing: Enter morning context
Landing: 1. View loading animation
Landing: 2. View error message
Landing: 3. Retry input
Landing: View transformation output
Landing: View value badge
Landing: Save result as image
Landing: Copy result to clipboard
Landing: Complete morning launch

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: Read introduction
Landing: Click CTA
Landing: Enter morning context
Landing: 1. View loading animation
Landing: 2. View error message
Landing: 3. Retry input
Landing: View transformation output
Landing: View value badge
Landing: Save result as image
Landing: Copy result to clipboard
Landing: Complete morning launch