System Requirements Document for video-photo

1. Introduction

video-photo is a private media utility for people who need to save a photo or video and return to it for a single view. The product supports saving one photo or one video at a time, retaining it under the user’s application identity, and allowing the saved media to be viewed once.

The intended audience consists of people saving personal media and people returning to view saved media. The experience must feel calm, personal, safe, and effortless rather than social, promotional, or technically complex.

2. System Overview

video-photo is an application-owned media-saving experience with custom user-interface pages and backend integration.

Current product behavior includes:

• Saving one photo or one video.
• Retaining saved media so it can be returned to later.
• Viewing a saved photo or video once.
• Establishing an application identity before saving media.
• Verifying a returning user before displaying their previously saved media.
• Displaying saved media through a private Library.
• Providing a focused Save Media experience for adding one photo or video.

The active human users are Media Saver and Media Viewer. They may be the same individual using the application at different times and for different goals.

The current scope does not include social sharing, public media discovery, comments, collaboration, media editing, albums, file-management features, autoplaying library media, or account-management features beyond the minimum identity establishment and returning verification required to save and reach private media.

2a. Product Interpretation and Delivery Boundary

The application owns the experience for identity establishment, returning verification, saving media, retaining media, presenting saved media, and enforcing the one-time viewing outcome.

A person begins on the public Landing page. A first-time user can establish an application identity through Sign Up before saving media. Returning users must complete application verification before accessing protected media experiences.

Saved media is private to the identity that saved it. The Library provides the return point for saved media. A person can open a saved photo or video from the Library and view it once. After the accepted view is completed, the application must update the item’s state so it is no longer available for another view.

The product is limited to photos and videos. It does not include additional media types, public profiles, social feeds, cloud-storage administration, or future media-management functions.

2c. Page Content and Component Coverage

Landing

• Information and state

  • Anonymous public entry surface.
  • Explains that video-photo saves a photo or video and makes saved media available for a single view.
  • Presents the product as a private, personal place for moments the user keeps.
  • Uses the headline: “Keep what matters.”
  • Shows a quiet memory-tray hero composition with one representative photo or video poster frame.
  • Includes a thin ruled timeline with three small date markers.

• Primary actions

  • Start the first-use identity-establishment journey.
  • Continue to returning-user verification where available.

• Supporting actions

  • Present the purpose of saving and viewing media without requiring the user to interact with media.
  • Clearly distinguish the public entry state from protected Library and Save Media states.

• Domain entities

  • Application identity.
  • Photo.
  • Video.
  • Saved media item.
  • One-time view state.

• Component responsibilities

  • Hero archival window containing a single tall, edge-to-edge media frame.
  • Small sage playback marker when the representative item is a video.
  • Terracotta circular plus button partially docked into the lower edge of the archival window.
  • Entry controls for identity establishment and returning verification.
  • Calm explanatory copy describing the save-and-view-once purpose.

• States and recovery

  • Default anonymous state presents entry actions.
  • If identity establishment cannot be started, show a clear error and preserve the option to retry.
  • If returning verification is unavailable, explain that protected media cannot be opened until verification succeeds.

Sign Up

• Information and state

  • Anonymous identity-access surface.
  • Establishes an application identity for a first-time user.
  • Makes clear that an identity is required before private media can be saved and later reached.

• Primary actions

  • Submit the information required to establish an application identity.
  • Complete the required identity-establishment confirmation.

• Supporting actions

  • Continue to returning-user verification when the user already has an identity.
  • Return to Landing without creating an identity.

• Domain entities

  • Application identity.
  • Identity-establishment state.
  • Verification state.

• Component responsibilities

  • Enrollment input area.
  • Submission control.
  • Clear confirmation of successful identity establishment.
  • Returning-user path.
  • Validation and error presentation.

• States and recovery

  • Initial state allows enrollment.
  • Validation state identifies incomplete or unacceptable enrollment input.
  • Submission state prevents duplicate completion while identity establishment is being processed.
  • Success state confirms identity establishment and continues to protected media work.
  • Failure state explains that an identity was not established and allows retry.
  • Returning verification failure must preserve the user’s ability to retry without exposing private Library or Save Media content.

Library

• Information and state

  • Login-protected overview and return point for saved photos and videos.
  • Displays saved media belonging to the verified application identity.
  • Shows whether a saved item remains available for its one permitted view or is no longer viewable after use.
  • Opens with a large date-aware title.
  • Includes a horizontally scrollable featured-memory strip when eligible saved media exists.
  • Uses slim date rules to organize the media shelf.

