DokimiAI Try-On for WooCommerce

DokimiAI is a virtual try-on service (https://dokimiai.io). This plugin is its WooCommerce client: it adds a “Try On” button to your product pages so customers can see your earrings on themselves in real time using their webcam.

For privacy, the try-on itself runs entirely in the shopper’s browser. The webcam video is never uploaded and the face landmarks are never sent anywhere — face tracking (MediaPipe Face Mesh) and image compositing happen locally on the visitor’s device. What the DokimiAI service provides is the try-on runtime: a set of fixed, versioned, immutable static assets that the browser downloads when the try-on modal is opened (see “External services” below for the exact files and their checksums).

No account is required. Paid plans of the DokimiAI service (hosted at dokimiai.io) add optional service-side features; this plugin is complete and fully functional on its own.

An internet connection is required, because the browser downloads the try-on runtime assets from the service when the try-on is opened.

Features

• Real-time earring try-on on the product page, in a modal opened by a “Try On” button.
• In-modal color and size selection: choosing a color switches the overlay image instantly; the choice is written back to the product’s selectors so the cart keeps it.
• Drag each earring with one finger to fine-tune its position, and zoom the camera with a three-finger gesture.
• Share the result: copy a caption, save the snapshot, or post to X / use the native share sheet — with an optional light skin-smoothing for social posts.
• Per-product enable toggle, category, and per-color overlay image.
• Fully translatable: English is the source language, with a Japanese translation bundled.

External services

This plugin is a client of the DokimiAI virtual try-on service (https://dokimiai.io) and relies on it for one thing: delivering the browser try-on runtime.

The virtual try-on runs entirely in the visitor’s browser using the MediaPipe Face Mesh runtime (Google, Apache License 2.0). The non-readable runtime and model binaries are served by the DokimiAI service from https://cdn.dokimiai.io/ over a fixed, versioned, immutable path:

• /mediapipe/face_mesh/0.4.1633559619/face_mesh_solution_simd_wasm_bin.wasm SHA256: fb9e9cfe8b83a914e40eab2efd3b0d92a61f82a7c968589f223ab2a7e331d314
• /mediapipe/face_mesh/0.4.1633559619/face_mesh_solution_packed_assets.data SHA256: dbe5905c582c0462cdaea17e7e6ecea92edaa8cccc515c5e2e7291f2cbb5fb99
• /mediapipe/face_mesh/0.4.1633559619/face_mesh.binarypb SHA256: 139546bf05aebb33e2611b6b945f3a1629c316ca924e33cec1547c85ddef9f53

These are the unmodified artifacts from the npm package @mediapipe/face_mesh version 0.4.1633559619 (https://www.npmjs.com/package/@mediapipe/face_mesh). The versioned path is immutable — a runtime update publishes a new version directory rather than overwriting these files — so the served bytes always match the checksums above.

When (and only when) a visitor opens the try-on modal on a try-on-enabled product page, their browser downloads these three files. No personal data is sent with these requests: the requests carry no query string, no cookies, and no visitor identifiers. Camera frames and face landmarks are never uploaded.

All JavaScript this plugin uses — including the MediaPipe Face Mesh solution entry point and the WebAssembly/asset-loader glue — is bundled inside the plugin and loads from your own site; only the three non-readable binaries above are delivered by the service.

The optional “Powered by DokimiAI” credit (off by default) is an ordinary hyperlink to dokimiai.io; the plugin does not transmit any data to that URL.

Service terms and privacy:

• Terms of service: https://dokimiai.io/en/legal/terms/
• Privacy policy: https://dokimiai.io/en/legal/privacy/

Bundled Third-Party Libraries & Source Files

This plugin bundles the following third-party JavaScript, served from your own site:

• MediaPipe Face Mesh and Camera Utils (Google) — Apache License 2.0. Source: https://github.com/google-ai-edge/mediapipe The full license text is bundled at assets/mediapipe/LICENSE — a verbatim copy of the upstream LICENSE file (the Apache License 2.0 together with the UTF-8 decoder notice it carries). The upstream project ships no separate NOTICE file.

The bundled MediaPipe JavaScript consists of exactly these files under assets/mediapipe/ (unmodified vendor files):

• camera_utils/camera_utils.js — camera frame-loop helper; enqueued by the plugin on product pages with try-on enabled.
• face-mesh/face_mesh.js — Face Mesh solution entry point; enqueued by the plugin alongside camera_utils.js.
• face-mesh/face_mesh_solution_packed_assets_loader.js — model asset loader; requested by face_mesh.js when the try-on starts (from your own site).
• face-mesh/face_mesh_solution_simd_wasm_bin.js — WebAssembly runtime glue; requested by face_mesh.js when the try-on starts (from your own site).
• LICENSE — the Apache License 2.0 text covering the above and the runtime binaries delivered by the service (see “External services”).

The three non-readable runtime binaries these files load (face_mesh_solution_simd_wasm_bin.wasm, face_mesh_solution_packed_assets.data, and face_mesh.binarypb) are not bundled; they are delivered by the DokimiAI service as described under “External services”.

Source code and build

This plugin ships its complete, human-readable source. The in-browser try-on widget (assets/js/dokimiai-tryon.js) is compiled with esbuild from the TypeScript sources included under build/src/.

To rebuild the widget from source:

1. Install Node.js 18 or later.
2. From the build/ directory, run: npm install
3. Then run: npm run build:widget

This regenerates assets/js/dokimiai-tryon.js from build/src/tryon-core.ts using the esbuild configuration in build/build.mjs. The node_modules directory is not shipped; npm install restores the exact build tool (esbuild) declared in build/package.json. No minified code is shipped without its corresponding source.