Description
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.
Installation
- Upload the plugin to the
/wp-content/plugins/dokimiai-woodirectory, or install it through the Plugins screen. - Activate the plugin through the Plugins screen.
- Edit a product, open the “DokimiAI Try-On” box, enable it, choose the category, and set the overlay image.
Note: Overlay images must use https:// URLs. On HTTPS stores, http:// images
are blocked by the browser (mixed content) and will not display. Use the
“Add image” button or enter an https:// URL.
Note: The visitor’s browser needs an internet connection the first time it opens
the try-on, in order to download the runtime assets described under “External
services”. They are then cached by the browser.
FAQ
-
Does it require WooCommerce?
-
Yes. WooCommerce 10.9 or later must be installed and active.
-
What does the plugin download from an external server?
-
Only the three MediaPipe runtime binaries listed under “External services”,
served by the DokimiAI service CDN (cdn.dokimiai.io). They are fetched by the
visitor’s browser when the try-on modal is opened, and then cached. All of the
plugin’s JavaScript loads from your own site. See “External services” for the
exact files, checksums, and privacy details. -
Is camera video uploaded anywhere?
-
No. Face tracking and compositing happen locally in the visitor’s browser. The
camera image and face landmarks are never uploaded. -
Do I need a DokimiAI account?
-
No. No account and no key is needed. This plugin is complete and fully
functional on its own. -
The try-on opens but the product image (earring) does not appear
-
The overlay image URL must use https://. On HTTPS stores, http:// images are
blocked by the browser as mixed content. Use the “Add image” button, or enter
an https:// URL.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“DokimiAI Try-On for WooCommerce” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “DokimiAI Try-On for WooCommerce” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.5.0
- Removed the 20-product limit — try-on can now be enabled on any number of products. The plugin has no built-in restrictions of any kind.
- Added uninstall cleanup: the plugin’s own options are removed when it is deleted. Per-product try-on settings are kept, so re-installing restores them.
1.4.0
- The MediaPipe Face Mesh runtime binaries (.wasm/.data/.binarypb) are now delivered by the DokimiAI service CDN (cdn.dokimiai.io) from a fixed, versioned, immutable path with SHA256 checksums published in the readme, instead of being bundled in the plugin. This also reduces each store’s own bandwidth. All of the plugin’s JavaScript continues to load from your own site.
- Added an “External services” description of the service, the server called, and the account requirement, per the WordPress.org plugin guidelines for service plugins.
- Documented that an internet connection is required for the browser to fetch the runtime assets.
1.3.2
- Removed an unused, empty (0-byte) file from the MediaPipe runtime (face_mesh_solution_simd_wasm_bin.data — referenced by nothing).
- Documented the complete MediaPipe file inventory in the readme; every file is verified to load at runtime via network capture on a clean WordPress install.
1.3.1
- Removed the remaining plan constants and filters — the plugin is a single free edition with no plan branching.
- Removed an unused REST endpoint (local usage counter) and its admin display.
- Documented the 20-product try-on limit in the feature list.
1.3.0
- First WordPress.org release. Provides earring try-on, sharing, and an optional skin-smoothing touch-up.
- The “Try On” button CSS is enqueued via wp_add_inline_style() rather than printed inline.
- Try-on can be enabled on up to 20 products.
- Fully internationalized: the PHP UI and the JavaScript bundle are translatable; English is the source, with a Japanese translation bundled.
