Giter Club home page Giter Club logo

charactercreator's Introduction

This project is a React component that is imported into the MyMiniFactory website.

It renders a generic customizer where you can pick between a set of 3D parts and displays them on the screen using threejs. You pass the parts to pick from as props and the customizer takes care of displaying them on the screen.

How it works

You must provide the hierarchy that represents your customizable 3D object. For example, if you want to have a human with customizable Body, Head, Arms and Hands, the hierarchy would have the following structure:

Body {
  Head,
  Left Arm {
    Left Hand
  },
  Right Arm {
    Right Hand
  }
}

Then you can provide files for each part in the hierarchy with some required metadata and the customizer figures out where to display them based on the metadata of the file and on the position within the hierarchy.

Props

Api for props not finalized yet

Roadmap

  • poses are still a work in progress
  • support file formats that include skinning information (currently only renders .stl files)

Examples

You can find a list of examples here

charactercreator's People

Contributors

adrian-delgado avatar romainbou avatar williamclot avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

charactercreator's Issues

PR threejs with fix in Geometry.prototype.fromBufferGeometry

Currently there seems to be an issue in the fromBufferGeometry method inside Geometry class.

three version: r94

current workaround: edited the threejs source code to fix issue.

ideal solutions:

  1. create Pull Request on three repo to fix issue
  2. avoid using Geometry and work directly with BufferGeometry

Implementation details in FindMinGeometry.js

parse function has some (potentially) dead code:

at the beginning: var output = 100;
then later on:

if (geometry.skinIndices.length == 0) {
    vector.copy( vertices[ vertexIndex ] ).applyMatrix4( matrixWorld );
    output += '\t\t\tvertex ' + vector.x + ' ' + vector.y + ' ' + vector.z + '\n';
}

if the execution would enter this block, it would coerce the output variable to a string, compromising the return value; However, it appears that it will never execute the code as geometry.skinIndices.length will (always?) have some elements inside.

(edited):
Another issue: it appears that all the elements inside geometry.skinIndices have the same value, which may indicate that the skin indices are not used; same foes for geometry.skinWeights.

Needs further testing ...

Tested: skinIndices and skinWeights are NOT filled with the same values.
Only left to figure out if geometry.skinIndices can have no elements inside.

Fix Camera

So explore camera panning up and down and Orthographic view

Center Attachment Gizmo

The gizmo for changing position is automatically placed at the pivot point of the 3d object.
Maybe try to place it at the center of the bounding box?

Have environment variables for each environment setup

Because this project makes API calls to the MyMiniFactory (MMF) API,
there are different scenarios how this project can be run:

  • MMF runs live & this project runs live: this would be the production environment
  • MMF runs live & this project runs locally: this would be the ideal development environment
  • MMF runs locally & this project runs locally

Reduce the number of lights in the scene

Currently there are 3 light sources in the scene.
Removing lights from the scene significantly increases fps. The PointLight is the most resource consuming Light.

Find a way to avoid using as many lights (maybe change colour of meshes to give impression that light is used)

Add colors to body parts?

Should the character be coloured?

For now the character is white in order to reflect the colour it will have when printed (not many 3d printers support colour printing right now)

Default value for scale

Make the default value for scale the same as the scale of the first parent part. So assume the parts as made from the same CAD File.

Basically, use the scale of the first object added to the world. It is very likely that the other objects come from the same character and have the same size.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.