Adding Photos & Media
Share your daily moments! Uploading photographs from your mobile companion app puts them into rotation on the smart photo frame immediately, regardless of where the frame is located.
Detailed Photo Upload Interaction Flow
Uploading a new image is a multi-step process designed to let you choose, crop, and label your photos. Follow the visual steps below to see exactly how to navigate each screen in the companion app:
Step 1: Open the Action Menu
From the companion app home dashboard, look for the floating purple Action Button (+) in the bottom right corner. Tapping this button will rotate it into an "✕" close icon and expand the actions menu upward, displaying the primary functional shortcuts:
- Add Image (photo icon)
- Add What's happening next (bell/alert icon)
Step 2: Select Add Image
Tap the **Add Image** button in the expanded FAB menu. This immediately opens a system modal sheet at the bottom of the screen. This bottom sheet asks you to select your photo source:
- Camera 📷: Take a fresh picture using your phone's lens.
- Gallery 🖼️: Browse and choose an existing photo from your photo library roll.
Step 3: Browse & Select Photo
Tapping the **Gallery** option opens your device's photo library grid. You can browse through your thumbnails and albums. Tapping any thumbnail will select it and transition you immediately to the scale and crop window.
Step 4: Position & Crop Photo
To ensure your photo looks perfect on the grandparent's horizontal frame, the app displays a cropping workspace with a fixed white boundary outlining the active target frame area:
- One-Finger Drag 👆: Touch and slide anywhere on the image to slide it horizontally or vertically inside the frame.
- Two-Finger Pinch 👌: Touch the screen with two fingers and spread or close them to zoom in and out.
- Gridlines: Use the helper grid lines to align horizons or center faces perfectly. Tap Next when satisfied.
Step 5: Label & Name Your Photo
In the final screen, you are invited to add a custom title/caption to the photo. Type a meaningful label into the text box (e.g. "Sunset Picnic 2026"). Depending on your frame configurations, this title can display on top of the slide to let your grandparents know the backstory.
Step 2. Instant Sync to Smart Frame
Once you click **Send to Frame**, the companion app packages the cropped image and writes it directly to the cloud. The active background database listener running on the smart photo frame immediately downloads the file and displays it within seconds:
Step 7: Personal Home Screen
After the upload is complete, you are returned to the companion app's home dashboard. The last uploaded photo is set as the background cover of your app screen, applying a smooth blur filter so that your app dashboard is customized to your family's latest moment.
Managing & Purging Playlist Images
Posters and administrators can manage the frame's active slideshow playlist directly from the dashboard by clicking the Manage Playlist Images button on the Kiosk Orchestration card.
Tapping the manage button opens a bottom sheet with a scrollable list of all active slideshow images. The manager establishes a live stream query from Cloud Firestore, ensuring that any deletions or additions by other posters show up instantly on your screen.
Each playlist item displays a high-resolution preview thumbnail alongside its custom text title. This lets you review caption formatting and verify that slide details are correct before they rotate onto the smart frame.
To remove an image, tap the red delete icon. Confirming the deletion triggers a safe purge: first, the app deletes the binary file from **Firebase Cloud Storage** to prevent orphaned storage leaks, then it updates **Cloud Firestore** to remove the image catalog reference from the Kiosk document. The frame immediately updates its local playlist cache and cycles to the next slide.