• Primary actions

  • Open an available saved photo for its one permitted view.
  • Open an available saved video for its one permitted view.
  • Navigate to Save Media to add one photo or video.

• Supporting actions

  • Review the visual status of saved items.
  • Return to the Library after an item has been viewed or cannot be opened.
  • Navigate among the accepted application destinations.

• Domain entities

  • Saved media item.
  • Photo.
  • Video.
  • Media poster frame or thumbnail.
  • Saved date.
  • Video duration.
  • One-time view availability state.

• Component responsibilities

  • Bottom tray navigation on mobile, limited to the accepted destinations.
  • Slim left-edge navigation on desktop, limited to the accepted destinations.
  • Featured-memory strip.
  • Uneven masonry-like media shelf using original media proportions.
  • Date separators.
  • Media item status presentation.
  • Quiet full-bleed viewer state for an opened item.
  • Narrow paper-coloured metadata strip beneath the viewer.

• States and recovery

  • Loading state indicates that saved media is being retrieved.
  • Empty state explains that no saved media is available and directs the Media Saver to Save Media.
  • Available-item state allows a photo to display or a video to play when selected.
  • Viewing state shows the selected media without autoplaying videos in the Library.
  • Successful one-time view state updates the item to no longer available for later viewing.
  • If media cannot be retrieved or displayed, show an error, retain the Library context, and allow retry where the item remains available.
  • If an item has already been viewed, prevent another view and show that it is no longer available.
  • If verification expires or is unavailable, stop protected content access and direct the user to complete returning verification.

Save Media

• Information and state

  • Login-protected focused media-creation surface.
  • Allows a verified Media Saver to save one photo or one video.
  • Uses a focused single-column capture sheet.
  • Presents two oversized choices: Photo and Video.

• Primary actions

  • Select Photo and take or choose a photo to save.
  • Select Video and take or choose a video to save.
  • Confirm saving the selected single media item.

• Supporting actions

  • Cancel the in-progress media selection before saving.
  • Return to Library after a successful save.
  • Re-select the media type when the initial choice is not the intended type.

• Domain entities

  • Photo.
  • Video.
  • Selected media item.
  • Saved media item.
  • Save status.
  • One-time view availability state.

• Component responsibilities

  • Full-width Photo tile with a large simple symbol and direct action label such as “Take a photo.”
  • Full-width Video tile with a large simple symbol and direct action label such as “Choose a video.”
  • Selected-media confirmation area.
  • Save confirmation control.
  • Success confirmation indicating the media was retained for later one-time viewing.
  • Error and retry treatment.

• States and recovery

  • Initial state presents Photo and Video choices.
  • Selection state shows the selected photo or video before it is saved.
  • Saving state prevents duplicate save attempts while retention is in progress.
  • Success state confirms that the single photo or video was saved and continues to Library.
  • Failure state explains that media was not saved, preserves the selected item when possible, and permits retry or cancellation.
  • If identity verification is no longer valid, prevent saving and direct the user to returning verification.

3. Functional Requirements

FR-1 — Save a Photo

As a Media Saver, I should be able to save one photo so that it is retained in the application for later one-time viewing.

• Provenance: explicit.
• Access state: The Media Saver must be verified through an application identity before saving.
• Trigger and input: The Media Saver selects Photo on Save Media and takes or chooses one photo.
• Behavior: The application accepts one selected photo and retains it as a saved media item associated with the verified application identity.
• Observable result: The user receives confirmation that the photo has been saved and can continue to Library.
• Failure and recovery: If the photo cannot be saved, the application must state that saving failed, preserve the selected photo when possible, and allow retry or cancellation.
• Continuation: After successful saving, the Media Saver can return to Library to see the saved item.
• Acceptance criteria:
  • A verified Media Saver can select the Photo path from Save Media.
  • The Media Saver can provide one photo for saving.
  • A successful save creates a private saved-media item.
  • The saved photo is available through Library until its permitted view is used.
  • A failed save does not falsely report success.

FR-2 — Save a Video

As a Media Saver, I should be able to save one video so that it is retained in the application for later one-time viewing.

