JS et HTMLGAMING: De Angry Birds à ZX Spectrum

Points clés

• Le champ de jeux HTML5 / JavaScript se développe rapidement et les développeurs ont des API et des outils de plus en plus riches à leur disposition.
• Mozilla Visual Programmer et évangéliste technologique Rob Hawkes met en évidence le potentiel de HTML5 et JavaScript dans les jeux de navigateur, notant la complexité croissante de ces jeux.
• Les développeurs qui souhaitent apprendre le développement de jeux HTML5 / JavaScript devraient d'abord être familiers avec les API JavaScript et graphiques (tels que l'API Canvas et l'API audio). Les moteurs de jeu comme Crafty et Impact sont également utiles.
• HTML5 et JavaScript ont suscité la renaissance des jeux rétro, ce qui pourrait apporter une expérience de jeu plus complexe et immersive à l'avenir, en particulier avec le support de technologies telles que WebGL.
• L'ouverture d'Internet a apporté des défis et des opportunités au modèle de profit du jeu. Les développeurs doivent explorer diverses stratégies, du paiement en jeu au parrainage, afin de rendre le jeu rentable.

Le champ de jeux HTML5 / JavaScript s'est développé rapidement récemment. Les jeux de navigateur deviennent de plus en plus populaires, et les développeurs commencent également à découvrir un ensemble d'API pratique et d'autres outils. Rob Hawkes est passionné par l'éloge de HTML5 et JavaScript et de son application dans les jeux de navigateur. Rob est programmeur visuel, auteur et évangéliste technique chez Mozilla, responsable du travail de jeu de Mozilla dans la communauté des développeurs. Il a donné un discours de clôture lors de la conférence du code Web Directions à Melbourne en mai, nous montrant à quel point les jeux HTML5 et JavaScript augmentent rapidement.

Bonjour, Rob. Veuillez nous dire vos antécédents en développement.

Je travaille dans le domaine du développement du réseau depuis environ 13 ans. J'ai appris un peu sur HTML et CSS - j'étais plus intéressé par la conception Web, mais je me suis ensuite tourné vers PHP, quand j'ai appris que je pouvais faire quelque chose de très puissant dans le développement côté serveur. Une fois que je sais comment créer un formulaire, j'ai pensé, maintenant, comment accéder à ces données? Tout le monde apprend PHP du formulaire ... oui! C'est vraiment cool de pouvoir envoyer des données quelque part. Plus tard, j'ai travaillé dans l'industrie, principalement engagé dans le développement frontal et travaillé pendant plusieurs années. Je me suis intéressé aux médias et j'ai commencé à me plonger dans JavaScript, et depuis lors, j'ai réalisé que je n'étais pas si passionné par la création de sites Web, mais plus passionné par l'apprentissage de la technologie et le repousser à mes limites. J'ai toujours été très intéressé par la création de jeux et j'adore prendre quelque chose pour faire des choses folles pour savoir comment cela fonctionne, donc au collège, j'ai fait beaucoup de travail HTML5 - en particulier la toile.

Vous devez avoir commencé à jouer avec toile au début, non?

En fait, la toile existait avant de commencer. Apple l'a utilisé pour créer leur widget de tableau de bord. C'est toujours dans WebKit, même si cela ne se stabilise jamais vraiment dans d'autres navigateurs - ou du moins ça n'a jamais été amusant. Personne n'a jamais rien fait avec. Mais quand je suis tombé sur toile, je pensais que c'était vraiment cool. J'ai commencé à un bon moment - il y avait très peu de livres dessus à l'époque, mais cela a également apporté beaucoup d'opportunités. Je suis l'une des rares personnes qui s'y plongent en profondeur. De plus, j'ai également participé à l'expérience de l'API JavaScript. Je pense que je ne suis ni concepteur ni développeur - entre les deux. J'adore la programmation visuelle. Des choses comme la fabrication de jeux et la toile sont parfaites car vous pouvez combiner le développement hardcore avec une expérience d'interface vraiment intuitive. C'est ce sur quoi je travaille chez Mozilla;

Qu'est-ce qui vous a intéressé aux jeux HTML5 / JavaScript? Êtes-vous un fan de jeu?

J'ai des jeux dans ma vie - j'ai un spectre ZX, une console de jeu ...

wow! Êtes-vous un fan de ZX Spectrum?

