Hello to Hype family. I am Rubén Ocampo, I have a motor disability. Founding of Dar de Gracia, where we serve more than 120 children with disabilities in Mexico.
Due to the current situation, he decides to make an inclusive App with disabled characters for children with intellectual disabilities such as infantile cerebral palsy, Down syndrome and autism.
More than 150 artists from 13 countries have donated arts for this project.
I am a designer and have 2 months of driving Hype Tumult.
I do not program and I have contacted several creators of Hype content to be able to use their templates and adapt them to the dynamics for minors.
I am writing all of this, asking for your support so that I can upload various things that I am doing and invite you to join this effort.
Getting involved, correcting myself, responding to me, etc.
I am an admirer of the kindness of each one of those who participate in this forum, who have kindly replied to me from here or by email such as: Jonathan Deutsch, Hans-Gerd, Michael Garofalo among others.
I thank you on behalf of all children with disabilities who will benefit.
Blessings always!
I am adapting this so that the children, when they swipe, can "discover and color" the picture below.
Questions:
Is it possible for the squares to automatically put the image in black and white without having to crop the image from photoshop?
The gray encloses several squares, could they change the color so that it is not gray? because it does not stimulate the senses of minors with Autism.
Thank you from the bottom of my heart, I am learning fast, please be patient with me.Raspadito Foro.hype.zip (15.0 KB)
Well, it depends on your project. I'm not exactly sure what you're trying to do, as you're using SVG instead of Hype. Quite often... with web development ...there is more than one answer to the problem. Other times, certain answers are clearly better than others.
Here, I'm not so sure.
So, I'll just answer the question in a more general way. Can you easily make an image Black and White with Hype? Yes, with filters...
...just drop the saturation to zero — boom — instant black and white (grayscale) image. Although, this technique has problems. Do you see the yellow alert? There is browser compatibility issue. If your viewers are using really old computers, this could be a problem. Filters can also cause performance issues — it might run slowly. So, I try to avoid filters.
It looks like you made the gray squares outside of Hype. (It's SVG, right?) So, you could just change the color. Also, you can position an image inside an SVG. That's basically what I'm doing with the Jigsaw Puzzle. Hype is used to create the SVG puzzle pieces and then add an image as the background. It's the same image, just positioned differently.
It's not really elegant code. I had to struggle to get Hype to do what I wanted — shift the background image. (It's one big image, repeated across the little pieces.) I think that's a problem with your project. You have two main issues. First, if you're just starting to work with Hype, your project is looking quite advanced. (It could be a tough first project.) Second, Hype does have limitations. The software is strong, but is it the best tool for this job?
With this example, I'm not sure if Hype is better than pure HTML / JavaScript / CSS / SVG. It would be tedious to recreate all of those SVG squares in Hype. If you did, would you have better control over the effects? I don't know. It depends on your artwork. It depends on the exact effects you're trying to create. These are unknowns, but perhaps this information can help advance the conversation.
Thank you very much teacher, I was able to correct it with your advice, so valuable.
I was the one who wrote to him by mail and he answered me kindly.
Would it be possible to personalize your "Jigsaw"? Put a picture instead of the numbers for the children to put the puzzle together with a picture instead of the numbers? As you can see, they will be inclusive images of children with disabilities.
Sending photomontage eh photoshop is not applied, since I could not, sorry.
I hug you.