• Provenance: explicit.
• Access state: The Media Saver must be verified through an application identity before saving.
• Trigger and input: The Media Saver selects Video on Save Media and takes or chooses one video.
• Behavior: The application accepts one selected video and retains it as a saved media item associated with the verified application identity.
• Observable result: The user receives confirmation that the video has been saved and can continue to Library.
• Failure and recovery: If the video cannot be saved, the application must state that saving failed, preserve the selected video when possible, and allow retry or cancellation.
• Continuation: After successful saving, the Media Saver can return to Library to see the saved item.
• Acceptance criteria:
  • A verified Media Saver can select the Video path from Save Media.
  • The Media Saver can provide one video for saving.
  • A successful save creates a private saved-media item.
  • The saved video is available through Library until its permitted view is used.
  • A failed save does not falsely report success.

FR-3 — Establish an Application Identity

As a Media Saver, I should be able to establish an application identity before saving media so that my saved photo or video can remain associated with me.

• Provenance: required_inference.
• Access state: Anonymous.
• Trigger and input: A first-time user selects the identity-establishment path from Landing.
• Behavior: The application collects and confirms the minimum enrollment information required to establish an application identity.
• Observable result: The user receives confirmation that an application identity has been established and can continue to protected media actions.
• Failure and recovery: If establishment fails or required input is unacceptable, the application must explain the problem and allow correction or retry.
• Continuation: A successfully enrolled user can proceed to Save Media.
• Acceptance criteria:
  • An anonymous user can begin identity establishment from a public page.
  • Protected media content is not exposed before identity establishment succeeds.
  • The application confirms successful enrollment before allowing the user to save private media.

FR-4 — Verify a Returning User

As a Media Viewer, I should be able to verify my returning identity so that I can reach media previously saved under that identity.

• Provenance: required_inference.
• Access state: Anonymous before verification; login-protected after verification.
• Trigger and input: A returning user selects the returning-user path from Landing or Sign Up.
• Behavior: The application verifies that the returning user is the owner of the application identity associated with saved media.
• Observable result: On success, the Media Viewer reaches Library and can see the state of their saved items.
• Failure and recovery: On failure, the application must not expose private media and must provide a clear retry path.
• Continuation: A verified Media Viewer can open an available item from Library.
• Acceptance criteria:
  • A returning user can access a verification path without entering protected Library content.
  • Successful verification permits access to the user’s Library.
  • Failed verification does not reveal saved photos, videos, metadata, or availability details.

FR-5 — View a Saved Photo Once

As a Media Viewer, I should be able to view a saved photo once so that I can see the retained image without making it repeatedly viewable.

• Provenance: explicit.
• Access state: The Media Viewer must be verified and viewing their own Library.
• Trigger and input: The Media Viewer selects an available saved photo from Library.
• Behavior: The application displays the saved photo in the quiet full-bleed viewer and records that the photo’s one permitted view has been used.
• Observable result: The photo is visible to the Media Viewer for its permitted view; after that viewing outcome, the Library indicates that the item is no longer available for another view.
• Failure and recovery: If the photo cannot be retrieved or displayed before the one-time view is completed, the application must show an error and allow the user to return to Library or retry while the item remains available.
• Continuation: The Media Viewer returns to Library after viewing or after resolving a display failure.
• Acceptance criteria:
  • Library identifies a saved photo that remains available for viewing.
  • Selecting the available photo displays it.
  • The application updates the item’s state after the accepted one-time view.
  • The same photo cannot be opened for another view after its one-time view has been used.
  • An already-viewed photo is clearly represented as unavailable rather than displayed again.

FR-6 — View a Saved Video Once

As a Media Viewer, I should be able to view a saved video once so that I can play the retained video without making it repeatedly viewable.

• Provenance: explicit.
• Access state: The Media Viewer must be verified and viewing their own Library.
• Trigger and input: The Media Viewer selects an available saved video from Library and chooses to play it.
• Behavior: The application presents the saved video in the quiet full-bleed viewer and records that the video’s one permitted view has been used.
• Observable result: The Media Viewer can play the saved video for its permitted view; after that viewing outcome, the Library indicates that the item is no longer available for another view.
• Failure and recovery: If the video cannot be retrieved or played before the one-time view is completed, the application must show an error and allow the user to return to Library or retry while the item remains available.
• Continuation: The Media Viewer returns to Library after viewing or after resolving a playback failure.
• Acceptance criteria:
  • Library identifies a saved video that remains available for viewing.
  • Videos do not autoplay in the Library.
  • The Media Viewer explicitly opens the available video to play it.
  • The application updates the item’s state after the accepted one-time view.
  • The same video cannot be opened for another view after its one-time view has been used.
  • An already-viewed video is clearly represented as unavailable rather than played again.