Mon père n'aime pas beaucoup les ordinateurs, mais pour une raison quelconque, il pense qu'en acheter une est une bonne idée. Mais j'ai été profondément attiré par l'idée que le jeu est apparu après avoir inséré la bande! Je veux dire, j'étais encore très jeune, mais je me souviens encore: "Fighting the Duck" et tous ces jeux fous. Ensuite, quand j'ai commencé à jouer à des jeux PC, ma productivité a chuté pendant longtemps! Mais le jeu a toujours été amusant pour moi. Des technologies comme Flash et Javascript m'ont fait réaliser que c'était si cool que je pouvais faire des jeux maintenant. Ensuite, une fois que vous commencez à faire le jeu, il ouvre un tout nouveau domaine de possibilités. C'est comme le sentiment que je ressentais quand j'ai fait un site Web pour la première fois - je l'ai créé! Il existe de nombreuses techniques différentes que vous pouvez apprendre dans le développement de jeux - à l'instant, des graphiques visuels, un son - et vous n'obtenez pas toujours cette expérience lors de la création d'un site Web standard. Dans le jeu, vous poussez toujours les choses à la limite.

Donc, si je suis intéressé par le développement de jeux HTML5 / JavaScript, que dois-je apprendre en premier et quelle direction dois-je développer?

Master JavaScript; Contenu lié à la langue standard. Mais une fois que vous êtes satisfait de JavaScript, vous pouvez jeter un œil à certaines API graphiques, comme l'API Canvas. Canvas est une très bonne API. Jusqu'à ce que je le tombe, je ne sais vraiment pas comment dessiner quelque chose dans le navigateur sans créer d'image. Vous pouvez également consulter l'API audio. La fonctionnalité multimédia dans HTML5 est très intéressante. Découvrez certains moteurs de jeu. Vous n'aurez peut-être pas nécessairement à les apprendre de zéro, mais il y a beaucoup de moteurs de jeu qui vous permettront de commencer rapidement sans avoir à comprendre pleinement les bases. Par exemple, Crafty, je crois que c'est un moteur australien et c'est gratuit. Ensuite, il y a un très bon moteur, au prix de 99 $, appelé Impact - un très bon moteur de jeu avec une documentation très bien documentée. Si vous souhaitez créer un jeu avec JavaScript mais que vous ne voulez pas nécessairement entrer trop profondément dans les détails de l'implémentation, ces moteurs sont un excellent point de départ. Si vous voulez vraiment obtenir un aperçu plus approfondi des tenants et aboutissants du développement de jeux, apprenez à animation à l'aide d'outils tels que RequestanimationFrame, qui peuvent optimiser les boucles en JavaScript. Lorsque vous le combinez avec l'API Canvas, comme faire un déplacement carré autour de l'écran, il n'est pas difficile d'utiliser le clavier pour taper à partir de là. De là, vous pouvez le prendre où vous voulez.

Il semble donc que vous deviez toujours bien comprendre JavaScript de base.

Oui. Je veux dire, il y a des bibliothèques de jeux comme JQuery - des moteurs comme Crafty et Impact sont un peu comme ça. Mais ils ne sont pas aussi abstraits que jQuery. Si vous voulez faire quelque chose de plus compliqué, vous devez toujours écrire JavaScript. Mais si vous voulez simplement faire des animations de base - comme introduire des images comme des sprites et vous déplacer - vous pouvez le faire avec un rusé. Le problème est que vous ne comprenez pas pleinement ce qui se passe dans les coulisses. En dehors du Web, si vous souhaitez faire un jeu, vous pouvez utiliser Flash ou Unity car il résume un moyen de gérer des animations et des effets physiques complexes. Mais, pour moi, comprendre JavaScript signifie que je peux créer des jeux à partir de zéro. Oui, cela peut être difficile et peut prendre un certain temps, mais cela en vaut la peine à long terme. Si vous pouvez au moins en comprendre les bases - pour les boucles, les tableaux et les objets, etc. - alors vous l'apprécierez vraiment lorsque vous voudrez déplacer les choses plus loin.

HTML5 et JavaScript semblent avoir conduit à l'explosion de jeux rétro - des jeux Strategy, des jeux de plate-forme et la résurrection de vieux jeux comme Pong. Pensez-vous que cela ira dans d'autres directions, comme des projets plus complexes et interactifs?

