Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as a personal portfolio, showcasing the user's achievements, ongoing projects, vision and mission, a collection of e-certificates, and a history of collaborations. The site will feature a sleek and modern design, emphasizing both aesthetic appeal and functionality, while ensuring a user-friendly experience.

## CORE FEATURES
1. **Achievements Section**: A dedicated area to display notable accomplishments in a visually engaging format, including icons and brief descriptions.
2. **Projects Showcase**: A dynamic gallery of current and past projects with images, descriptions, and links to detailed case studies.
3. **Vision and Mission Statement**: A prominent section outlining the user's professional ethos, presented with impactful typography and design elements.
4. **E-Certificate Collection**: An organized display of digital certificates, allowing users to view and download them as needed.
5. **Collaboration History**: A timeline or list format detailing past collaborations, including partner logos and brief descriptions of each partnership.
6. **Light and Dark Mode Toggle**: A user-friendly switch that allows visitors to toggle between light and dark themes for enhanced accessibility and personalization.

## DESIGN SPECIFICATIONS
- **Visual Style**: A minimalist approach with a focus on clean lines, ample white space, and a limited color palette that emphasizes functionality and readability.
- **Color Mode**: The primary design will feature a light theme with dark text on light backgrounds, complemented by navy blue and black accents for a futuristic touch.
- **Layout**: A vertically stacked layout with a navigation bar at the top, followed by sections for achievements, projects, vision and mission, e-certificates, and collaboration history. Each section will be distinctly separated with generous spacing.
- **Typography**: Use sans-serif fonts such as 'Roboto' or 'Montserrat' for body text, with bolder weights for headings to create a clear hierarchy. Ensure consistent sizing for titles, subtitles, and body text for a cohesive look.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type safety and efficient component management.
- **Styling**: Tailwind CSS for utility-first styling, allowing rapid design changes without disrupting component structure.
- **UI Components**: Utilize shadcn/ui for pre-designed components that maintain consistency and accessibility.
- **State Management**: Use React's Context API or Zustand for managing global state if necessary.

## IMPLEMENTATION STEPS
1. **Project Setup**: Initialize the React project with TypeScript, install Tailwind CSS, and configure shadcn/ui components.
2. **Create Layout Components**: Develop the main layout including a header (navigation) and footer for consistent site structure.
3. **Build Core Features**: 
   - Develop the Achievements Section as a grid layout with cards for each achievement.
   - Create a Projects Showcase component with a carousel or grid layout, incorporating images and links.
   - Design a Vision and Mission section with a centered text block for emphasis.
   - Implement an E-Certificate Collection section using a grid display.
   - Build a Collaboration History section with a timeline or list format.
4. **Add Theme Toggle**: Implement functionality to switch between light and dark themes using CSS variables for colors.
5. **Responsive Design**: Ensure all components are responsive using Tailwind CSS utilities, testing across various devices and screen sizes.
6. **Testing and Deployment**: Conduct thorough testing for functionality and usability, then deploy the application using a service like Vercel or Netlify.

## USER EXPERIENCE
Users will enjoy a seamless navigation experience, with an intuitive layout guiding them through the portfolio. Each section will feature smooth scrolling interactions, and the light/dark mode toggle will enhance personalization. Clear call-to-action elements will be present throughout, encouraging users to explore projects and collaborations or download certificates easily. The overall experience will reflect a professional yet inviting atmosphere, making it easy for visitors to connect with the user's work and achievements.