Good day,
We are a startup working on creating a robot, one of the functions of which is to talk to its owners. This will be implemented in such a way that a tablet will be installed on the robot, and on the display, there will be a cat's head (html5 web page). We want this cat to "talk" not as a sequence of images with an open/closed mouth (as it is currently implemented), but as an animation.
As a result of the project, we should receive an animation and js code to control it, which we can integrate into our html5 web page. This should be done in any of these technologies (or similar, but not Unity):
PixiJS
Three.js
Phaser
We want to cover the following use cases (with corresponding JS API functions and based on our cat images):
1. Pronunciation of sounds (parameter - one of our sounds)
2. Sleep (sleep animation with closed eyes and breathing, possibly with letters Z flying out of the mouth)
3. Waiting-boredom (blinking, eye movement)
4. Setting the direction vector of the gaze, level of eye opening, level of mouth opening, and possibly level of eyebrow raising manually
Then we will call the corresponding functions from our code based on the current state of the robot, and the corresponding animation will be displayed on the screen.
Currently, we have tried to simulate conversation by changing the shape of the mouth according to the sounds being pronounced; you can see how it looks in the attached file.
But we would like to "bring to life" the cat a bit more, like in this video:
https://dribbble.com/shots/17046325-Cat-face-rig.