Les jeux rétro sont cool à cet égard. Les jeux HTML5 sont dans une étape assez simple, donc les jeux rétro sont parfaits - ils ne nécessitent pas beaucoup de capacités, principalement en 2D, et sont faciles à créer. Il en va de même lorsque les jeux Flash étaient populaires. Rien ne peut empêcher les développeurs d'utiliser JavaScript pour créer une expérience plus immersive. Nous commençons à voir comment nous utilisons WebGL. Beaucoup de gens commencent à créer des jeux plus proches de ceux que vous voyez sur iOS - même des jeux 3D, en utilisant des technologies comme l'accélération matérielle. "Pong" est génial, mais il ne pousse pas trop de technologie; même "Angry Birds" ne pousse pas trop de technologie. J'ai vu quelqu'un créer Quake 4 dans WebGL et il se déroule bien. Nous devons voir plus de ces jeux pour aider à établir le Web en tant que plate-forme pour les jeux modernes. Nous avons maintenant la technologie et les capacités dont nous avons besoin pour créer un vrai jeu. Et ce que j'entends par de vrais jeux, ce sont ces jeux que vous pouvez voir dans les jeux PC. Nous commençons à voir des entreprises et des développeurs évoluer dans cette direction. Nous devons créer des jeux en ligne conçus pour Internet. Maintenant, nous voyons une renaissance de jeux interactifs, mais nous ne voyons pas trop de jeux créés spécifiquement pour le Web. Je veux voir plus de jeux qui profitent du réseau tout en réalisant les limitations de l'appareil. Ce n'est pas parce que vous pouvez faire le même jeu sur les deux plates-formes que cela devrait être exactement la même. Je pense que le réseau a une chance d'être une plate-forme de jeu indépendante - un objectif unique, pas juste un autre endroit pour placer des jeux standard. Une fois que les développeurs de jeux auront compris cela sous la portée, je pense que nous verrons quelque chose de vraiment intéressant. Désormais, les jeux sur le Web copient vraiment d'autres plateformes - les jeux sont assez statiques, et ils n'utilisent rien que le Web offre, tel que les fonctionnalités sociales ou la possibilité de se connecter à d'autres API. Tout cela est inhérent au Web et nous l'utilisons sur le site Web, mais que se passe-t-il si nous l'utilisons dans le jeu?

Ce que de nombreux développeurs font dans les jeux de navigateur impliquent souvent de creuser dans le passé, ce qui n'est pas nécessairement une mauvaise chose - mais pouvez-vous voir des extensions de concepts et d'idées?

Ce serait mon rêve. Maintenant, je pense que nous sommes injustes envers HTML et le Web en tant que plate-forme de jeu. Nous le comparons aux plates-formes précédentes; Nous l'avons apporté parce qu'il a réussi. Ceci est injuste; nous comparons la plate-forme Web à la plate-forme native pour laquelle il construit. Bien sûr, les plates-formes natives sont meilleures - elle est conçue pour le contrôle tactile, un langage de programmation et une technologie. Nous ne laisserons jamais le réseau se développer indépendamment en le limitant à ce que nous avons fait auparavant. Nous pouvons libérer la puissance du réseau et essayer quelque chose qui n'est pas aussi limité que les jeux auxquels nous jouons habituellement - par exemple, nous voyons que le jeu est contenu dans une petite boîte du navigateur. Il n'y a aucune raison pour que le jeu apparaisse dans une petite boîte dans le cadre d'un site Web - cela peut faire partie du réseau; vous pouvez chasser le jeu en ligne. Il n'y a aucune raison pour que vous ne puissiez pas jouer à des jeux sur Twitter. J'espère que, alors que les gens embrassent progressivement l'idée de jeux en ligne, nous verrons beaucoup de nouveaux jeux à venir. L'API JavaScript est conçue pour le réseau. Il s'agit d'une technologie très basique; l'établissement d'une connexion de socket Web et de certains événements, vous pouvez envoyer et recevoir des messages au serveur Web en temps réel - faire des jeux multijoueurs à partir de là.

Comment faites-vous que ces idées valent le marché?

