MorphCast Emotional AI HTML5 SDK – FAQ

Last Update April 19, 2024

What is MorphCast Emotion AI HTML5 SDK?

The MorphCast Emotion AI HTML5 SDK is a highly advanced JavaScript API that utilizes deep neural network AI technology for analyzing spontaneous facial expressions and features. It’s designed to work directly within web browsers on both mobile and desktop platforms, as well as in a webview inside mobile apps. This SDK specializes in real-time emotion recognition and analysis, making it an ideal tool for creating interactive and emotionally responsive digital projects.

Is there a way to graph or download data collected by MorphCast Emotion AI HTML5 SDK?

By enabling the statistic module, and using the Statistic web app, you will be able to view the data collected in a complete dashboard and download the related data in CSV or JSON format. For detailed information about graphs and data represented, please check out our guide to interpret data generated by Emotion AI.

What key features and capabilities has the MorphCast Emotion AI HTML5 SDK?

– Client-Side Processing: The SDK processes AI tasks directly on the user’s device, ensuring faster processing, reduced latency, and enhanced privacy.
– Small model, less than 1MB pure JS code.
– Consult the Advantages of choosing our client-side Emotion AI.
– Easy Integration: The quick start configurator provided by MorphCast allows for simple and rapid integration of the SDK into web pages, making it accessible even for those with limited programming experience.
– Comprehensive Documentation: Detailed technical documentation is available for developers, covering all aspects of the SDK, including usage examples and best practices.
– Privacy and Compliance: MorphCast Emotion AI prioritizes privacy, ensuring that personal data (like the viewer’s facial image) is processed on the client-side and immediately deleted without being transmitted to external servers.

How is MorphCast Emotion AI HTML5 SDK different from alternatives?

The MorphCast Emotion AI HTML5 SDK takes a client-side approach, processing AI tasks directly on the user’s device instead of relying on a server. This offers benefits such as faster processing, reduced latency, and enhanced privacy. To explore the advantages of choosing our client-side Emotion AI, please visit the following site page: advantages of choosing our client-side Emotion AI.

Is MorphCast’s Emotion AI HTML5 SDK the smallest facial emotion recognition AI model in the world?

We have never seen anything like it, but we could be proven wrong tomorrow!
The MorphCast Emotion AI HTML5 SDK is characterized by its exceptionally small footprint, with the entire model being less than 1MB in size. This compact size is achieved by packaging the model into pure JavaScript (JS) code. This lightweight nature of the SDK is significant for several reasons:
– Fast Loading and Performance: Due to its small size, the SDK can be loaded quickly into web pages or apps, ensuring minimal impact on the loading times. This is particularly important for maintaining a smooth and responsive user experience.
– Efficient Resource Utilization: The compact model size means that it requires fewer computational resources. This allows it to run efficiently even on devices with limited processing power, such as smartphones and tablets.
– Ease of Integration: Being pure JS code, the SDK can be easily integrated into existing web pages and applications without the need for complex setups or dependencies. This makes it accessible even to developers with basic JavaScript knowledge.
– Broader Accessibility: The small size makes the SDK more accessible across a wide range of devices and platforms, ensuring consistent performance regardless of the user’s device.
– Reduced Bandwidth Usage: For applications that are often used on mobile devices or in areas with limited internet connectivity, the small size of the SDK means less data consumption, which is beneficial for users with limited data plans or slower internet connections.
In summary, the small model size of less than 1MB in pure JavaScript code makes the MorphCast Emotion AI HTML5 SDK a highly efficient and versatile tool for developers looking to incorporate emotion AI into their web applications and digital projects.

How can I get a MorphCast Emotion AI HTML5 SDK full features license?

You can immediately obtain it for free by leaving your name and email here.

How many hours a Javascript programmer needs to integrate the MorphCast Emotion AI HTML5 SDK in a website?

With the quick start configurator, it takes just a few clicks and less than a minute to see MorphCast Emotion AI HTML5 SDK integrated into a web page, webapp or app webview. This feature is designed to provide a seamless and hassle-free integration experience, allowing developers to quickly leverage the power of Emotion AI in their applications.
This makes the SDK accessible even to those with limited programming experience, streamlining the process of adding advanced emotion AI capabilities to digital projects.

