Så du har hørt alle rygterne om, at HTML5 vil overtage Adobe Flash. Mens de fleste webfællesskaber argumenterer for, om det er muligt eller ej, må du undre dig over, hvad der gør HTML5 så kraftfuldt, at selv gigantvirksomheden Apple ønsker at bruge det til at erstatte Flash.
Det er derfor dette indlæg eksisterer, vi vil ikke tale om, hvad HTML5 kan gøre, men vise live demoer af magiske ting, som HTML5 kan opnå med andre sprog som JavaScript, så gør dig klar til at blive inspireret.
Bemærk: Da HTML5 ikke understøttes fuldt ud af visse webbrowsere som Internet Explorer, anbefales det kraftigt at bruge Firefox-browseren til at se alle HTML5-demoer nedenfor.
Animation
H HTML5’s canvas-element er den afgørende faktor for, at HTML5 kan erstatte visse Flash-animationer. Det giver dig mulighed for at opbygge dynamisk, scriptbar gengivelse af 2D-former og bitmap-billeder med Javascript, hvilket med andre ord er, kontrollerbar animation.
Audioburst Animation
En komfortabel og fantastisk animation skabt med HTML5’s canvas og audiotag.
Ball Pool
Denne demo, der blev fremvist på det sidste Google I/O-event, viser dig, hvor dynamisk HTML5 kan være.
Blob Sallad
En HTML5-spawned skabning, der vil behage dig.
Bomomo
Med Bomomo kan du observere forskellige atomare bevægelser simuleret med HTML5.
Browser Ball
Bliv forbløffet med denne ‘cross-browser’- HTML5-bold.
Bobler
Har du det sjovt ved at skabe endeløse flydende bobler med forskellige farver.
Canvas Cartoon Animation
En enkel og sjov HTML5-tegnefilm, der hjælper dig med at forstå, hvad HTML5’s canvas-element kan gøre.
Coolclock
Et flot, tilpasseligt analogt ur, der er bygget af HTML5 og JavaScript.
Flickr PS3 Slideshow
Se dine Flickr-fotos med et slideshow i PS3-stil i webbrowseren.
Interaktiv Polaroid
En interaktiv demo, der fungerer nogenlunde som en multi touch-grænseflade.
JS Fireworks
Nyd fyrværkeriøjeblikket med din foretrukne tyngdekraft og hastighed, drevet af HTML5 og Javascript.
Kalejdoskop
Et meget smukt og futuristisk HTML5-kalejdoskop.
Liquid Particles
Følsomme partikelanimationer, der reagerer baseret på din musebevægelse.
Mesmerizer
En anden følsom og fremragende HTML5-demo, der viser, hvordan nærliggende elementer reagerer med din musebevægelse.
Nebula Cloud
Før dig vild med denne forunderlige HTML5-nebula.
Parallax
Se alle 2D-former i parallelperspektiv.
Partikelanimation
En elegant HTML5-partikelanimation, der kan formes til dit foretrukne budskab.
Spread
Gå tabt med denne uendelige spread-animation.
Stjernefelt
En meget cool HTML5-stjernefelt-animation, der vil ændre retning og hastighed baseret på din musebevægelse.
Video Destruction
Et enkelt klik for at bombe en video, der afspilles.
Waveform
Oplev, hvordan HTML5’s lærredsbølge bevæger sig ved at ændre dens amplitude, bølgelængde, bredde osv.
3D-effekt
Undertrykkes du af lærredsanimation? Det er mere, HTML5’s canvas-element kan gøre, og det kaldes 3D-effekt. Udvikleren kan stole på canvas-elementet, DOM og JavaScript for at skabe 3D-effekt, som senere kan udvikles til 3D-animation eller spil.
Canvas3D og Flickr
Har du en helt ny 3D-oplevelse med Flickrs fotostream.
Tøjsimulering
En realistisk, HTML5-baseret tøjsimulering.
Evolving Monster
Oplev et monster, der udvikler sig til et kompliceret væsen, en af dets skabere er HTML5.
Google Giftbox
Gigantens søgemaskine Google præsenteres i 3D, spilbar visning.
JS Touch
En højkvalitets og realistisk ‘3D på 2D lærred’ udstilling.
Datapræsentation
Som HTML5’s canvas-element kan bruges til at skabe animation og 3D-effekt, kan det også implementeres til at præsentere matematiske data.
Gnuplot
Gnuplot, et program til dataplotting i HTML5-version.
RGraph
RGraph giver en bred vifte af datapræsentation som f.eks. søjlediagram, fremskridtslinje og traditionelt radardiagram.
Webapplikation
Snart kan man ved hjælp af alle de muligheder, der kombineres af HTML5 og andre sprog, skabe interaktive applikationer eller spil, der ligger tæt på Flash-applikationen.
CanvasPaint
Visse, at Microsoft Paint’s bror kommer ind i din webbrowser, og hans far er HTML5.
CanvasMol
En videnskabelig applikation, som er bygget til at hjælpe dig med at forstå visse jordelementers struktur.
Cartoon Builder
Tegn interessante tegneseriebilleder med denne minimale og interaktive tegneseriebygger.
Træk alt her
Træk alt, hvad du kan trække i demoen for at vise detaljer.
Gartic Sketch
En original HTML5-applikation, der giver dig mulighed for at lave nogle grundlæggende tegninger, der kan gemmes i forskellige billedformater som jpeg eller png.
PhysicSketch
Tegn hvad du vil, og se, hvordan de reagerer med simuleret tyngdekraft.
Sketchpad
Et kraftfuldt HTML5-tegneprogram, der giver dig mulighed for at tegne og redigere dit billede på den præcise måde.
Smalltalk
En webapplikation, der bekræfter den geografiske placering af vejrrelaterede meddelelser, der er erhvervet fra Twitter, og således danner dem til et lærredsbaseret “socialt vejr”-kort, ganske trivielt (som anført af forfatteren), men interessant.
Spil
3Bored
Du vil aldrig kede dig, hvis du kan blive ved med at undvige hundredvis af HTML5-kugler i næste sekund.
Breakout
Rebound the ball to break all bricks.
Canvascape
Det er ikke helt et spil, men det demonstrerer, hvordan HTML5 kan bruges til at udvikle et browserspil til First Person Shooting.
Catch It
Hvor mange bolde kan du undvige for at få din vindende HTML5-plads?
Chain Reaction
Kæd eksplosionen for at nå målet, bliv ikke afhængig.
Cubeout
Spil Tetris i 3D, top-down view.
etchaPhysics
Tegn emne for at flytte bolden til stjernen, glem ikke tyngdekraften.
Puslespil
Klik, drej og slip puslespilsbrikker for at løse dette HTML5-baserede puslespil.
Slide Puzzle
Slide til sejren, et andet HTML5-spil, der er bygget til at presse din hjerne saft.
Same Game
Fjern en bestemt gruppe for at få en anden gruppe parret i samme farve, og du vil i sidste ende blive tildelt en sejr.
Tetris
Et af de mest klassiske spil bragt tilbage til livet af HTML5.
Torus
Endnu et Tetris-spil i pseudo-3D-version.
Konklusion
Hvad er begrænsningen ved HTML5? På dette tidspunkt kan vi ikke afgøre det, men med den imponerende video nedenfor kan vi vide, hvor langt HTML5 er blevet skubbet:
Ja, det er Quake II i webbrowser, så nu er det meget klart, at med HTML5 vil der blive født flere banebrydende webapplikationer, der kan betjene milliarder af internetbrugere. Det er hurtigt, det udvikler sig, og det er ved at ændre world wide web. Spørgsmålet er, hvordan du vil bruge dette HTML5, der ændrer spillet?
Vi vil gerne høre din idé!