C'est l'un des problèmes que nous essayons de résoudre à Mozilla. C'est aussi l'un des problèmes courants que nous obtenons des développeurs de jeux - "Cela semble bon, mais que se passe-t-il si je ne veux pas fournir mon jeu gratuitement?" Tout est ouvert; le code source est tout là. Nous avons donc deux problèmes qui doivent être résolus ici. Premièrement: comment convaincre les gens que l'utilisation de la technologie ouverte est une bonne idée? Je pense que ce problème est facile à résoudre parce que si vous vous inquiétez de la volonté de votre jeu, je ne pense pas que le réseau soit pour vous. Ce n'est pas parce que vous pouvez faire des jeux en HTML que c'est la meilleure plate-forme pour votre jeu. Et il existe des moyens de soulager ces problèmes, comme le rétrécissement du code - ces méthodes peuvent aider les développeurs à se sentir un peu plus à l'aise avec le code de publication sur lequel ils ont déjà passé beaucoup de temps à travailler. La deuxième question est le marketing: comment vendez-vous votre jeu? Si vous ne pouvez pas gagner votre vie, au moins en tant qu'entreprise, faire des jeux n'a aucun sens. Vous pouvez suivre un chemin et si vous ne dépensez pas d'argent, vous n'avez pas à vous soucier trop d'empêcher les gens d'entrer dans votre jeu, mais vous pouvez utiliser le mode de don. D'un autre côté, si vous voulez vraiment les désactiver sans payer pour le jeu, vous pouvez le faire. Nous développons une API d'application Web ouverte à Mozilla, qui vous permet de fournir des reçus qui doivent être vérifiés sur le serveur de développeurs de jeux. Nous recherchons des moyens d'adopter l'ouverture du code, plutôt que d'empêcher les gens de voir le code source, de créer un point, pouvez-vous dire, payez-vous pour ce jeu? Sinon, vous n'obtiendrez pas l'expérience complète. Ce n'est pas une pilule magique. Si c'est juste un seul joueur pour lequel ils ont déjà payé, il n'y a aucun moyen de les empêcher de le prendre et de faire ce que les gens font avec la technologie de réseautage une fois qu'ils ont obtenu tout le code source. J'ai un doute fort que les jeux sur Internet ne seront pas volés plus que des jeux ailleurs. Les jeux piratés sont beaucoup plus compliqués que l'obtention du code source. Si vous avez un composant côté serveur, vous avez une protection, et c'est là que le système de réception peut entrer en jeu. Si vous savez que le jeu ne peut être joué que si quelqu'un visite votre serveur, vous pouvez contrôler l'expérience. S'ils volent le code frontal, ils ne peuvent toujours pas jouer au jeu car ils n'obtiennent pas votre code côté serveur, et s'ils peuvent entrer dans votre serveur, vous avez un autre problème. Je ne pense pas qu'il n'y ait absolument aucun problème à monétiser les jeux en ligne - le problème en ce moment est que nous n'avons pas encore eu de succès énorme. C'est une question de poulet ou d'oeuf d'abord - les gens attendent le succès, et le succès ne vient pas parce que les gens attendent. Nous avons besoin de quelqu'un pour se manifester et l'essayer. Et c'est Internet, donc vous n'avez pas à vendre de jeux comme vous le faisiez auparavant. Vous pouvez peut-être gagner de l'argent à partir des paiements en jeu, afin que vous puissiez toujours avoir une expérience de jeu gratuite, mais contrôler ce que les gens vivent dans le jeu - les joueurs de niveau atteignent, l'armure qu'ils ont ou les gains d'énergie.Une fois que nous comprenons pleinement ce qui est possible, nous découvrons comment le monétiser, surtout après que les grandes entreprises comme EA se joignent - si quelqu'un sait comment gagner de l'argent, c'est ces gens. Je pense que les développeurs indépendants emboîteront le pas. Ce n'est pas aussi facile que sur iOS ... mais ils ont déjà une énorme avance. Il existe de nombreuses façons de le faire en ligne. Les journaux ont commencé à envisager d'introduire des murs de paie… cela ne fonctionne pas nécessairement. La question est: devriez-vous bloquer le contenu? Est-ce que cela va à l'encontre de l'intention d'origine d'Internet? Y a-t-il d'autres moyens de gagner de l'argent plus adapté à Internet? Peut-être que c'est la réponse à la question - pas "Comment puis-je les empêcher de jouer à mon jeu s'ils ne paient pas?", Mais "comment puis-je gagner de l'argent avec ce jeu avec ce que Internet est bon?" Même du joueur, gagnez de l'argent là-bas, mais gagnez de l'argent avec les sponsors. J'aimerais savoir où nous serons dans un an. Nous pouvons voir une série de jeux réussis gagner beaucoup d'argent.

Des questions fréquemment posées sur les jeux HTML5 et WebGL

Qu'est-ce que WebGL et pourquoi est-il important pour les jeux HTML5?

WebGL signifie Web Graphics Library. Il s'agit d'une API JavaScript qui permet de rendre des graphiques 3D et 2D interactifs dans n'importe quel navigateur Web compatible sans plug-ins. WebGL est crucial pour le jeu HTML5 car il offre aux développeurs la possibilité de créer des expériences graphiques riches et de haute qualité qui peuvent fonctionner en douceur sur une variété d'appareils. Cela ouvre des possibilités infinies pour le développement de jeux, car elle permet de créer des jeux immersifs complexes qui peuvent être joués directement dans le navigateur.

Comment les jeux HTML5 se comparent-ils aux plates-formes de jeu traditionnelles?

