APP where people can post picture of their chest/breast as a fyp, being able to catalogue trough tags, such as size.
Generated Prompt
## APPLICATION OVERVIEW This web application is designed as a platform for users to anonymously or as registered members post pictures of their chest or breast. Users can catalogue these images through various tags such as size, skin tone, nipple tone, presence of moles, and shape. The application provides filtering options for users to view male or female breasts based on their preferences. ## CORE FEATURES 1. **User Authentication**: Enable users to register and log in to their accounts, with an option for anonymous posting. 2. **Image Upload**: Allow users to upload images along with relevant tags for categorization. 3. **Tagging System**: Users can add and filter images based on tags like size, skin tone, nipple tone, moles, and shape. 4. **Search and Filter**: Implement search functionality that allows users to filter images by gender (male or female) and other attributes. 5. **Image Gallery**: Display uploaded images in a clean, organized gallery format, emphasizing the latest posts. 6. **User Profiles**: Allow users to create and customize profiles that show their uploaded images and preferences. ## DESIGN SPECIFICATIONS - **Visual Style**: Minimalist - The design emphasizes cleanliness and simplicity, utilizing plenty of white space to enhance readability and focus. - **Color Mode**: Light theme with dark text on light backgrounds to ensure high contrast and easy readability. - **Layout**: The main layout consists of a top navigation bar for easy access to home, search, and user profiles. Below, a grid layout displays the image gallery with filters on the side or top for quick access. - **Typography**: Use a modern sans-serif font (e.g., Inter or Roboto) for headings and body text to maintain a clean and contemporary aesthetic. Headings should be bold and larger, while body text remains regular weight for clarity. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript for building scalable and maintainable components. - **Styling**: Tailwind CSS for utility-first styling that allows for rapid design and responsiveness. - **UI Components**: Utilize shadcn/ui for pre-built, customizable UI components. - **State Management**: Implement React Context API or Zustand for state management, allowing for simple global state handling. ## IMPLEMENTATION STEPS 1. **Set Up Project**: Initialize a React project with TypeScript and install necessary dependencies (Tailwind CSS, shadcn/ui). 2. **Create Authentication Flow**: Develop user registration and login components to handle user sessions. 3. **Build Image Upload Feature**: Implement an image upload component that allows users to select and submit images with tags. 4. **Develop Tagging and Filtering**: Create a tagging system for categorization and implement a filtering mechanism for the image gallery. 5. **Design User Profiles**: Build user profile pages that showcase uploaded images and allow users to manage their settings. 6. **Test and Optimize**: Run usability tests to ensure a seamless user experience and optimize for mobile responsiveness. ## USER EXPERIENCE Users can easily navigate the application through a straightforward interface. Upon landing on the homepage, they can immediately see the latest images in the gallery. Registered users can log in to upload images or manage their profiles, while anonymous users can still browse and filter content. The tagging and filtering options ensure that users can find images that meet their specific criteria, enhancing engagement and satisfaction.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
