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:
- Install Node.js 18 or later.
- From the build/ directory, run: npm install
- 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.