Besides the quick start configurator, is there any detailed library documentation?

Absolutely! We understand the importance of providing comprehensive technical documentation for programmers to fully leverage the potential of the MorphCast Emotion AI HTML5 SDK. Our documentation is designed to cater to the needs of even the most demanding programmers.
The technical documentation we have prepared covers all aspects of the SDK, offering detailed explanations, usage examples, and best practices. It provides a step-by-step guide that allows programmers to understand the library’s functionalities, explore advanced features, and effectively integrate it into their applications.

How fast does the MorphCast AI HTML5 SDK start up?

The MorphCast AI HTML5 SDK ensures fast startup times, typically under 2 seconds in over 95% of cases. This rapid initialization is crucial because it allows the AI SDK to promptly respond to viewers by detecting faces emotions as soon as a web page is loaded. If the page takes too long to load, viewers may mistakenly believe that the AI functionality is not working, leading to higher bounce rates and decreased engagement. The SDK’s small size, under 1 MB (and potentially even smaller depending on the modules utilized), further contributes to its swift startup time.

What platforms does the MorphCast Emotion AI HTML5 SDK support?

MorphCast Emotion AI HTML5 SDK supports all HTML5-compliant browsers or apps’ webviews.

How can I integrate the MorphCast SDK into my iOS or Android application?

To successfully integrate the MorphCast SDK into your iOS or Android app, use a hidden web view within your application. This setup allows the SDK to operate seamlessly within the mobile app environment without necessarly displaying the video and picture in the web view itself. Here’s a simplified process:
– Native App Functionality: Your app should continue to display videos or pictures in its native environment, avoiding the need to embed them in a web view.
– Frame Acquisition: As users interact with the content, your app needs to handle the acquisition of frames from the camera to capture facial expressions in real-time.
– Communication with SDK: Establish a communication channel between your native app and the hidden web view. This channel is used to send the captured frames to the MorphCast SDK for emotion analysis.
– Receiving Analysis Results: The SDK analyzes the frames and sends back the results, i.e., detected emotions, to your native app through the communication channel.
– Utilizing the Results: Use the analysis results to enhance user experience by understanding their reactions to the content viewed.
For a step-by-step guide on this integration process, including how to set up the communication channel and handle frame acquisition, please consult the tutorial section of our documentation. Look for “MorphCast SDK Android Mobile Integration” and “MorphCast SDK iOS Mobile Integration” for platform-specific instructions.

Is there any SDK available for React Native Module?

We do not have an SDK for React Native, you can integrate our existing HTML5 SDK into your React Native application using a web view. This approach is similar to the integration process detailed in our documentation for iOS and Android apps. It is sufficient that your native app, which manages the camera flow, passes the frames to a webview. The webview should point to a web page where the MorphCast SDK is set up to analyze the passed frames. Once the analysis is completed, the results can be returned to the native app using the Javascript Interface mechanism.
For detailed guidance on SDK functionalities, including callbacks and data handling, please refer to the relevant sections of our user documentation. This documentation will provide insights into configuring the SDK, handling events, and processing emotion analysis results, which are adaptable to a React Native context.

How to integrate MorphCast Emotion AI HTML5 SDK into Unity-based games?

Currently we do not have a ready-to-use Unity plugin for integrating MorphCast Emotion AI HTML5 SDK into Unity-based games. 
However, there are two potential methods for integration, depending on the deployment platform of your game:
WebGL Integration: If your game is deployed as a web application, you can embed both the Unity game and our SDK in the same webpage. Unity’s capabilities allow it to interact with browser scripts, facilitating communication between your game and our SDK directly in its native JavaScript/HTML5 format. For details on this process, please refer to Unity’s documentation on interacting with browser scripting.
Native Desktop/App Integration: For games developed for desktop or as native apps, you might consider using a plugin such as unity-webview to incorporate a webview within the Unity application. This would allow the SDK to run within the webview. Note that this method might present additional technical challenges, particularly with webcam access and SDK performance within the webview environment.
Please be aware that both methods require a blend of Unity and web technology skills due to the need to bridge different technologies.

