Content
El dissenyador web Filidor Wiese ens va cridar l’atenció amb el seu lloc personal. Es va associar amb Arthur van ’t Hoog per desenvolupar un univers virtual amb un personatge de jocs retro pixelat a la pantalla que es representava a si mateix.
Un cop dissenyats els sprites, Wiese va començar el complex procés d’animació amb JavaScript en lloc de tècniques d’animació convencionals com els GIF.
"El problema és que són molt difícils de controlar des d'una perspectiva de JavaScript", explica Wiese. "Necessitava una manera de fer exactament el temps, el bucle, la cadena i el guió de diverses animacions seguides. A més, el sprite hauria de poder reposicionar-se fotograma per fotograma. Aquesta última característica permet animacions més avançades; per exemple, un personatge ambulant".
"Inspirat per Spritely, vaig començar a treballar en un complement personalitzat", afegeix. "Al nucli principal, trobareu una lògica de reposicionament de la imatge de fons que es retarda eficaçment mitjançant la implementació de l'API window.requestAnimationFrame. Aquesta API JavaScript demana al temporitzador basat en intervals, que és menys eficient."
Aquest treball va permetre a Wiese aconseguir una interacció complexa entre animacions. "Una de les dificultats que va sorgir va ser la necessitat d'interacció entre diferents sprites. Per exemple, la torre només hauria d'emetre senyals si el personatge escriu al seu ordinador. Perquè això funcioni, he utilitzat esdeveniments JavaScript personalitzats per deixar que un sprite s'activi. un interruptor en un altre ".
Aquest aparador es va publicar originalment al número 235 de la revista .net.
Ara llegeix-los!
- Principals exemples de JavaScript
- Excel·lents exemples d'HTML5
- Formació en disseny web: les millors eines en línia