FR-7 — Present Saved Media in a Private Library

As a Media Viewer, I should be able to review my saved media in Library so that I can find an available photo or video to view.

• Provenance: required_inference.
• Access state: Login required.
• Trigger and input: A verified user reaches Library after verification, saving media, or returning to the application.
• Behavior: The application retrieves saved photos and videos associated with the verified identity and presents their type, date-aware organization, visual representation, and view availability state.
• Observable result: The Media Viewer can distinguish available items from media that has already used its single permitted view.
• Failure and recovery: If the Library cannot load, the application must explain the failure and allow retry without exposing another user’s media.
• Continuation: The user can open an available item or continue to Save Media.
• Acceptance criteria:
  • Library only presents saved media associated with the verified identity.
  • Library provides an empty state when there is no saved media.
  • Library provides a loading state while saved media is being retrieved.
  • Library distinguishes available items from no-longer-available items.
  • Library provides a route to Save Media.

4. User Personas

Media Saver

Provenance: required_inference.

The Media Saver is a person who needs to retain one photo or one video in the application. Their primary goal is to select, take, or choose a single item and receive reliable confirmation that it has been saved for later use.

The Media Saver’s responsibilities are distinct from viewing because they initiate the media-retention outcome. They must establish an application identity before private media can be retained, choose whether to save a photo or video, provide the selected media item, and confirm the save action.

Their meaningful inputs and decisions are:

• Establishing an application identity during first use.
• Selecting Photo or Video.
• Taking or choosing one media item.
• Confirming the save.
• Retrying or cancelling when saving fails.

The Media Saver interacts with the application’s media-retention process. Their observable success is a clear confirmation that the selected photo or video was saved and is available in Library for its future single view.

Media Viewer

Provenance: required_inference.

The Media Viewer is a person who returns to the application to see a previously saved photo or video. Their primary goal is to verify their identity, find an available item in Library, and display or play it once.

The Media Viewer’s work differs from saving because they initiate the one-time viewing outcome rather than the retention outcome. They must complete returning verification, identify a saved item that remains available, decide to open it, and understand when the permitted view has been used.

Their meaningful inputs and decisions are:

• Completing returning identity verification.
• Selecting an available photo or video from Library.
• Choosing to play an available saved video.
• Returning to Library after viewing or after a display or playback failure.

The Media Viewer interacts with saved media previously retained by the Media Saver role under the same application identity. Their observable success is that the saved image displays or the saved video plays, followed by an understandable Library state indicating that the item cannot be viewed again.

5. Core User Flows

Media Saver Flow 1 — First-Time Identity Establishment

1. The Media Saver opens Landing anonymously.
2. Landing explains that video-photo saves a photo or video and allows the saved media to be viewed once.
3. The Media Saver chooses to begin using the application.
4. The application opens Sign Up.
5. The Media Saver provides the information required to establish an application identity.
6. The Media Saver submits the identity-establishment request.
7. The application validates and processes the request.
8. If establishment succeeds, the application confirms that the identity is ready and allows continuation to protected media work.
9. If establishment fails, Sign Up explains the failure and allows the Media Saver to correct input or retry.
10. The Media Saver continues to Save Media after successful establishment.

Media Saver Flow 2 — Save One Photo

1. The verified Media Saver opens Save Media.
2. Save Media presents two large choices: Photo and Video.
3. The Media Saver selects Photo.
4. The application presents the photo capture or selection path.
5. The Media Saver takes or chooses one photo.
6. Save Media displays the selected photo in a confirmation state.
7. The Media Saver confirms that the photo should be saved.
8. The application retains the photo as a saved media item associated with the Media Saver’s application identity.
9. On success, the application confirms that the photo was saved for later one-time viewing.
10. The Media Saver continues to Library, where the saved photo is represented as available.
11. If saving fails, Save Media explains that the photo was not saved and allows retry or cancellation.

Media Saver Flow 3 — Save One Video

1. The verified Media Saver opens Save Media.
2. Save Media presents two large choices: Photo and Video.
3. The Media Saver selects Video.
4. The application presents the video capture or selection path.
5. The Media Saver takes or chooses one video.
6. Save Media displays the selected video in a confirmation state.
7. The Media Saver confirms that the video should be saved.
8. The application retains the video as a saved media item associated with the Media Saver’s application identity.
9. On success, the application confirms that the video was saved for later one-time viewing.
10. The Media Saver continues to Library, where the saved video is represented as available.
11. If saving fails, Save Media explains that the video was not saved and allows retry or cancellation.

