“Quiero un mapa interactivo completamente navegable de la Provincia de Buenos Aires (Argentina), incluyendo todas sus ciudades, localidades y...
Generated Prompt
## APPLICATION OVERVIEW
This is a web application designed to provide an interactive, fully navigable map of the Province of Buenos Aires, Argentina. The application will allow users to manage and visualize health establishment markers, update their statuses, and track logistics in real-time, ensuring a transparent and organized approach to managing electoral logistics.
## CORE FEATURES
1. **Interactive Map**: A dynamic map displaying all cities, towns, and neighborhoods in Buenos Aires, with individual markers for health establishments.
2. **Health Establishment Upload**: Users can upload a list of health establishments in Excel or text format, including details such as name, address, locality, type, and additional characteristics.
3. **Marker Status Management**: Each marker can be updated to reflect the status of documentation ("Delivered" or "Pending") with color-coded markers (green, red, orange).
4. **User Roles**: Different user roles allow for general users to make full modifications, while field users can only update the status of markers, ensuring control over data integrity.
5. **Internal Search and Filters**: Users can quickly locate establishments by name, locality, or type, and apply filters to display certain categories (e.g., only hospitals or pending statuses).
6. **Logistics Tracking and Export**: Users can export detailed logistics in Excel format, capturing the timeline and locations where urns were placed, including timestamps for each action.
## DESIGN SPECIFICATIONS
- Visual Style: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- Color Mode: Light theme with dark text on light backgrounds
- Primary Color: #1978E5 (accent for buttons, links, highlights)
- Typography: Use Inter from Google Fonts for headings, Inter for body text and UI elements
- Border Radius: 8px (moderately rounded) for buttons, cards, and inputs
- Layout: A single-page layout with a top navigation menu, a central interactive map area, and side panels for filters, search, and user options.
## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Redux for managing application state and user roles
## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install necessary dependencies (React, TypeScript, Tailwind CSS, Redux, shadcn/ui).
2. **Create Map Component**: Develop the interactive map component using a mapping library (e.g., Leaflet or Google Maps API) to display health establishment markers.
3. **Implement File Upload Feature**: Create a component to handle uploading Excel/text files and parsing the data to extract health establishment information.
4. **Develop Marker Status Functionality**: Implement functionality to update marker statuses upon user interaction (click/touch), with color-coded feedback based on status.
5. **User Authentication and Role Management**: Set up user authentication and define user roles using a state management solution like Redux to control access and functionalities.
6. **Build Search and Filter Components**: Create components for searching and filtering health establishments based on user input.
7. **Logistics Tracking and Export**: Implement a feature to track logistics and export data to Excel, ensuring accurate timestamps and locations are recorded.
8. **Responsive Design**: Ensure the application is responsive and functions well across mobile, PC, and TV devices.
## USER EXPERIENCE
Users will interact with the application through a clean interface that allows for easy navigation of the map. They can search for establishments, view detailed information via tooltips, and update statuses intuitively. Field users will have streamlined access to their functionalities, ensuring they can mark documentation statuses without the ability to alter critical data, promoting accountability and transparency throughout the electoral process. The minimalist design will enhance usability and focus users on essential tasks without distractions.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!
