Configuration test: Demonstrating Sign Language Signs

It is a platform to create sign language signs for deaf people … this design is ideal for children with deaf and deafblind children.

I think it’s a lot of fun.

Advantages: It is very well accessible for children with disabilities

Disadvantages:

  • Cannot do rigging or Bone arm from shoulder to hand to understand much better

  • It is very complicated with animation in grouping “mouth” with tooth and lips. I should make order first lips, second with teeth and last is language that can work very well.

Doubts: I don’t know how to add keyboards to change the value of slider with right and left keyboard
jump from the slider lists with keyboard up and down.

Let’s see if available with Javascript (I am not convinced by anything)

3 Likes

Whoa, that is awesome! I assume the .hype document uses timelines for each of the parts and a control element position for the hand?

Is it currently zero lines of code?

I think ultimately you’d need some idea of “selection” so that if you used arrow keys then it would use this selection to figure out which timeline needs changing, and then adjusts the time plus or minus some amount. You’d look at the event.keyCode for which key you want, and then add or subtract via the hypeDocument.goToTimeInTimelineNamed(timeInSeconds, timelineName) API based on the hypeDocument.currentTimeInTimelineNamed(timelineName).

Great work. Love the graphics and versatility! Idea: Using something like https://github.com/niklasvh/html2canvas you could snap an image and share it on social media.

If I do pure hype without codes.

I will try if I get it javascript … I think you can create class of each group of slider so that keyboard can select so easy

thanks.

If I have already thought the same.

You can also add a note that “cmd + shift + 4” to capture the image you want.

1 Like

Here is very similar to what my project has but the only one I do not know how to do with this straight to curly hair …

I would like if someone knows how to do that without javascript.

Thank you

It is very easy with Hype’s Vector Shape morphing.

The small complication is that the hair has two aspects - length and curl. You can really only do a shape morph from one shape to another, so you cannot control two aspects like this with shape morphs alone. So the technique I would use is to control curl with a shape morph and length with a Y scale.

I’ve made a basic example showing this and controlling the timelines:

It looks like the construction has the top of the head as a separate element, so I didn’t do that or the other controls since they are more straight forward.

3 Likes

very good. thank you!!

I am thinking that if a client is using this configuration and wants to save their character as hair color, face and gestures … There is no need to return configuration with parameters.

You have to create a button to save character.

I know as always with Javascript.

Correct, the JavaScript to do saving or present parameters is dependent on a lot of factors - I’d say it would be a non-trivial but not horribly difficult. Basically with the approach I took before I’d structure it so that the On Drag actions would have a new action to run JavaScript. This would look at the time in the timeline to determine a percentage of the property, and then you can multiply that percentage times some other factor to give you a value. You could then save that value to localStorage, a cookie, or output as the innerHTML of a box.

Restoring the value would be looking at where it was saved On Scene Load and then performing a reverse transform to set the goToTimeInTimelineNamed() to move the timeline to the right spot.