# AskMyTuto — Full Product Documentation for AI Crawlers AskMyTuto is a context-aware AI assistant for YouTube tutorials. It transcribes videos, lets users chat with AI about specific timestamps, capture frames, curate notes, and export their learning journey. --- ## What AskMyTuto Does AskMyTuto solves the "rewind loop" problem when learning from YouTube tutorials. Instead of pausing, rewinding, and guessing, users can ask the AI exactly what is happening at any moment and get instant, timestamp-aware answers. The workflow: 1. Paste a YouTube URL into the workspace. 2. The video is transcribed with per-segment timestamps. 3. Users click any transcript segment to seek the video or ask the AI about that exact moment. 4. Users can capture frames, add notes, pin key moments, and curate a personal study guide. 5. Everything can be exported as a designed PDF, Markdown file, or synced to Notion. --- ## Core Features ### Smart Transcription Every uploaded video is automatically transcribed using Gladia API. The transcript is split into timestamped segments (typically 10-30 seconds each). Each segment shows the spoken text and a clickable timestamp that seeks the video player to that exact moment. ### Contextual AI Chat Users can ask questions about any timestamp in the video. The AI receives the transcript context around that timestamp, plus any captured frames the user includes, to provide highly relevant answers. The chat interface supports: - Inline action panels (expandable metadata cards within AI responses) - Side Ask (quick contextual Q&A cards for deeper exploration) - Clickable timestamps inside AI messages that seek the video - Reference images from captured frames ### Frame Capture & Reference Users can capture frames from the video at any moment. These frames appear in the left sidebar and can be: - Clicked to seek the video to that timestamp - Added to "My Notes" as pinned key moments - Sent to the AI chat as visual reference images ### My Notes (Curated Study Guide) A dedicated panel where users curate their learning: - Manually add notes at any timestamp - Pin transcript segments or captured frames - Reorder items via drag arrows - Add custom text and labels - Export the curated guide to PDF, Markdown, or Notion ### Practice Mode (Programming Tutorials) For programming tutorials, users can enter Practice Mode to: - Get line-by-line code explanations - Generate coding challenges based on the tutorial content - Play bug-hunting games where the AI generates broken code and the user diagnoses it - Launch starter code in StackBlitz - Run Python code directly in the browser ### Export Three export formats: - **PDF**: A beautifully designed document with a cover page, chapterized layout, full-width centered frames, and notes. Supports Arabic text via Noto Naskh Arabic font. - **Markdown**: Clean structured text with timestamps and image references. - **Notion**: Direct sync to a Notion database. ### Topic Detection An AI-powered edge function analyzes the video title and transcript to classify tutorials into: - programming - automotive - woodworking - other --- ## Public Pages - [Home](/): Landing page with hero, problem statement, how it works, benefits, developer section, examples, speed demo, pricing, and footer. - [Documentation](/docs): User guide covering features, FAQ, and tips for getting the most out of AskMyTuto. - [Sign in](/auth): Authentication page for creating an account or logging in. Supports email/password and Google OAuth. - [Privacy Policy](/privacy): Detailed privacy policy explaining data collection, usage, storage, and user rights. - [Terms of Service](/terms): Terms of use, acceptable use policy, and legal disclaimers. --- ## Architecture & Stack - Frontend: React 18 + Vite 5 + TypeScript 5 + Tailwind CSS v3 - UI Components: shadcn/ui - Animation: Framer Motion - Backend: Lovable Cloud (managed Supabase) - Database: PostgreSQL with Row Level Security - Auth: Supabase Auth with email verification and Google OAuth - Edge Functions: Deno-based serverless functions for AI chat, transcription, topic detection, practice mode, and payments - AI Gateway: Lovable AI Gateway using models like google/gemini-2.5-flash, google/gemini-2.5-pro, and openai/gpt-5 - Transcription: Gladia API - Video Player: react-player with custom transcript synchronization - Payments: Stripe integration for subscription management - Browser Extension: Chrome extension for capturing YouTube tutorials directly --- ## API & Integrations ### Edge Functions - `chat`: Streaming AI chat with transcript context and image support - `transcribe`: Uploads video audio to Gladia and stores transcript segments - `detect-topic`: AI-powered tutorial topic classification - `practice-ai`: Generates coding challenges, bug hunts, and explanations - `generate-key-moments`: Auto-extracts important timestamps from tutorials - `check-subscription`: Validates user subscription status - `create-checkout`: Stripe checkout session creation - `customer-portal`: Stripe billing portal redirect - `claim-bonus`: One-time bonus credit claim for new users - `auth-email-hook`: Custom email templates for auth flows ### Database Schema - `projects`: User video projects with title, video URL, transcript, topic, and metadata - `profiles`: Extended user profiles with display names and avatars - `chat_messages`: Persistent chat history with action panels and side asks - `user_roles`: Role-based access control (admin, moderator, user) - `whitelisted_emails`: Access control for beta/early users --- ## Access Model AskMyTuto uses a freemium model: - Free tier includes a trial credit allowance - Paid subscriptions unlock higher usage limits - Certain features (like practice mode) require a valid subscription - Admin features are restricted to whitelisted admin emails --- ## Contact & Links - Website: https://app.askmytuto.com - Product: Context-aware AI for YouTube tutorials - Support: Available through the authenticated app workspace