3D wireframe face for a website chat assistant (Three.js / WebGL)
Budget / Salary$250–750
TypeFreelance project
LocationRemote
Posted4 hours ago
We’re a US electronics buyback company adding an animated face to the chat assistant on our website. The look is a glowing gold wireframe face that pushes out of a flat grid “wall” when a chat opens, as if through a rubber sheet, and sinks back when the chat ends. While the assistant talks, the mouth moves in time with its voice. A storyboard is attached.
Who we’re looking for
Strong Three.js / WebGL experience. Please show live demos, not just videos.
3D face modeling and rigging: a realistic face mesh with good topology, a jaw and lips that move cleanly, and ideally blendshapes for mouth shapes (visemes).
Lip sync to audio. Our assistant speaks through the browser’s built-in voice, so you’ll get a 0–1 “loudness” value, not the audio file itself.
Performance work for phones: smooth on a mid-range Android phone in Chrome.
The look
A gold wireframe coming out of my white screen. Our colors are
#cd9901 (brand gold) and
#f0c433 (glow).
A structured, defined face: cheekbones, nose, lips and open eyes, like the storyboard. A soft or blobby face won’t work.
The grid behind the face bends around it, like a rubber sheet.
The face must be original. It can’t resemble a real person, a celebrity, or any existing character.
What it must do
Four states: idle, listening (leans in slightly), thinking (subtle pulse), speaking (mouth moves).
Rise out of the wall when the chat opens.
Respect “reduce motion” settings: appear without the animation, with minimal movement.
Fail quietly: if the device can’t run WebGL, show nothing rather than an error.
Deliverables
A TypeScript module using Three.js 0.170 with this interface: createFace(container) → { setMode(mode), setAudioLevel(0–1), destroy() }. We’ll share a working placeholder so you can see exactly how it plugs in.
The face model as .glb, plus the source files: Blender or similar, and any textures.
Total download under 2 MB.
A short note on how to change colors and animation speed.
Rights
Full commercial rights transfer to us. Any third-party assets must allow commercial use, and you must list them with their licenses. Nothing “non-commercial” and no unlicensed scans.
Milestones
A still image or short clip of the face, for us to approve the look.
A working animated demo page.
The final module and source files.
To apply, answer:
A link to a Three.js or WebGL project of yours that runs live in a browser.
Have you rigged a face for lip sync before? How would you drive the mouth from a 0–1 loudness value?
How would you keep this smooth on a mid-range Android phone?
Your price and timeline for each milestone.
Who we’re looking for
Strong Three.js / WebGL experience. Please show live demos, not just videos.
3D face modeling and rigging: a realistic face mesh with good topology, a jaw and lips that move cleanly, and ideally blendshapes for mouth shapes (visemes).
Lip sync to audio. Our assistant speaks through the browser’s built-in voice, so you’ll get a 0–1 “loudness” value, not the audio file itself.
Performance work for phones: smooth on a mid-range Android phone in Chrome.
The look
A gold wireframe coming out of my white screen. Our colors are
#cd9901 (brand gold) and
#f0c433 (glow).
A structured, defined face: cheekbones, nose, lips and open eyes, like the storyboard. A soft or blobby face won’t work.
The grid behind the face bends around it, like a rubber sheet.
The face must be original. It can’t resemble a real person, a celebrity, or any existing character.
What it must do
Four states: idle, listening (leans in slightly), thinking (subtle pulse), speaking (mouth moves).
Rise out of the wall when the chat opens.
Respect “reduce motion” settings: appear without the animation, with minimal movement.
Fail quietly: if the device can’t run WebGL, show nothing rather than an error.
Deliverables
A TypeScript module using Three.js 0.170 with this interface: createFace(container) → { setMode(mode), setAudioLevel(0–1), destroy() }. We’ll share a working placeholder so you can see exactly how it plugs in.
The face model as .glb, plus the source files: Blender or similar, and any textures.
Total download under 2 MB.
A short note on how to change colors and animation speed.
Rights
Full commercial rights transfer to us. Any third-party assets must allow commercial use, and you must list them with their licenses. Nothing “non-commercial” and no unlicensed scans.
Milestones
A still image or short clip of the face, for us to approve the look.
A working animated demo page.
The final module and source files.
To apply, answer:
A link to a Three.js or WebGL project of yours that runs live in a browser.
Have you rigged a face for lip sync before? How would you drive the mouth from a 0–1 loudness value?
How would you keep this smooth on a mid-range Android phone?
Your price and timeline for each milestone.
Apply on Freelancer →
Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.