Is there an API that allows us to submit an image as payload and in return, receive the emotion detected in that image?

We don’t offer a server-side API for image processing. Our SDK is exclusively built for client-side functionality, which comes with numerous significant benefits. These advantages are detailed on our Advantages page.

How can the MorphCast Emotion AI HTML5 SDK fluidly run deep learning models on a browser?

The MorphCast Emotion AI HTML5 SDK utilizes optimized deep learning models that are specifically designed to run efficiently on the user’s device. By harnessing the power of the user’s graphics processing unit (GPU), the SDK accelerates processing and maximizes the GPU capabilities through backends like WebAssembly and WebGL. This approach ensures that the MorphCast AI HTML5 SDK achieves faster performance and reduced execution time, surpassing CPU-native apps even on mobile devices. Furthermore, the lightweight deep learning models developed and fine-tuned by the MorphCast team deliver superior performance in terms of size and execution time compared to alternative solutions.

How does the SDK handle face detection reliability issues due to varying distances of individuals from the camera?

Our SDK is optimized for mobile usage, where the expected scenario involves the face occupying a significant portion of the camera frame. To maintain high detection reliability and avoid detecting irrelevant faces (e.g., faces in background photographs), our face detector is calibrated to ignore faces that appear very small relative to the entire frame. However, we understand that different use cases may involve varying distances between the user and the camera, which can affect the reliability of valence, arousal, and attentiveness measurements.
To accommodate for these scenarios, our SDK includes adjustable sensitivity settings. By modifying the resolution parameter that is passed to the camera’s frame processor, users can fine-tune the face detection sensitivity to better detect faces at different distances. This adjustment helps in enhancing the accuracy of the measurements provided by our SDK, ensuring reliable analysis across a wider range of distances from the camera.
Here is an example of the updated snippet with the additional parameters in red:



This parameter affects the performance of the neural network, exacerbated by the increased resolution of the image being processed. To avoid a high load on the device’s CPU/GPU, our SDK has a dynamic power-saving feature that limits its performance to reduce power consumption and to minimize impact on other applications running on the device. It’s important to note that it is optimized for battery-operated devices, such as mobile phones.
Increasing the resolution might lead to a slowdown in the interval between one detection and the next (network cycle on frames).
To mitigate this, I suggest adjusting the powerSave parameter in the SDK configuration adding:

.powerSave(0.2) // Optional – Default 0.4

This parameter sets the power save percentage for frame processing cycles, ranging from 0 (best effort) to 1 (high energy saving). By default, it is set to 0.4, balancing resource usage and processing capability. Lowering this value to 0.2 or less can allocate more resources to the SDK.
However, this should be done considering the hardware’s capability to handle increased resource usage.

How is MorphCast Emotion AI HTML5 SDK different from Google Tensorflow.js? Is it a competitor?

The MorphCast Emotion AI HTML5 SDK and Google TensorFlow.js are both tools for building machine learning models that can be executed within a web browser environment. However, they serve different purposes. The MorphCast Emotion AI HTML5 SDK focuses specifically on real-time emotion recognition and analysis. It is designed to provide market-ready solutions for emotion-related tasks, offering comprehensive functionalities in this domain. On the other hand, TensorFlow.js is a more general-purpose machine learning library that allows developers to build various types of machine learning models to run in a browser. It offers a wide range of capabilities beyond emotion recognition and analysis, making it suitable for diverse machine learning tasks. While TensorFlow.js is a versatile and powerful library, it does not provide ready-made solutions out of the box, aside from a few examples. In contrast, the MorphCast AI HTML5 SDK utilizes the WebDNN library as the engine for running deep learning models directly in the browser. WebDNN is an open-source project that the MorphCast team actively contributes to, and it provides the necessary infrastructure for efficient execution of deep learning models.

Does my device/app need an Internet connection to run MorphCast Emotion AI HTML5 SDK?

