All Projects → takahirox → A Mmd

takahirox / A Mmd

Licence: mit
A-Frame MMD component

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to A Mmd

lvr
👓 Augmented Reality for everyone - Out of the world experiences
Stars: ✭ 92 (+24.32%)
Mutual labels:  threejs, vr, webvr, aframe, three-js
Awesome Aframe
[DISCONTINUED] Collection of awesome resources for the A-Frame WebVR framework.
Stars: ✭ 1,310 (+1670.27%)
Mutual labels:  aframe, threejs, vr, webvr
aframe-registry
[DISCONTINUED] Curated collection of community A-Frame components.
Stars: ✭ 76 (+2.7%)
Mutual labels:  threejs, vr, webvr, aframe
3dio Js
JavaScript toolkit for interior apps
Stars: ✭ 255 (+244.59%)
Mutual labels:  aframe, threejs, vr, webvr
Patches
Patches is a visual programming editor for building WebVR and WebGL experiences.
Stars: ✭ 164 (+121.62%)
Mutual labels:  threejs, three-js, vr, webvr
Thehallaframe
WebVR demo that displays art
Stars: ✭ 120 (+62.16%)
Mutual labels:  aframe, threejs, vr, webvr
Aframe Effects
A VR Ready Post processing framework for Three.js and/or A-Frame
Stars: ✭ 176 (+137.84%)
Mutual labels:  aframe, threejs, vr, webvr
Aframe
🅰️ web framework for building virtual reality experiences.
Stars: ✭ 13,428 (+18045.95%)
Mutual labels:  aframe, threejs, vr, webvr
Aframe Inspector
🔍 Visual inspector tool for A-Frame. Hit *<ctrl> + <alt> + i* on any A-Frame scene.
Stars: ✭ 469 (+533.78%)
Mutual labels:  aframe, threejs, vr, webvr
a-blast
💥 Save the World From the Cutest Creatures in the Universe!
Stars: ✭ 116 (+56.76%)
Mutual labels:  threejs, vr, webvr, aframe
A Painter
🎨 Paint in VR in your browser.
Stars: ✭ 539 (+628.38%)
Mutual labels:  aframe, threejs, vr, webvr
Ideaspace
😎 Create interactive 3D and VR web experiences for desktop, mobile & VR devices
Stars: ✭ 344 (+364.86%)
Mutual labels:  aframe, threejs, vr, webvr
Aframe Vimeo Component
Stream Vimeo videos into WebVR.
Stars: ✭ 62 (-16.22%)
Mutual labels:  aframe, threejs, vr, webvr
Aframe Forcegraph Component
Force-directed graph component for A-Frame
Stars: ✭ 60 (-18.92%)
Mutual labels:  aframe, threejs, vr
aframe-mirror-component
Mirror effect material that works with snapshots of the scene for A-Frame
Stars: ✭ 29 (-60.81%)
Mutual labels:  threejs, vr, webvr
hologram
Hologram Framework | All-in-one WebVR creation.
Stars: ✭ 84 (+13.51%)
Mutual labels:  threejs, webvr, aframe
pacman
Pacman WebVR using Aframe
Stars: ✭ 20 (-72.97%)
Mutual labels:  vr, webvr, aframe
WebVRExamples
yonet.github.io/webvrexamples/examples/cubes.html
Stars: ✭ 19 (-74.32%)
Mutual labels:  vr, webvr, three-js
Worlds2
Building Virtual Reality Worlds using Three.js
Stars: ✭ 34 (-54.05%)
Mutual labels:  threejs, vr, webvr
aframe-xylayout
Flexbox like 2D layout + UI components for A-Frame.
Stars: ✭ 23 (-68.92%)
Mutual labels:  vr, webvr, aframe

A-Frame MMD component

a-mmd is an A-Frame MMD component which enables MMD models to dance and sing.

screenshot screenshot2

Demo

Demo Dance

Demo Posing

Dependencies

Ammo.js

You need to load ammo.js in a page where a-mmd works

https://github.com/kripken/ammo.js/

A-Frame Outline effect component

To draw outline, use A-Frame Outline effect component.

https://github.com/takahirox/aframe-outline

Properties

mmd

Properties type Default Value Description
audio string '' Audio file path.
autoplay boolean true Automatically start audio and dance when they're ready.
volume number 1.0 Audio volume.
audioDelayTime number 0.0 How long audio delays to start to play since model starts to dance.
afterglow number 0.0 How long model keeps the last motion since dance/audio ends.

mmd-model

Properties type Default Value Description
model string '' MMD model file path.
vpd string '' MMD pose file path.
vmd string '' MMD dance file path. You can set multiple vmd files separated by ','
physics boolean false If turn on physics.
blink boolean false If model blinks one's eyes.

Browser

How to use

<head>
  <script src="https://aframe.io/releases/0.7.1/aframe.min.js"></script>
  <script src="https://cdn.rawgit.com/kripken/ammo.js/dcab07bf0e7f2b4b64c01dc45da846344c8f50be/builds/ammo.js"></script>
  <script src="https://cdn.rawgit.com/takahirox/aframe-outline/v1.1.1/build/aframe-outline.min.js"></script>
  <script src="https://cdn.rawgit.com/takahirox/a-mmd/v1.0.3/build/a-mmd.min.js"></script>
</head>

<body>
  <a-scene antialias="true" outline>
    <a-entity position="0 10 20">
      <a-camera></a-camera>
    </a-entity>

    <a-entity mmd="audio:./audios/audio.mp3;">
      <a-entity mmd-model="model:./models/model.pmd;
                           vmd:./vmds/dance.vmd;"></a-entity>
    </a-entity>

    <a-light type="ambient" color="#888"></a-light>
    <a-light color="#AAA" distance="100" intensity="0.4" type="point"></a-light>
  </a-scene>
</body>

NPM

How to install

$ npm install a-mmd

How to build

$ npm install
$ npm run all

How to load

require('./libs/ammo.js');
require('aframe');
require('a-mmd');

Copyright

You are allowed to use Crypton's Vocaloid(Hatsune Miku, Kagamine Rin, and so on) stuffs (MMD models, songs, and so on) only if you follow the guideline set by Crypton Future Media, INC. for the usage of its characters.

For detail, see http://piapro.net/en_for_creators.html

MMD assets license

The license of MMD assets used in index.html

https://github.com/mrdoob/three.js/tree/dev/examples/models/mmd#readme

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].