Media Viewer Flow 1 — Return to a Private Library

1. The Media Viewer opens Landing or Sign Up anonymously.
2. The Media Viewer selects the returning-user verification path.
3. The application requests the information needed to verify the returning application identity.
4. The Media Viewer completes the verification input.
5. The application verifies the identity.
6. If verification succeeds, the application opens Library.
7. Library loads saved media associated with the verified identity.
8. The Media Viewer sees available media, already-viewed media, or the empty Library state.
9. If verification fails, the application does not expose Library content and provides a retry path.

Media Viewer Flow 2 — View a Saved Photo Once

1. The verified Media Viewer opens Library.
2. Library presents saved photos and videos with their current availability states.
3. The Media Viewer identifies a saved photo that remains available for viewing.
4. The Media Viewer selects the available photo.
5. The application opens the photo in the Library viewer state with the paper-coloured metadata strip beneath it.
6. The Media Viewer sees the saved photo.
7. The application records that the photo’s one permitted view has been used.
8. The Media Viewer returns to the Library context.
9. Library represents that photo as no longer available for another view.
10. If the photo cannot be displayed before the one-time view completes, the application explains the issue and allows the Media Viewer to retry or return to Library while the item remains available.

Media Viewer Flow 3 — View a Saved Video Once

1. The verified Media Viewer opens Library.
2. Library presents saved photos and videos with their current availability states.
3. The Media Viewer identifies a saved video that remains available for viewing.
4. The Media Viewer selects the available video.
5. The application opens the video in the Library viewer state.
6. The Media Viewer chooses to play the video; Library does not autoplay it.
7. The application presents playback controls when the Media Viewer taps the video.
8. The Media Viewer plays the saved video.
9. The application records that the video’s one permitted view has been used.
10. The Media Viewer returns to the Library context.
11. Library represents that video as no longer available for another view.
12. If playback cannot begin or continue before the one-time view completes, the application explains the problem and allows retry or return to Library while the item remains available.

6. Visuals Colors and Theme

Muse: Naoto Fukasawa
Headline: “Keep what matters.”

The visual direction is an inevitable, quiet home for the moments a person keeps. It should resemble a familiar personal object rather than a cloud-storage dashboard. The interface must prioritize the user’s photos and video poster frames over technical file-management chrome.

Colour Tokens

Blue or indigo primary actions on a white background are forbidden. The interface must not use gradient blobs, glassmorphism, neon glows, or abstract gradient backgrounds.

Typography

• Heading font: DM Sans, 500–600 weight.
• Body font: Karla.
• Heading style: Sentence case, subtly tightened tracking, low contrast, quietly oversized.
• All caps: Avoid except for compact media-type labels.
• Type scale: 52px, 40px, 32px, 24px, 18px, 16px, 14px.
• Minimum body size: 16px.
• Metadata size: 14px, while retaining readable dark-ink contrast.

Shape and Surface Language

• Use softly rounded rectangles.
• Use 16px corner radii for media.
• Use 12px corner radii for controls.
• Use subtle 1px warm-grey outlines.
• Use circular record controls, simple plus symbols, tactile thumbnail frames, and grounded shelf-like surfaces.
• Avoid floating dashboard tiles and hover-lift card behavior.

Layout Direction

• Use a calm sequential layout with generous reading space.
• Keep navigation limited to the accepted destinations.
• Use a shallow bottom navigation tray on mobile.
• Use a slim left-edge navigation treatment on desktop.
• The Library uses a large date-aware title, a horizontally scrollable featured-memory strip, and an irregular masonry-like shelf based on original media proportions.
• Use slim date rules rather than identical card grids.
• Save Media uses a focused single-column capture sheet with large Photo and Video choices.
• Do not autoplay media in the Library.

Imagery Direction

• Use the user’s saved photos and video poster frames as primary visual material.
• Empty states may use softly lit still-life objects such as a blank photo frame, small camera cap, or folded paper labels in oatmeal and sage tones.
• Do not use stock photography of smiling people.
• Do not use abstract decorative imagery in place of saved media.

7. Signature Design Concept

The Landing page uses a quiet memory tray composition on a warm paper ground.

The left side carries the