MorphCast SDK is a native JavaScript engine for Real-Time Face Analysis, based on Deep Neural Networks.
It works directly in the web-browser of mobile and desktop platforms.
User's face is analyzed through the input camera device, at an average speed rate of 10 times per second on a mobile device, and even up to 30 per second on desktop. Output results are returned as ready-to-use events, with data already filtered for your convenience.
You can easily add an emotion and demographic analysis layer to your website, landing page or App, creating exciting, adaptive digital experiences. MorphCast is being used across digital campaigns, corporate learning, eLearning, e-commerce, digital out-of-home and many other uses.
You can store all data produced in local memory, in local storage or properly send it to your server.
Copy and paste the following code snippet inside the body of an HTML page, or fork this JSFiddle.
<body>
...
<script src="https://ai-sdk.morphcast.com/v1.16/ai-sdk.js"></script>
<script>
CY.loader()
.licenseKey("insert-here-your-license-key")
.addModule(CY.modules().FACE_EMOTION.name)
.load()
.then(({ start, stop }) => start());
window.addEventListener(CY.modules().FACE_EMOTION.eventName, (evt) => {
console.log('Face emotion result', evt.detail);
});
</script>
...
</body>Generate now your license key here.
You shall serve the web page file using a web server, remote or local (e.g. http://localhost).
Since camera access requires https, when using a private network ip (e.g. https://192.168.x.x) or a public domain, you shall enable SSL in your web server configuration.
The SDK will automatically open and manage a camera stream internally, as well as the browser camera request.
Links:
Here, a list of available modules:
- FACE_DETECTOR
- FACE_POSE
- FACE_AGE
- FACE_EMOTION
- FACE_GENDER
- FACE_FEATURES
- FACE_AROUSAL_VALENCE
- FACE_ATTENTION
- FACE_WISH
You can combine them as you like, e.g. to load FACE_DETECTOR and FACE_AGE:
loader = CY.loader()
.addModule(CY.modules().FACE_DETECTOR.name, {})
.addModule(CY.modules().FACE_AGE.name, {})You can find the complete documentation, here.
Minimum Reccomended:
- Wasm Support
- Javascript Enabled Browser
- Updated Browser and OS:
- Chrome 67+ for Android 5+, or Windows 7+, macOS 10.10+, Linux Ubuntu 14.04+, Debian 8+, openSUSE 13.3+, or Fedora Linux 24+
- Safari 11.3+ for iOS 11.3+, or macOS 10.12+
- Firefox 63+ for Windows 7+, macOS 10.9+, Linux (GTK+ 3.4, GLib 2.22, Pango 1.22, X.Org 1.0, libstdc++ 4.6.1)
- Edge 16+ for Windows 10+
KNOWN DEVICE ISSUES:
- iOS up to version iOS 11 doesn't support GetUserMedia.
- iOS up to version iOS 11.3 doesn't support the needed Wasm features.
- Micorosoft Edge up to version 16 doesn't support Wasm.
- Microsft Internet Explorer is not supported.
- Opera mini is not supported.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent