Speel, leer en beleef nieuwe webtechnologieën met Chrome-experimenten

De Chrome Experiments-website is een etalage voor alle nieuwe en opwindende dingen op het gebied van webtechnologieën en browserversnellingen, met een focus op JavaScript. HTML5 10 Websites om te zien Wat HTML5 alles te bieden heeft 10 Websites om te zien waar HTML5 voor staat Meer lezen, canvas, SVG en de 3D WebGL-engine zijn allemaal prominent aanwezig in kleine sprankjes creativiteit die de weg banen naar een mooier en interactiever internet.

Een van de beste dingen van Chrome-experimenten is dat de site het leren aanmoedigt. 4 Must-See TED Talks over creativiteit, inspiratie en passie 4 Must-See TED Talks over creativiteit, inspiratie en passiecreativiteit. Inspiratie. Passie. Dit zijn allemaal concepten waarvan we ons heel goed bewust zijn, maar niet velen van ons kunnen precies de bron achterhalen. Waar komt creativiteit vandaan? Wat is de oorzaak van een ... Lees meer naast ontdekking, dus als je eenmaal met een project hebt gespeeld, is de kans groot dat je een beetje zult leren over hoe het is gedaan - en in sommige gevallen het zelf proberen.

Er zijn honderden spellen om mee te spelen op de Chrome Experiments-website en om u op weg te helpen zijn hier een paar van de beste.

Browser Vereisten

Aangezien dit een op Chrome gerichte website is die wordt gerund door Google, zijn alle experimenten bedoeld om in hun Chrome-browser te werken. Dit betekent dat u er weinig problemen mee hoeft op te lopen als u een update downloadt of bijwerkt naar de nieuwste stabiele versie van Chrome, hoewel ook andere moderne browsers zouden moeten werken.

Probeer dit gewoon niet te doen op IE6. Als u nog steeds IE6 gebruikt, bent u een probleem [mening] Als u IE6 nog steeds gebruikt, bent u een probleem [Opinion] IE6 was de beste van het beste als het kwam vers geperst uit de softwarefabriek van Microsoft. Daardoor was het in staat om het record marktaandeel van 95% browser te bereiken op het hoogtepunt van ... Lees meer, oke?

3D Wolken

Deze wolken zijn niet echt 3D - zoals auteur Jaume Sanchez aangeeft - maar stel je voor dat je website of zelfs een desktopachtergrond mooie, 3D-achtige clouds genereert met alleen CSS en een beetje JavaScript. Blijkbaar zijn we niet ver van die fase verwijderd, zoals deze demo laat zien.

De site van Jaume zit vol met andere interessante experimenten met HTML5, evenals een hoop tutorials om je eigen stappen te zetten. Als je wilt weten hoe hij deze wolken heeft gemaakt, kun je hier hier alles over lezen.

Draaibank Workshop

Deze met WebGL aangedreven draaibank van Einar Öberg is leuker dan functioneel en gebruikt de spatiebalk en muisaanwijzer om de kunst van het met de hand draaien van hout, metaal en steen na te bootsen. Einar heeft de demo gebouwd, zodat hij een eenvoudige procedurele shader laat zien, maar hij heeft ook een paar geluiden toegevoegd voor de authenticiteit.

Hoewel het geen volledige handleiding is, kunt u iets meer leren over hoe het op de blog van de auteur is gedaan.

GPU Particle Attractors

Een experiment met deeltjeseffecten en de WebGL-engine, Edouard Coulon heeft iets werkelijk moois gemaakt dat je kunt manipuleren met je muis en spatiebalk. Klik om de deeltjes naar het midden van het scherm te trekken en klik vervolgens op de spatiebalk om ze weer naar buiten te zien schieten!

Er is helaas geen handleiding voor deze, hoewel ik zou aanraden om de miljoen-deeltjesmodus te proberen als uw computer dit aankan. Voeg een projector en een donkere kamer toe voor eindeloos plezier!

WebGL Cars

Gemaakt door AlteredQualia, die ook de geweldige interactieve film ro.me heeft geschreven (die ook op Chrome-experimenten is opgenomen), WebGL-auto's is een 3D-speelgoed waarmee je een Bugatti Veyron en Lamborghini Gallardo vanuit meerdere camerahoeken kunt besturen.

Een ding dat bijzonder cool is, is het aantonen van bewegingsonscherpte, scherptediepte en verschillende lichtomstandigheden. Ok, en de jongen in mij houdt van spelen met speelgoedauto's - wat kan ik zeggen?

X-Wing

Dit is een van die reactiespellen waarbij het doel is om het doelwit met je muis (of in dit geval ook het toetsenbord) te bewegen in een poging om tegemoetkomende obstakels te vermijden - behalve dat het beter is dan de rest omdat het om een ​​X-Wing gaat en wat lijkt op de loopgraaf van Star Wars.

De auteur die de naam OutsideOfSociety hanteert, heeft nog veel meer WebGL-experimenten gaande op zijn website.

My Robot Nation

My Robot Nation, een volledig functionele front-end voor e-commerce, maakt gebruik van de kracht van WebGL om u in staat te stellen uw eigen speelgoedrobot te ontwerpen, te schilderen en aan te passen voordat deze voor een vaste prijs naar u wordt verzonden.

Ok, dus je hoeft de robot niet te kopen om er een kick van te krijgen - maar als je zo lang doorbrengt als ik probeerde iets te maken dat vaag lijkt op een Robobrain van de Fallout Pique Je interesse met deze Wiki's op 4 fictieve Post-apocalyptische werelden Pique je interesse met deze wiki's op 4 fictieve post-apocalyptische werelden Ben je ooit op de wiki van je favoriete show of boekenserie gesprongen en viel je vervolgens in een met inhoud verzadigde time-warp? Je weet waar ik het over heb - zoiets als die klassieke TVTropes black-hole ... serie Lees meer dan zou je willen dat je had. Vergeet ook niet om de creaties van anderen te bekijken!

FastKat 2

Een ander “vermijd de obstakels met je muis” type spel, behalve dat dit een vervolg is op de originele FastKat door Omiod, een redelijk populaire HTML5-game die je misschien al hebt gespeeld. Het vervolg is sneller, moeilijker en zeer verslavend.

Begin het gewoon niet te spelen als je werk moet doen ...

Livecodelab

Het laatste experiment dat hier wordt weergegeven (van honderden, het was moeilijk om slechts 8 te kiezen) is nogal speciaal omdat het je in staat stelt om WebGL-objecten met code on-the-fly te manipuleren. Naast een reeks demo's om naar te gapen en mee te spelen, zijn er een reeks tutorials om je te helpen met het leren van WebGL.

Ik ben geen codeur (ik ben verschrikkelijk in het onthouden van woorden, laat staan ​​functies), maar zelfs ik vond het boeiend en enigszins krachtig om met WebGL te manipuleren en te spelen met een geweldige tutorial om mijn hand vast te houden. Als u geïnteresseerd bent in dit soort dingen, maar geen idee hebt hoe u het moet doen, dan is dit een geweldige plek om te beginnen.

Conclusie

De Chrome Experiments-website is slechts een platform voor artiesten en programmeurs om hun creaties in te dienen, maar het dient een geweldig doel - om talent te benadrukken en anderen te helpen de mogelijkheden van nieuwe webtechnologieën te leren kennen. Er zijn zelfs Chrome-experimenten die op uw mobiel werken!

Ontdek meer over: Google, Google Chrome.