Yes, the MorphCast Emotion AI HTML5 SDK is capable of running locally on the user’s device without an Internet connection. However, please note that an Internet connection is necessary for downloading the library, as well as for licensing and support purposes.

What kind of things can  MorphCast Emotion AI HTML5 SDK be used for? What sectors/industries can use the MorphCast Emotion AI HTML5 SDK?

To explore the versatility of the MorphCast Emotion AI HTML5 SDK, we recommend exploring our extensive collection of use cases on our site, the showcases and the demonstrations. These resources showcase the wide range of applications where the SDK can be utilized, providing you with a broad idea of the library’s potential uses.

How much does MorphCast Emotion AI HTML5 SDK cost?

Our pricing structure is designed to be flexible and adapts to your monthly usage of license keys. Each month begins with a generous allowance of free usage. Should your usage exceed this complimentary threshold, your plan will seamlessly transition to a higher tier. On the other hand, if your usage diminishes in the subsequent month, your plan will correspondingly shift to a lower tier, mirroring your decreased utilization.
For a comprehensive understanding of the Emotion AI HTML5 SDK pricing, we invite you to visit our dedicated page: Emotion AI HTML5 SDK Plan & Pricing. This page will provide you with all the necessary details and information regarding our pricing structure.

How can I ensure billing consistency if my license key is visible in the client-side source code?

While it is true that the license key is exposed on the client-side because our AI processes data locally, we have measures in place to ensure billing transparency and accuracy. Every month, in cases where there is a charge, our clients receive a detailed usage report. This report includes daily usage broken down by referrer, allowing clients to review the domains and pages that have utilized the service. Clients are given a 30-day window either to make the payment or to raise a dispute if they identify domains in the report that do not belong to them. This system ensures that clients have full control over their billing and can verify the legitimacy of the charges incurred.

How Do I Make Payments?

If you exceed the minimum threshold specified in the pricing plans, you will receive a report of your daily consumption and the most cost-effective plan will be automatically applied to you, along with a proforma invoice detailing the amount for the respective plan. You will have the option to make payment within 30 days using one of the methods indicated in the proforma invoice. This process repeats every month, so you also renew the free plan’s bonus every month. For more information and details, please refer to the payment chapter of our terms of service.

Is it possible to obtain a license for free, non-commercial use?

Yes, if you are affiliated with a university or are conducting research, you may be eligible to obtain a no-cost license for non-commercial use. Startups may also receive special consideration for such licenses. Please proceed to acquire the necessary license through our web site channel, and then send us an email (info@morphcast.com) to inform us of your status. This will allow us to verify that you qualify for a no-cost, non-commercial license.

Looking at the report that you kindly sent me together with the proforma invoice, how is this use of 22 hours possible?

Leaving a page open with the SDK active causes the server to log large usage time.
To prevent long sessions and conseguently large usage time, our SDK automatically times out after 3 hours, although it should be changed in the configuration of the SDK as per this example:


Tip: For optimal usage, remember to both start and stop the SDK in your application; charges apply only for the time between these actions, even if multiple sessions occur.
Could you check if there’s a point in your project where the SDK can be stopped to avoid unnecessary usage? It could be a nice practice.

What about Privacy?

MorphCast Emotion AI is engineered to neither identify nor recognize individuals. The camera on the device functions as a sensor for MorphCast AI, rather than a video recording tool. The viewer’s facial image, considered personal data, is exclusively processed on the client-side and is promptly discarded. These images are never sent to any external servers. For a detailed understanding, please refer to our Emotion AI Privacy Policy.

Consult also these additional FAQs:

  1. Emotion AI & Facial Emotion Recognition (FER)
  2. MorphCast Emotion AI
  3. Emotion AI Interactive Media Platform
  4. Emotion AI Media Player
  5. Emotion AI HTML5 SDK (this document)
  6. Emotion AI Web Apps
  7. MorphCast for ChatGPT
  8. MorphCast AI For ZOOM
  9. MorphCast Video Conference
  10. MorphCast for Privacy
  11. Cookie free domain