ESP-Live-Photo Component 

Note

This document is automatically translated using AI. Please excuse any detailed errors. The official English version is still in progress.

Regular photos are easy to browse and share, but they only capture a single moment. Videos can preserve the process of action, but they are not convenient enough for quick snapshots. Live Photo and Motion Photo formats combine the advantages of both: users first see a JPEG photo, and compatible gallery apps can play a short dynamic clip within the same file.

ESP-Live-Photo allows Espressif devices to directly create and parse this hybrid media format on the device side. It combines a high-quality JPEG cover image and an embedded MP4 video clip, which can also include audio. Therefore, smart cameras, doorbells, and other products can save snapshots with dynamic context without post-processing through a PC or the cloud.

Table of Contents

ESP-Live-Photo Component

What is ESP-Live-Photo 

ESP-Live-Photo is a component provided by Espressif for generating and reading Live Photo / Motion Photo files on embedded devices. It generates a single file that looks like a regular JPEG image, while carrying a short MP4 clip, providing users with dynamic context.

For product users, its value is very intuitive:

Quickly view captured content like browsing photos.
Preserve a short action before and after the key moment.
Only need to share or store one file, without having to manage photos and videos separately.
Generate live photos suitable for viewing on smart phones directly on the device side.

Live Photo Demonstration 

The following demonstration uses LivePhotosKit tags similar to the Web gallery: first display the JPEG cover image, and play the corresponding MOV segment when triggering the live photo interaction. On the desktop, hover the mouse over the LIVE logo to play; on the mobile side, long press the image to play.

Why do you need it 

Many IoT cameras and smart devices capture media content based on events: visitor arrivals, pet movements, object detection, or user pressing the shutter. Static images are easy to view, but they may miss what happens before and after the moment. Short videos contain context, but they are slower to browse.

ESP-Live-Photo can bring a more attractive capture experience to products: the gallery still focuses on photo browsing, and when users need more context, they can also play dynamic clips.

Typical Use Cases 

Smart Doorbell

The doorbell can save clear visitor snapshots and include a short video before and after the event. Users can quickly browse the pictures first, and then play dynamic content to view visitor actions.

Battery Camera

Battery-powered cameras usually need compact and meaningful records. Motion Photo can first display key frames and save useful dynamic clips in the same file.

AI Camera

AI cameras can pair detection results with short clips that interpret events. For example, packages, people, pets, or vehicles can be displayed in photo form, accompanied by dynamic evidence.

Companion and Monitoring Devices

Pet feeders, baby monitors, and companion devices can create captured content that is more vivid than static images and easier to browse than video lists.

Inspection and On-site Devices

On-site devices can save a photo for reporting purposes and keep a short dynamic record in the same file for subsequent review.

Simple Architecture 

ESP-Live-Photo uses ESP-Muxer Component to create files and ESP-Extractor Component to read files. The product only needs to provide a JPEG cover image and a short MP4 clip; the component will handle the live photo file layout and metadata.

Creation process:

JPEG cover image
      |
      |        Short MP4 clip
      |        Video + Optional audio
      |              |
      v              v
+-----------------------------+
| ESP-Live-Photo + ESP-Muxer  |
| Combine image and dynamic content |
| Add Motion Photo metadata   |
+-----------------------------+
              |
              v
    Live Photo / Motion Photo file

Reading process:

Live Photo / Motion Photo file
          |
          v
+--------------------------------+
| ESP-Live-Photo + ESP-Extractor |
| Find cover image and MP4 clip |
+--------------------------------+
         |                |
         v                v
    JPEG cover image   MP4 dynamic clip
    For preview       For playback / upload

Design Suggestions 

Choose a representative cover: The static image is the first content the user sees, so it should clearly reflect the event itself.
Keep the clip short: Live photos are best used to provide dynamic context, not to save long videos.
Capture around key moments: For event-triggered products, it is recommended to include a short time before and after the trigger as much as possible.
Use detailed module documentation for integration: Configuration and compatibility details will be maintained in the component documentation.