Create Meme
The Create step prepares the browser and camera before the user takes a photo. It prevents the workflow from continuing until the app can safely capture image data.
Requirements Check
The Requirements Check panel runs automatically when the Create Meme page opens. It is there to make sure the browser can safely take a photo, draw it into the app, and prepare it for the editor. If one of the checks fails, the capture buttons stay disabled so the user does not end up with a blank or broken meme.
1. Browser + Canvas Check
This check confirms that the browser supports the web features needed to build the captured image. The app needs a modern browser with JavaScript enabled, support for HTML video, support for Canvas drawing, and the ability to export canvas content as image data.
A passing browser can take a frame from the camera preview, draw that frame onto a canvas, and turn the canvas into an image that can be sent to the Process Meme step. Without this, the app might show a camera preview but still be unable to create an editable meme image.
Common causes of failure include using an outdated browser, opening the page inside a restricted in-app browser, disabling JavaScript, using privacy extensions that block media APIs, or running the page in a browser mode that limits canvas access. Trying the latest Safari, Chrome, Firefox, or Edge usually fixes this kind of issue.
2. Camera Permission Check
This check asks the browser and operating system for permission to use the camera. The page must be loaded from a secure connection, usually HTTPS, because browsers block camera access on insecure pages. On local development, a trusted local HTTPS certificate or an allowed local test host may also be required.
The browser may show a permission prompt. The user needs to allow camera access for the site, and the operating system also needs to allow camera access for the browser itself. On phones and tablets, this can involve both the browser permission prompt and system-level privacy settings.
Common causes of failure include clicking Block by mistake, camera permissions being disabled in browser settings, camera access being disabled in macOS/iOS/Android privacy settings, another app already using the camera, using a browser tab inside a social app that does not expose camera access properly, or visiting the page over plain HTTP on a non-local address.
3. Live Stream Ready
This check verifies that the camera stream is actually playing inside the page. Permission alone is not enough: the app also needs a live video frame so the Capture Photo button can grab the current image.
A passing stream means the video element has received camera data, the browser knows the video dimensions, and the page can capture a real frame instead of a black, empty, or zero-size image. This step protects the user from moving forward before the camera has finished warming up.
Common causes of failure include a slow camera startup, a disconnected or covered camera, another app holding the camera, a browser pausing background tabs, low-power mobile behavior, denied autoplay/media behavior, or temporary device glitches. Refreshing the page, closing other camera apps, selecting a different browser, or reconnecting the camera usually resolves it.
Toolbar And Action Buttons
| Button | What It Does |
|---|---|
| Capture Photo | Starts the capture countdown and stores the current camera frame in the form. |
| Process Image | Sends the captured image to the editor step after the photo is available. |
| Open troubleshooting help | Shows diagnostic details when a browser, canvas, or camera requirement fails. |