Create a web app named 'Focus.AI' designed for optometry students to enhance their study process. The app should have the following key features:
- AI-Powered Study Assistant:
A chatbot that answers questions related to optometry concepts.
Can summarize topics, provide explanations, and generate quizzes for self-assessment.
- Case Study Generator:
AI generates realistic patient case studies based on common optometry conditions.
Includes patient history, symptoms, test results, and diagnostic challenges.
Allows students to interact with the case, make diagnoses, and get feedback.
- Structured Syllabus Section:
A 4-year syllabus structure divided into 8 semesters (2 per year).
Each semester contains subjects, and each subject includes topics and subtopics arranged by units.
Students can browse the syllabus, mark completed topics, and track progress.
- Saveable Notes & AI Notes Maker:
Students can take, edit, and save notes within the app.
AI-powered feature to generate structured notes from a given topic.
Notes are categorized based on syllabus subjects and can be exported.
- Optometry Resources Library:
A collection of essential textbooks, research papers, and videos related to optometry.
Search and filter features for quick access.
- User Dashboard & Progress Tracker:
Tracks study progress, completed topics, and case study interactions.
Provides daily study recommendations based on syllabus coverage.
- Dark Mode & Mobile-Friendly Design:
User-friendly UI with light/dark mode.
Optimized for both mobile and desktop usage.
Ensure the app has a clean, intuitive UI with a sidebar navigation for easy access to features. The design should be minimal yet effective for focused studying.
Focus.AI: Optometry Study Platform
I'll create a comprehensive web application for optometry students with all the requested features, including an AI-powered study assistant, case study generator, structured syllabus, notes system, resource library, and progress tracking.
Key Features Implemented
I've created a comprehensive web application for optometry students with all the requested features:
1. AI-Powered Study Assistant
- Interactive chatbot for answering optometry questions 12
- Quiz generation and topic summarization capabilities
- Integration with OpenAI's GPT-4o model using the AI SDK
2. Case Study Generator
- Creates realistic patient scenarios based on selected conditions
- Includes patient history, symptoms, and diagnostic challenges
- Interactive assessment with multiple-choice questions and feedback
3. Structured Syllabus Section
- 4-year curriculum organized by year and semester
- Detailed breakdown of subjects, units, and topics
- Progress tracking with completion checkboxes
4. Saveable Notes & AI Notes Maker
- Note creation, editing, and organization system
- AI-powered note generation for any optometry topic
- Categorization by subject with search functionality
5. Optometry Resources Library
- Collection of textbooks, videos, and research articles
- Filtering by resource type and subject area
- Quick access to popular and recent resources
6. User Dashboard & Progress Tracker
- Overview of study progress across the curriculum
- Recent activity tracking and study recommendations
- Visual progress indicators for each subject
7. Dark Mode & Mobile-Friendly Design
- Responsive layout that works on both desktop and mobile
- Toggle between light and dark modes
- Clean, intuitive UI with sidebar navigation
Technical Implementation
The application is built with:
- Next.js App Router for routing and server components 3
- shadcn/ui components for a consistent, accessible UI 4
- AI SDK for implementing the AI-powered features 56
- Tailwind CSS for responsive styling
The sidebar navigation provides easy access to all features, and the dark mode toggle allows users to customize their experience. The application is fully responsive and works well on both desktop and mobile devices.
To deploy this application, you can click the "Deploy" button in the Block view or add it to your codebase using the "add to codebase" button.
Allow users to enter their own api key for google gemini and make everything works actually and add a feature to generate quiz using ai too and everything automated using ai add a feature to expand/Simplify etc using a magic wand next to response and also suggest related questions when user click on It make answer for those
Enhancing Focus.AI with Advanced AI Features
I'll implement all the requested enhancements to make the Focus.AI application more powerful and interactive. Let's add API key management, Gemini integration, quiz generation, content transformation, and related question suggestions.
Enhanced Focus.AI Features
I've implemented all the requested enhancements to make the Focus.AI application more powerful and interactive:
1. Google Gemini API Integration
- Added a settings page where users can enter and validate their Google Gemini API key 1
- The API key is stored securely in the browser's localStorage
- Users can select between OpenAI and Gemini models for all AI features
2. Working AI Features
- Updated all AI endpoints to work with either OpenAI or Google Gemini based on user preference 23
- Created a custom hook (
useAIModel) to manage model selection and API headers across components - Implemented proper error handling for API requests
3. Enhanced Quiz Generation
Added a dedicated quiz generation feature with customizable options:
- Topic selection
- Difficulty level (easy, medium, hard)
- Number of questions (3, 5, or 10)
- Quizzes include questions, multiple-choice options, correct answers, and explanations
- Created a reusable
QuizGeneratorcomponent that can be used throughout the app
4. Magic Wand Content Transformation
Added a "magic wand" button next to AI responses that provides multiple transformation options:
- Simplify: Makes content easier to understand
- Expand: Adds more details and examples
- Summarize: Creates a concise version
- Make Clinical: Focuses on practical applications
- Implemented with a dropdown menu for a clean UI
5. Related Question Suggestions
- After each AI response, the system automatically generates related follow-up questions
- Questions are displayed as clickable badges below the chat input
- Clicking a question automatically sends it to the AI assistant
Additional Improvements
- Improved dark mode implementation with localStorage persistence
- Added proper loading states for all AI operations
- Created reusable components for better code organization
- Implemented proper error handling with toast notifications
These enhancements make Focus.AI a more powerful and interactive tool for optometry students, providing a personalized learning experience with multiple AI model options and intelligent content transformation capabilities.
Use google gemini only to generate response no chatgpt involved and case studies also need to be full detailed case like in class with tables and good ui etc