{"id":17998167,"url":"https://github.com/chen-rn/confetto-next","last_synced_at":"2025-04-04T06:25:16.387Z","repository":{"id":258995614,"uuid":"867856354","full_name":"chen-rn/confetto-next","owner":"chen-rn","description":null,"archived":false,"fork":false,"pushed_at":"2024-12-14T03:26:26.000Z","size":40874,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-12-14T04:19:31.792Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://confetto-next.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chen-rn.png","metadata":{"files":{"readme":null,"changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-04T21:30:24.000Z","updated_at":"2024-12-14T03:26:30.000Z","dependencies_parsed_at":"2024-12-14T04:18:37.040Z","dependency_job_id":"b3d3344f-5f4d-4f1d-b3e9-bd36cf952a2d","html_url":"https://github.com/chen-rn/confetto-next","commit_stats":null,"previous_names":["chen-rn/confetto-next"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chen-rn%2Fconfetto-next","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chen-rn%2Fconfetto-next/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chen-rn%2Fconfetto-next/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chen-rn%2Fconfetto-next/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chen-rn","download_url":"https://codeload.github.com/chen-rn/confetto-next/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":237995690,"owners_count":19399175,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-29T21:24:17.892Z","updated_at":"2025-02-09T17:42:00.499Z","avatar_url":"https://github.com/chen-rn.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Confetto - AI-Powered MMI Interview Prep\n\n## Product Requirements Document (PRD)\n\n### Table of Contents\n\n1. [Introduction](#1-introduction)\n2. [Objectives and Goals](#2-objectives-and-goals)\n3. [Target Audience](#3-target-audience)\n4. [Product Overview](#4-product-overview)\n   4.1 [Features](#41-features)\n   4.2 [User Stories](#42-user-stories)\n5. [Technical Requirements](#5-technical-requirements)\n   5.1 [Architecture](#51-architecture)\n   5.2 [Database Schema](#52-database-schema)\n   5.3 [Data Flow](#53-data-flow)\n6. [Pages and User Interface](#6-pages-and-user-interface)\n   6.1 [Page Descriptions](#61-page-descriptions)\n   6.2 [Wireframes (Optional)](#62-wireframes-optional)\n\n### 1. Introduction\n\nThe AI-Powered MMI Interview Prep App is designed to assist medical school applicants in preparing for Multiple Mini Interviews (MMIs) by simulating realistic interview scenarios using artificial intelligence. The app provides an interactive platform where users can practice responding to MMI questions, receive comprehensive scoring, and obtain detailed feedback to improve their performance.\n\n### 2. Objectives and Goals\n\n**Primary Objective:** To create an accessible and effective tool that enhances the MMI preparation process for medical school applicants.\n\n**Goals:**\n\n- Simulate realistic MMI interview scenarios using AI.\n- Provide personalized scoring and feedback based on user responses.\n- Track user progress over time to highlight improvements.\n- Ensure a user-friendly interface that is intuitive and engaging.\n\n### 3. Target Audience\n\n- **Primary Users:** Individuals preparing for medical school admissions who will undergo MMI interviews.\n- **Secondary Users:** Pre-med advisors, educational institutions offering preparatory courses, and coaching professionals.\n\n### 4. Product Overview\n\n#### 4.1 Features\n\n1. **AI-Simulated MMI Questions:**\n\n   - Randomized selection from a vast question bank.\n   - Covers various categories like ethical dilemmas, situational judgments, and policy discussions.\n\n2. **Recording and Interactive Response:**\n\n   - Users record their responses (up to 5 minutes).\n   - Optional AI-driven back-and-forth interaction simulating an interviewer.\n\n3. **Scoring System:**\n\n   - Comprehensive scoring out of 100.\n   - Breakdown into key categories:\n     - Communication Skills\n     - Critical Thinking\n     - Ethical Reasoning\n     - Professionalism\n\n4. **Detailed Feedback:**\n\n   - Highlights strengths and areas for improvement.\n   - Provides actionable advice for enhancement.\n\n5. **Progress Tracking:**\n\n   - History of past sessions.\n   - Visual representation of performance over time.\n\n6. **User Authentication and Profile Management:**\n\n   - Secure sign-up and login via Clerk.js.\n   - Personalized dashboard and settings.\n\n#### 4.2 User Stories\n\n1. As a user, I want to practice MMI questions so that I can prepare for my medical school interviews.\n2. As a user, I want to receive detailed feedback on my responses so that I know where to improve.\n3. As a user, I want to track my progress over time so that I can see how I am improving.\n4. As a user, I want a user-friendly interface so that I can focus on my preparation without technical difficulties.\n\n### 5. Technical Requirements\n\n#### 5.1 Architecture\n\n- **Frontend:** Next.js with the App Router and server components.\n- **UI Framework:** React with Shadcn UI, Radix UI, and Tailwind CSS for styling.\n- **Authentication:** Clerk.js for user authentication and session management.\n- **Backend:** Prisma ORM connected to a PostgreSQL database.\n- **AI Services:**\n  - **Speech-to-Text:** Transcribe user recordings using a service like Google Cloud Speech-to-Text API.\n  - **Natural Language Processing (NLP):** Analyze transcripts, score responses, and generate feedback using OpenAI's GPT-4 API.\n- **Storage:**\n  - **Cloud Storage:** Firebase Storage for storing audio recordings.\n- **State Management:**\n  - Utilize React's built-in state and context APIs, minimize use of client-side state where possible.\n- **Performance Optimization:**\n  - Implement server-side rendering (SSR) and static site generation (SSG) where appropriate.\n  - Optimize images and assets for web performance.\n\n#### 5.2 Database Schema\n\nThe database schema is defined using Prisma ORM and includes the following models:\n\n- **User**\n\n  ```prisma\n  model User {\n    id               Int               @id @default(autoincrement())\n    name             String\n    email            String            @unique\n    practiceSessions PracticeSession[]\n    createdAt        DateTime          @default(now())\n    updatedAt        DateTime          @updatedAt\n  }\n  ```\n\n- **Question**\n\n  ```prisma\n  model Question {\n    id               Int               @id @default(autoincrement())\n    content          String\n    category         String\n    practiceSessions PracticeSession[]\n    createdAt        DateTime          @default(now())\n    updatedAt        DateTime          @updatedAt\n  }\n  ```\n\n- **PracticeSession**\n\n  ```prisma\n  model PracticeSession {\n    id                Int             @id @default(autoincrement())\n    user              User            @relation(fields: [userId], references: [id])\n    userId            Int\n    question          Question        @relation(fields: [questionId], references: [id])\n    questionId        Int\n    startTime         DateTime\n    endTime           DateTime?\n    recordingUrl      String?\n    transcript        String?\n    score             Score?\n    feedback          Feedback?\n    createdAt         DateTime        @default(now())\n    updatedAt         DateTime        @updatedAt\n  }\n  ```\n\n- **Score**\n\n  ```prisma\n  model Score {\n    id                Int             @id @default(autoincrement())\n    practiceSession   PracticeSession @relation(fields: [practiceSessionId], references: [id])\n    practiceSessionId Int             @unique\n    totalScore        Float\n    categoryScores    Json\n    createdAt         DateTime        @default(now())\n    updatedAt         DateTime        @updatedAt\n  }\n  ```\n\n- **Feedback**\n\n  ```prisma\n  model Feedback {\n    id                Int             @id @default(autoincrement())\n    practiceSession   PracticeSession @relation(fields: [practiceSessionId], references: [id])\n    practiceSessionId Int             @unique\n    content           String\n    createdAt         DateTime        @default(now())\n    updatedAt         DateTime        @updatedAt\n  }\n  ```\n\n#### 5.3 Data Flow\n\n1. **User Authentication:**\n\n   - User signs up or logs in via Clerk.js.\n   - Authentication tokens are securely managed.\n\n2. **Session Initiation:**\n\n   - User navigates to start a new practice session.\n   - A random question is fetched from the PostgreSQL database using Prisma.\n\n3. **Recording Response:**\n\n   - User records their response using the Web Audio API.\n   - Audio file is uploaded to Firebase Storage.\n\n4. **Transcription:**\n\n   - The audio URL is sent to the Speech-to-Text service.\n   - Transcribed text is saved to the database.\n\n5. **NLP Analysis:**\n\n   - Transcribed text is sent to the NLP service (e.g., GPT-4).\n   - Service returns a scoring object and feedback.\n   - Score and feedback are saved in the database associated with the practice session.\n\n6. **Displaying Results:**\n\n   - User is redirected to the results page.\n   - Scores and feedback are fetched from the database and displayed.\n\n7. **Progress Tracking:**\n   - User's practice sessions are aggregated to show progress over time.\n   - Data visualization components display the user's improvement.\n\n### 6. Pages and User Interface\n\n#### 6.1 Page Descriptions\n\n1. **Home Page:**\n\n   - **URL:** `/`\n   - **Description:** Introduces the app with a compelling hero section, feature highlights, and testimonials. Contains call-to-action buttons for sign-up and login.\n\n2. **Sign-Up / Login Page:**\n\n   - **URL:** `/sign-in`\n   - **Description:** Utilizes Clerk.js components for user authentication. Provides options for email/password and social logins.\n\n3. **Dashboard:**\n\n   - **URL:** `/`\n   - **Description:** Displays user statistics, recent practice sessions, and a button to start a new session. Shows progress charts using dynamic data.\n\n4. **Practice Session Page:**\n\n   - **URL:** `/session`\n   - **Description:** Presents the MMI question and a recorder interface. Includes a timer and guidelines. Users can start, pause, and stop recording.\n\n5. **Results Page:**\n\n   - **URL:** `/session/results`\n   - **Description:** Shows the user's score with a breakdown by category. Displays detailed AI-generated feedback and the transcribed response.\n\n6. **Profile Settings Page:**\n\n   - **URL:** `/profile`\n   - **Description:** Allows users to update personal information, change passwords, and set preferences.\n\n7. **History Page:**\n\n   - **URL:** `/history`\n   - **Description:** Lists all past practice sessions with dates and scores. Users can click on a session to view detailed results.\n\n8. **Error Page:**\n\n   - **URL:** `/error`\n   - **Description:** Generic error handling page that informs the user of any issues and provides navigation options.\n\n#### 6.2 Wireframes (Optional)\n\nWhile wireframes are optional at this stage, they can be created using tools like Figma or Sketch to provide visual guidance for the UI/UX design.\n\n**Note:** Ensure that all pages are responsive and adhere to accessibility standards. Use Tailwind CSS for consistent styling and Radix UI components for interactive elements like modals and dropdowns.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchen-rn%2Fconfetto-next","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchen-rn%2Fconfetto-next","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchen-rn%2Fconfetto-next/lists"}