Footprint app
I'm trying to make my travel diary app. First, the home screen should show a Google Map screen. On this map, photo thumbnails should appear as pins at the travel locations I've registered. When I click on the pin, a travel detail page appears, and this page should show the photos I've uploaded and a short memo. Therefore, the add travel page should allow multiple photos or videos to be uploaded, and notes of 5 lines or less should be written. The bottom bar should show the home screen, add post+, and profile screen. The profile screen should have a function that counts how many posts I've uploaded.
I want to use dark theme.
Design Theme
Theme: Dark theme for a sleek and modern look, reducing eye strain in low-light environments.
Icon/Button Color: Use a single color for icons and buttons, such as a vibrant teal (#1ABC9C) to stand out against the dark background.
Button Shape: Rounded corners with a radius of 8dp for a friendly and approachable feel.
Home Screen
Google Map Integration:
The main feature of the home screen is a Google Map that displays the user_ registered travel locations.
Photo Thumbnails as Pins: Each registered location will have a pin with a photo thumbnail. This thumbnail will be a small circular image representing the location.
Pin Interaction: Tapping on a pin will open a travel detail page.
Travel Detail Page
Photos and Memo Display:
This page will show all the photos uploaded for that specific travel location.
A short memo (up to 5 lines) will be displayed below the photos.
Navigation:
A back button at the top left corner to return to the home screen.
Add Travel Page
Upload Functionality:
Users can upload multiple photos or videos from their device.
A simple + button will allow users to add media files.
Notes Section:
A text area for writing notes, limited to 5 lines.
Save Button:
A rounded button at the bottom of the screen to save the travel entry. This button will be in the same teal color as other buttons.
Bottom Navigation Bar
Home Icon:
Located on the left, it returns the user to the home screen with the map.
Add Post+ Icon:
Centered in the navigation bar, it opens the add travel page.
Profile Icon:
Located on the right, it navigates to the profile screen.
Profile Screen
Post Count Functionality:
Displays the total number of posts the user has uploaded.
This can be shown as a simple text element, e.g., _otal Posts: X.
User Information:
Optionally, display basic user information like username or profile picture.
Navigation:
A back button to return to the home screen.
Additional Features
Responsive Layouts:
Ensure the app is responsive and works well on different screen sizes.
Form Validation:
Validate inputs on the add travel page to ensure all required fields are filled.
Error Handling:
Provide user feedback for any errors, such as failed uploads or missing information.
Loading Indicators:
Show loading indicators when fetching data or uploading media to enhance user experience.
This plan outlines the core features and design elements needed to create a functional and user-friendly travel diary app with a dark theme.
test password: guest123
