{"id":25006681,"url":"https://github.com/markandre13/makehuman.js","last_synced_at":"2025-04-12T15:52:38.135Z","repository":{"id":132463753,"uuid":"299397527","full_name":"markandre13/makehuman.js","owner":"markandre13","description":"A MakeHuman variant with different features.","archived":false,"fork":false,"pushed_at":"2024-08-09T19:19:23.000Z","size":299193,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-08-10T11:25:55.117Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://markandre13.github.io/makehuman.js/","language":"TypeScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/markandre13.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.ASSETS.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-09-28T18:29:14.000Z","updated_at":"2024-08-09T19:19:26.000Z","dependencies_parsed_at":"2023-10-28T15:26:51.409Z","dependency_job_id":"a41ec0f5-3dfa-4b12-8452-5be232f28467","html_url":"https://github.com/markandre13/makehuman.js","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/markandre13%2Fmakehuman.js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/markandre13%2Fmakehuman.js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/markandre13%2Fmakehuman.js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/markandre13%2Fmakehuman.js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/markandre13","download_url":"https://codeload.github.com/markandre13/makehuman.js/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248592063,"owners_count":21130170,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-02-05T01:50:41.783Z","updated_at":"2025-04-12T15:52:38.107Z","avatar_url":"https://github.com/markandre13.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# makehuman.js\n\nA [Makehuman](http://www.makehumancommunity.org) variant with different features.\n\n\u003cdiv style=\"text-align:npm center\"\u003e\n  \u003cimg src=\"screenshot.png\" /\u003e\n\u003c/div\u003e\n\n## Currently Working On\n\nAnimation!\n\n* Face animation with\n[MediaPipe](https://developers.google.com/mediapipe)'s Face Landmarker\n* Body animation with [Chordata](https://chordata.cc)\n\nThis needs the [makehuman.js backend](https://github.com/markandre13/makehuman.js-backend) to be running locally.\n\nOnce that is working, the next step will be to record animations and export them to Blender.\n\n## Current Status\n\n* Have a look at [build 2023-10-31](https://markandre13.github.io/makehuman.js/)\n* Edit, load and save morph\n* Pose and load pose\n* Select one of 32 pre-defined facial expressions and/org edit facial pose units\n* Render various proxy meshes instead of the basemesh\n* Export the mesh with rig and texture coordinates as Collada for Blender\n* Nothing else... 😅\n\n## How to build\n\n* npm install\n* npm run dev:prepare\n* npm run dev:build\n* npm run dev:serve (in another terminal)\n\n## Why?\n\n* I've been using MakeHuman for more than a decade but often struggled with the UI and the source code.\n* I'm up to [something](https://mark13.org) with [Blender](https://www.blender.org) and [Chordata](https://chordata.cc) and in need for full artistic control of the toolchain. 😎\n\n## Animation\n\n### Capturing\n\n* [MediaPipe](https://developers.google.com/mediapipe)\n\n  Contains image recognition for facial landmarks, fingers and body.\n\n* [Chordata](https://chordata.cc)\n\n  Body pose capturing using 15 or 17 MARGS (accelerometer + gyroscope + magnetometer) attached to the body.\n\n* [The FreeMoCap Project](https://freemocap.org)\n\n  Not used in makehuman.js (yet): Python project which bundles and extends various free motion capture tools.\n\n### Face\n\n* https://en.wikipedia.org/wiki/Facial_Action_Coding_System\n\n  For psychology. Emotions only. Not speech. Doesn't detail muscle movements.\n\n* Facial Representations: Modeling, Rigging, Retargeting; Iain Mattherys; 2012-03-11; Disney Research, Pittsburgh [PDF](https://www.cs.cmu.edu/~yaser/Lecture-8-Face%20Representation.pdf)\n\n* Siggraph 2021 [3D Morphable Face Models - Past, Present and Future](https://youtu.be/UGtIwWv1dds?si=-FJNP9f_wYKuuPCc)\n\n  * https://github.com/3d-morphable-models/curated-list-of-awesome-3D-Morphable-Model-software-and-data\n\n* MakeHuman uses a facial rig, which can be animated by combining 60 predefined poses (aka. pose units)\n\n* Google Mediapipe / Apple ARKit / ...\n\n  52 Blendshapes/Morph Targets\n\n  * https://hinzka.hatenablog.com/entry/2021/12/21/222635#Blendshapes-LIST\n  * https://arkit-face-blendshapes.com\n  * https://github.com/ICT-VGL/ICT-FaceKit\n    Blendshapes from scans. Here's how the data can look:\n    * https://news.productioncrate.com/free-3d-facial-expression-blendshapes-pack/\n    * Video: https://youtu.be/QAa2j-B2fa4?si=4d_xlBEOfO2FbOAg\n\n### Body\n\nTBD\n\n## How does Makehuman work?\n\n### Morph\n\n#### Data\n\n* data/3dobjs/base.obj contains a 3d model of a human body, called the **base mesh**.\n\n  It is completely made of quads, which well give good results when applying\n  a Catmul and Clark subdivision to it.\n\n  Further reading: [Mesh Topology](http://www.makehumancommunity.org/wiki/Documentation:Professional_mesh_topology).\n\n* data/target/ contains 1258 [morph targets](https://en.wikipedia.org/wiki/Morph_target_animation),\n  which can deform the base mesh's shape, gender, age and ethnicity.\n\n  The morph targets are handmade by editing the basemesh in a 3d editor and\n  extracting the changes with [MakeTarget](https://github.com/makehumancommunity/maketarget-standalone).\n\n* data/modifiers/ bundles those morph targets into 249 more user friendly **modifiers**\n\n#### Code\n\n```js\n// render's the morphed base mesh\nfunction render(canvas: HTMLCanvasElement, scene: HumanMesh)\n\n// the morphed base mesh\nclass HumanMesh {\n    // input\n    obj: Mesh        // the base mesh from the Wavefront Object\n    human: Human     // the morph targets\n\n    // processing\n    update()         // calculate vertex from obj and human\n\n    // output\n    vertex: number[] // the morphed obj.vertex\n}\n\n// aggregates all the modifiers and creates a list of morph targets\nclass Human {\n    // input\n    modifiers: Map\u003cstring, Modifier\u003e\n    modifierGroups: Map\u003cstring, Modifier[]\u003e\n\n    // output \n    targetsDetailStack: Map\u003cstring, number\u003e // morph targets\n\n    // for posing and skinning (see below)\n    meshData!: WavefrontObj\n    __skeleton!: Skeleton\n}\n\n// creates a list of ui elements (sliders, text fields) to edit the modifier values\nfunction loadSliders(filename: string)\n```\n\n### Pose\n\nThe skeleton aggregates bones and weights. Bones can be rotated.\n\nPosing the skeleton directly, especially those in the face, can be a bit tedious. Hence there are pre-defined _pose units_, e.g. \"LipsKiss\" or \"HandBendOutLeft\", which can control multiple bones at once while also restricting bone movement.\n\n#### Data\n\n* Skeleton\n\n  * data/rigs/default.mhskel the bones making up the skeleton\n\n    For the actual bone positions little cubes within the mesh are referenced,\n    so when the mesh is morphed, the skeleton is morphed along with it.\n\n    Further reading: [Base Mesh and Rig](http://www.makehumancommunity.org/wiki/Documentation:Basemesh).\n  \n  * data/rigs/default_weights.mhw the weights each bone has on each vertex\n\n* Pose Units\n\n  * data/poseunits/body-poseunits.json defines 63 pose units for the body.\n\n  * data/poseunits/face-poseunits.bvh and face-poseunits.json defines 60\n    pose units for the face.\n\n  * data/expressions/*.mhpose defines 32 face expressions based upon pose\n    units, e.g. like \"laugh01\" or \"fear02\".\n\n#### Code\n\n```js\n// aggregates the bone tree and weight list\nclass Skeleton {\n}\n\n// a single bone\nclass Bone {\n    parent?: Bone\n    children: Bone[] = []\n\n    name: string\n\n    yvector4?: vec4 // direction vector of this bone (along y-axis)\n    matRestGlobal?: mat4 // bone relative to world\n    ...\n\n    // user defined rotation\n    matPose: mat4\n}\n\n// weights\nclass VertexBoneWeights {\n    // bone name -\u003e [[vertex numbers, ...], [weight for vertex, ...]]\n    _data: Map\u003cstring, Array\u003cArray\u003cnumber\u003e\u003e\u003e\n}\n```\n\n### Proxy\n\nProxies provide additional meshes, e.g. teeth, tounge, eyes, alternative body\nmeshes and cloth.\n\nThe proxy files contain data which is used to transform the morphed/posed basemesh into a proxy mesh.\nThese files are created with [MakeClothes](https://github.com/makehumancommunity/community-plugins-makeclothes).\n\n```js\nclass Proxy {\n    // return proxy mesh vertices, adjusted to basemesh morph/pose\n    getCoords(baseMeshVertices: number[]): number[]\n}\n```\n\n## Development\n\n```sh\n    # install packages\n    npm install\n\n    # populate data directory\n    npm run dev:prepare\n\n    # run (in separate terminals)\n    npm run dev:build\n    npm run dev:serve\n```\n\n## Run single test\n\n```sh\n    npm run dev:test --file=build/test/skeleton/Skeleton.spec.js\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarkandre13%2Fmakehuman.js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmarkandre13%2Fmakehuman.js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarkandre13%2Fmakehuman.js/lists"}