Les jeux HTML5 présentent de nombreux avantages par rapport aux plates-formes de jeu traditionnelles. Tout d'abord, les jeux HTML5 sont agnostiques et peuvent être joués sur n'importe quel appareil avec un navigateur Web, y compris les smartphones, les tablettes et les ordinateurs. Cela signifie que les joueurs peuvent profiter de leurs jeux préférés n'importe où sans télécharger ou installer quoi que ce soit. Deuxièmement, les jeux HTML5 sont généralement plus rapides et plus faciles à développer que les plates-formes traditionnelles, et les jeux nécessitent généralement des connaissances et des outils spécialisés. Enfin, les jeux HTML5 peuvent être facilement mis à jour et distribués, ce qui les rend attrayants pour les développeurs et les joueurs.

Puis-je jouer aux jeux HTML5 hors ligne?

Oui, l'un des énormes avantages des jeux HTML5 est qu'ils peuvent être joués hors ligne. Cela est grâce à la fonction de mise en cache d'application de HTML5, qui permet aux applications Web de stocker des données sur les appareils des utilisateurs à utiliser lorsqu'il n'y a pas de connexion réseau. Cela signifie que vous pouvez continuer à jouer à vos jeux HTML5 préférés même si vous n'êtes pas connecté à Internet.

Les jeux HTML5 sont-ils sûrs?

Les jeux HTML5 sont généralement aussi sûrs que toute autre application Web. Cependant, comme tous les logiciels, ils peuvent également être vulnérables aux attaques s'ils ne sont pas conçus et maintenus correctement. Les développeurs doivent suivre les meilleures pratiques pour la sécurité du Web, telles que l'utilisation de protocoles de sécurité, la vérification des entrées des utilisateurs et la mise à jour et le correctif régulièrement des jeux pour résoudre tout problème de sécurité potentiel.

Quels sont quelques exemples de jeux HTML5 populaires?

Il existe de nombreux jeux HTML5 populaires aujourd'hui, des jeux de puzzle simples aux jeux en ligne multijoueurs complexes. Certains exemples notables incluent "2048", "Hexgl" et "Gem Maze". Ces jeux présentent la puissance et la polyvalence de HTML5 et WebGL et nous donnent un aperçu de l'avenir du jeu Web.

Comment commencer à développer mon propre jeu HTML5?

Développer des jeux HTML5 nécessite une bonne compréhension de HTML, CSS et JavaScript, ainsi que familier avec l'API WebGL. Il existe également des bibliothèques et des cadres disponibles qui peuvent simplifier le processus de développement, tels que Phaser, Pixi.js et Three.js. De plus, il existe de nombreux tutoriels et ressources en ligne pour vous aider à démarrer avec le développement de jeux HTML5.

Puis-je monétiser mon jeu HTML5?

Oui, il existe de nombreuses façons de monétiser les jeux HTML5. Une approche commune est par le biais d'annonces, qui peuvent être réalisées en affichant des annonces dans des jeux ou en fournissant des versions non publiées sur les annonces du jeu. Une autre approche consiste à des achats en jeu où les joueurs peuvent acheter des biens ou des services virtuels dans le jeu. Enfin, certains développeurs choisissent de vendre leurs jeux directement, que ce soit via leurs propres sites Web ou via des plateformes de distribution de jeux.

Quel est l'avenir des jeux HTML5?

L'avenir des jeux HTML5 semble très brillant. Avec l'avancement continu de la technologie Web et la popularité croissante des jeux mobiles, nous verrons probablement des jeux HTML5 plus innovants et passionnants à l'avenir. De plus, la montée des technologies de réalité virtuelle et augmentée peut également ouvrir de nouvelles possibilités pour le développement de jeux HTML5.

Quelles sont les limites des jeux HTML5?

Bien que les jeux HTML5 aient de nombreux avantages, ils ont également certaines limites. Les performances peuvent être un problème, par exemple, en particulier pour les jeux plus complexes. De plus, tous les navigateurs Web ne prennent pas entièrement en charge toutes les fonctionnalités de HTML5 et WebGL, ce qui peut entraîner des problèmes de compatibilité. Cependant, avec le développement continu et l'amélioration des technologies Web, ces limites deviennent moins importantes.

Puis-je utiliser WebGL pour les applications non-jeu?

bien sûr! Bien que WebGL soit souvent lié aux jeux, il peut également être utilisé dans une variété d'applications sans jeu. Par exemple, WebGL peut être utilisé pour créer des visualisations 3D interactives, des visites virtuelles et même des expériences de réalité augmentée. Les possibilités sont presque illimitées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!