Page d'accueil » Codage » 15 (Plus) inspirantes expériences HTML5

    15 (Plus) inspirantes expériences HTML5

    Sauf si vous avez vécu sous un rocher, vous aurez entendu parler de HTML5. C'est un peu partout maintenant, grâce à la promotion de la pomme PDG Steve Jobs, ex-PDG, et certains développeurs qui croient que HTML5 peut prendre le relais de Flash.

    Eh bien, en fait, nous ne voyons pas encore cette situation se produire, mais HTML5 est vraiment magique en ce qui concerne ses capacités vidéo, ses illustrations sur les toiles et ses animations qui fonctionnent très bien et sans heurts. Le fait est qu’il est si prometteur de voir se multiplier les projets conçus pour tester les limites du HTML5..

    Croyez-le ou non, nous vous présenterons 15 expériences enrichissantes utilisant au mieux le HTML5 et, devinez quoi, vous pourrez faire l'expérience de la gravité, de l'animation basée sur la musique et du rendu de créatures fonctionnant comme des créatures! Amusez-vous bien avec eux et oups, ils sont mieux servis avec la dernière version de Mozilla Firefox et Google Chrome.

    Juste au cas où vous n'êtes pas satisfait de ces jeux HTML5 amusants, nous en avons plus pour vous!

    • HTML5: 48 démonstrations potentielles de destruction Flash
    • HTML5: 19 applications Web potentielles

    Cycle de toile

    Un effort de collaboration entre l'artiste Mark Ferrari et le codeur Joseph Huckaby, il s'agit d'une magnifique collection de scènes de la nature en mouvement telles que les forêts en hiver, les paysages marins et les montagnes orageuses. Ils sont relaxants à regarder et vraiment superbes, avec des sons attachés aux images. Si vous voulez un peu de temps pour vous détendre du travail, vous pouvez parcourir ces images et sentir votre tension fondre.

    Google Gravity

    Un autre par l'incroyable M. Doob, celui-ci est moins interactif que le premier mais reste cool. Il fournit une copie de base de la page de recherche principale de Google. Mais lorsque vous pointez votre curseur, toute la page commence à "tomber" jusqu'à ce que toutes se plantent en bas. Le logo Google fonctionne comme un lien actif qui actualise la page. Un bon jeu pour ces grandes entreprises qui détestent Google, peut être.

    Arbres de toile

    Fabriqué par Kenneth Jorgenson, c’est peut-être le seul endroit où vous pouvez voir la phrase «Rafraîchissez-vous pour plus d’arbres délicieux :)». C'est exactement ce que ça dit: vous cliquez sur le site et cela vous amène à un fond blanc. Un dessin à l’encre noire d’un arbre commencera à «pousser» tout en comptant sur le nombre de branches en cours. Vous pouvez rafraîchir pour voir autant de fois que vous le souhaitez.

    Magnétique

    Ceci est un autre amusant et addictif pour vous d'apprécier. En gros, vous commencez avec deux «aimants» que vous pouvez faire glisser sur l’écran. Des particules de lumière gravitent autour d'elles et si vous changez de position, vous pouvez en modifier la forme. Si vous voulez plus d'aimants et de particules, il vous suffit de double-cliquer et de les faire glisser à l'endroit souhaité. Oui, tout est question d'aimants et de physique!

    Graphique des gains des célébrités

    Vous voulez voir une représentation visuelle du salaire gagné par les célébrités de la télévision par épisode? Il s’agit d’un petit graphique sympa montrant des piles de barres de couleurs qui représente le pourcentage de célébrités par enregistrement d’une émission télévisée (ou réalisé dans des cas comme Charlie Sheen). Il a été fait comme l'un des nombreux projets et expériences de Daniel Rapp.

    Ruban de toile

    Paul Truong a créé cette application intéressante qui vous permet de peindre à l'aide d'un ruban multicolore en mouvement constant à travers l'écran. Il crée des formes et des dessins et l’effet est plutôt joli. Tout ce que vous avez à faire est de le faire glisser sur l’écran, en parlant de simplicité hein.

    WebGL Water

    Voici une démo intéressante utilisant la révolutionnaire WebGL (bibliothèque graphique basée sur le Web), parfaitement adaptée à Google Chrome. Avec la démo, vous pouvez dessiner sur l'eau pour créer des ondulations, ou faire glisser la sphère pour la déplacer et appuyer sur certaines touches du clavier pour définir la direction de la lumière et faire basculer la gravité, le tout pour observer l'interaction vivante de l'objet déplacé avec l'environnement. réaliste.

    Chrysaora

    Encore une autre démonstration étonnante appliquant la magie de WebGL, dans laquelle vous pouvez voir un groupe de méduses extrêmement belles et surtout, animées, se déplaçant dans l’eau, irradiées par le rayon de soleil onirique. Soyez témoin de la période au cours de laquelle HTML5 et WebGL donnent vie au Web, avec Google Chrome comme meilleur affichage.

    Voxel Rain

    Voxel rain signifie que les boîtes 3D multicolores descendent pour former un gros bloc en rotation. C’est comme présenter les possibilités de l’ordinateur dans les années 90, et maintenant, il s’agit d’un navigateur Web utilisant la puissance de HTML5, l’ère la plus brillante d’Internet n’est pas plus éloignée.

    Effets de texte HTML5

    Souvent, nous, concepteurs Web, nous demandons combien de possibilités HTML5 peut réellement nous aider à percer dans la typographie Web. Cette démo vous donne la réponse, plus que jamais! Vous pouvez choisir d'assister à l'effet stéréoscopique, à l'effet néon ou même à l'effet néon en mouvement, l'avenir de la typographie Web est entre les mains de HTML5.

    Spinning HTML5 Logo

    Je ne peux pas supporter la gloire de HTML5, ça tourne, ça tourne… c'est cool.

    Esquisse en 3D

    Marre du service de dessin 2D basé sur HTML5? Regarde ça. Il vous suffit de tracer une ligne, d’appuyer sur Espace puis de faire glisser le curseur vers la gauche ou la droite pour que votre dessin tourne en perspective 3D. Le dessin en 3D n'est pas plus compliqué avec HTML5.

    mta.me chef d'orchestre

    Mta.me Conductor vous inspire par les points de frai qui bougeront continuellement pour former des lignes, et lorsque les lignes “entrer en collision” les uns aux autres, ils vont déclencher une interaction. Tout cela pour prouver que HTML5 ne concerne pas seulement le code, mais aussi l’interaction, et c’est ce que les utilisateurs Web tiennent vraiment à cœur..

    Doogle Gmail

    Un jeu de tir intéressant mais le héros c'est Gmail, libérez-le du mal! Tout comme le jeu de tir classique, vous avez la vie, les scores et le tout puissant rayon laser. Probablement l’une des démos potentielles pour présenter les fonctionnalités de HTML5 en tant que jeu. Attention, Flash.

    W pilote

    C'est un jeu tellement addictif qu'il devrait être illégal. Sérieusement, une fois que vous vous connectez à l'un de leurs serveurs, vous voudrez jouer pendant des heures. Vous volez essentiellement en tirant tout en évitant de vous faire tirer dessus par d’autres joueurs. C’est simple et très amusant à jouer, et le fait de permettre une expérience multijoueur est un atout sérieux qui le place au-dessus des jeux Flash qui sont si populaires en ce moment..