48 brutalnih predstavitev HTML5 / CSS3

platno risanka animacija HTML5 Predstavitev: 48 možnih predstavitev Flash Killing

S to objavo rešim vprašanje, ki ste ga nedavno postavili v komentarjih članka:

Kdaj je pravi čas, da začnete v celoti oblikovati s HTML5?

No, iskreno, odvisno je od cilja, ki ga ciljate. Če ne nameravate, da bi obiskovalci uporabljali Internet Explorer (npr .: stran s programsko opremo Mac), takoj začnite s HTML5, če pa za ogled vašega spletnega mesta potrebujejo ljudi z IE, raje počakajte ...

Ob vstopu, že po skoku 48 predstavitev HTML5, ki so neverjetne in si zaslužijo ogled. Super je malo.

Vir | HongKiat

audioburst Animacija

Udobna in fantastična animacija, ustvarjena s platnom in zvočno oznako HTML5.

animacija zvočnega izbruha HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Bazen z žogo

Ta predstavitev je bila predstavljena na zadnjem Googlovem vhodno / izhodnem dogodku in vam pokazala, kako dinamičen je lahko HTML5.

bazen z žogami HTML5 Predstavitev: 48 predstavitev potencialnih Flash Killing

Blob salata

Bitje, ki ga je ustvaril HTML5, ki bi vam bilo všeč.

blob sallad Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

bomomo

Z Bomomo lahko opazujete različna atomska gibanja, simulirana s HTML5.

bomomo HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Brskalniška žoga

Presenetite se s to kroglo HTML5 v "brskalniku".

brskalniška kroglica HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Bubbles

Zabavajte se z ustvarjanjem neskončnih plavajočih mehurčkov z različnimi barvami.

mehurčki Predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

Canvas Cartoon Animacija

Preprosta in smešna risanka HTML5, ki vam pomaga razumeti, kaj lahko naredi element platna HTML5.

platno risanka animacija HTML5 Predstavitev: 48 možnih predstavitev Flash Killing

Kul ura

Lepa, prilagodljiva analogna ura, ki sta jo zgradila HTML5 in JavaScript.

predstavitev v obliki hladne ure HTML5: 48 predstavitev potencialnih ubijanj Flash

Diaprojekcija Flickr PS3

Oglejte si fotografije svojega Flickrja s diaprojekcijo v slogu PS3 v spletnem brskalniku.

flickr ps3 diaprojekcija HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Interaktivni polaroid

Interaktivni demo, ki deluje podobno kot vmesnik z več dotiki.

interaktivna predstavitev polaroid HTML5: 48 predstavitev potencialnih Flash ubijanja

JS ognjemet

Uživajte v ognjemetu z želeno težo in hitrostjo, ki jo poganjata HTML5 in Javascript.

js ognjemet Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

Kaleidoscope

Zelo lep in futurističen kalejdoskop HTML5.

predstavitev kaleidoskopa HTML5: 48 predstavitev potencialnega ubijanja Flash

Tekoči delci

Občutljiva animacija delcev, ki reagira na podlagi premikanja miške.

predstavitev tekočih delcev HTML5: 48 predstavitev potencialnega ubijanja Flash

mesmerizer

Še ena občutljiva in izjemna predstavitev HTML5, ki prikazuje, kako se elementi v bližini odzivajo na premikanje miške.

mesmerizer HTML5 Showcase: 48 predstavitev potencialnih Flash ubijanja

Meglica oblak

Izgubite se s to čudovito meglico HTML5.

meglica oblak HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Parallax

Oglejte si vse 2D oblike v vzporedni perspektivi.

predstavitev paralaksa HTML5: 48 predstavitev potencialnega ubijanja Flash

Animacija delcev

Elegantna animacija delcev HTML5, ki se lahko oblikuje v vaše želeno sporočilo.

predstavitev animacije delcev HTML5: 48 predstavitev potencialnih Flash ubijanja

Širjenje

Izgubite se s to neskončno razširjeno animacijo.

širjenje predstavitve HTML5: 48 predstavitev potencialnih predstavitev za ubijanje Flash

Starfield

Zelo kul animacija HTML5 starfield, ki bi spreminjala smer in hitrost glede na premikanje miške.

predstavitev starfield HTML5: 48 predstavitev potencialnih Flash ubijanja

Video uničenje

Z enim klikom povečate predvajani video.

video uničenje Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

Valovna oblika

Upoštevajte, kako se platneni val HTML5 premika s spreminjanjem njegove amplitude, valovne dolžine, širine itd.

predstavitev valovnih oblik HTML5: 48 predstavitev potencialnih ubijanj Flash

Učinek 3D

Ste navdušeni nad platneno animacijo? To lahko več naredi element platna HTML5 in se imenuje 3D učinek. Razvijalec se lahko zanese na element platna, DOM in JavaScript za ustvarjanje 3D učinka, ki ga je kasneje mogoče razviti v 3D animacijo ali igro.

Canvas3D in Flickr

Izkusite povsem novo 3D izkušnjo s Flickr-jevim fototokom.

canvas3d in flickr Predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

Simulacija krpe

Realistična simulacija krpe na osnovi HTML5.

simulacija krpe HTML5 Predstavitev: 48 predstavitev potencialnega ubijanja Flash

Razvijajoča se pošast

Opazujte pošast, ki se razvija v zapleteno bitje, eden od njenih ustvarjalcev je HTML5.

predstavitev razvijajoče se pošasti HTML5: 48 predstavitev potencialnega ubijanja Flash

Google Gift Box

Ogromen iskalnik Google je predstavljen v 3D, predvajanem pogledu.

google giftbox Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

J.S. Dotik

Visokokakovostna in realistična vitrina "3D na 2D platnu".

js touch HTML5 Showcase: 48 predstavitev potencialnih Flash ubijanja

Predstavitev podatkov

Element platna HTML5 lahko uporabimo za ustvarjanje animacije in 3D učinka, lahko pa ga uporabimo tudi za predstavitev matematičnih podatkov.

gnuplot

Gnuplot, aplikacija za načrtovanje podatkov v različici HTML5.

gnuplot Predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

RGraph

RGraph ponuja široko paleto predstavitev podatkov, kot so stolpčni grafikon, vrstica napredka in tradicionalni radarski grafikon.

rgraph Predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

Spletna aplikacija

Na koncu lahko z uporabo vseh možnosti, ki jih kombinirajo HTML5 in drugi jeziki, ustvarimo interaktivno aplikacijo ali igro, ki je blizu aplikaciji Flash.

CanvasPaint

Pričajte, da v vaš spletni brskalnik vstopi brat Microsoft Painta, njegov oče pa je HTML5.

canvaspaint HTML5 Predstavitev: 48 predstavitev potencialnega ubijanja Flash

CanvasMol

Znanstvena aplikacija, ki vam pomaga razumeti zgradbo določenih elementov zemlje.

canvasmol HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Graditelj risank

S tem minimalnim in interaktivnim ustvarjalcem risb narišite zanimivo risano sliko.

Izdelovalec risb HTML5 Predstavitev: 48 predstavitev potencialnih Flash Killing

Povlecite karkoli sem

Povlecite vse, kar lahko povlečete v predstavitvi, da prikažete podrobnosti.

povlecite karkoli sem Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

Gratična skica

Izvirna aplikacija HTML5, ki omogoča izdelavo nekaterih osnovnih risb, ki jih lahko shranite v drugačno obliko slike, kot sta jpeg ali png.

gartic skica Predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

PhysicalSketch

Narišite, kar vam je všeč, in poglejte, kako se odzovejo s simulirano gravitacijo.

predstavitev physicsketch HTML5: 48 predstavitev potencialnega ubijanja Flash

Sketchpad

Zmogljiva aplikacija za risanje HTML5, ki vam omogoča natančno risanje in urejanje slike.

Predstavitev skice HTML5: 48 predstavitev potencialnih ubijanj Flash

Majhen pogovor

Spletna aplikacija, ki potrjuje geografsko lego vremenskih sporočil, pridobljenih s strani Twitterja, in jih tako oblikuje v zemljevid "socialnega vremenskega" zemljevida, precej nepomembnega (kot navaja avtor), a zanimivega.

smalltalk predstavitev HTML5: 48 predstavitev potencialnega ubijanja Flash

Game

3 Dolgčas

Nikoli vam ne bi bilo dolgčas, če se boste lahko v naslednji sekundi izognili na stotine oznak HTML5.

Predstavitev 3bored HTML5: 48 predstavitev potencialnih ubijanj Flash

Izbruh

Odbijte žogo, da razbijete vse opeke.

predstavitev predstavitve HTML5: 48 predstavitev potencialnih ubijanj Flash

canvasscape

Ni povsem igra, vendar prikazuje, kako lahko HTML5 uporabimo za razvoj brskalne igre First Person Shooting.

canvascape predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

Ujemi

Koliko kroglic se lahko izognete, da dobite svoj zmagovalni kvadrat HTML5?

catch it HTML5 Predstavitev: 48 potencialnih predstavitev Flash Killing

Chain Reaction

Veriga eksplozije za dosego cilja, ne bodite zasvojeni.

verižna reakcija HTML5 Predstavitev: 48 predstavitev potencialnega ubijanja Flash

Izrez

Igrajte Tetris v 3D, od zgoraj navzdol.

predstavitev HTML5: 48 predstavitev potencialnih Flash ubijanja

etchaPhysics

Narišite element, da premaknete žogo do zvezde, ne pozabite na gravitacijo.

etchaphysics HTML5 Predstavitev: 48 predstavitev potencialnega ubijanja Flash

Jigsaw Puzzle

Kliknite, zavrtite in spustite koščke sestavljanke, da razrešite to sestavljanko, ki temelji na HTML5.

sestavljanka HTML5 Predstavitev: 48 predstavitev potencialnega ubijanja Flash

Slide Puzzle

Drsite do zmage, še ena igra HTML5, ki je zasnovana tako, da vam stisne miselni sok.

diapozitiv diapozitiva HTML5 Predstavitev: 48 predstavitev potencialnih Flash ubijanja

Ista igra

Odstranite določeno skupino, da dobite drugo skupino v isti barvi in ​​sčasoma boste prejeli zmago.

ista igra HTML5 Predstavitev: 48 predstavitev potencialnih Flash Killing

Tetris

Ena najbolj klasičnih iger, ki jo je HTML5 oživil.

predstavitev tetris HTML5: 48 predstavitev potencialnih Flash ubijanja

torus

Še ena igra Tetris v psevdo-3D različici.

predstavitev torusa HTML5: 48 predstavitev potencialnega ubijanja Flash


Pustite svoj komentar

Vaš e-naslov ne bo objavljen. Obvezna polja so označena z *

*

*

  1. Za podatke odgovoren: Miguel Ángel Gatón
  2. Namen podatkov: Nadzor neželene pošte, upravljanje komentarjev.
  3. Legitimacija: Vaše soglasje
  4. Sporočanje podatkov: Podatki se ne bodo posredovali tretjim osebam, razen po zakonski obveznosti.
  5. Shranjevanje podatkov: Zbirka podatkov, ki jo gosti Occentus Networks (EU)
  6. Pravice: Kadar koli lahko omejite, obnovite in izbrišete svoje podatke.

  1.   Lizika je dejal

    TETRIS NE GRE, VNOSIM DVA KOSA IN STOJI, PA POČITEK SO ZELO HLADNI ČAVALI

  2.   Elisa je dejal

    Obožujem to stran ... razen prve igre. Ljubim te Fran =)
    Adijo poljub na svet prevečooooooooo

  3.   Helsinščina je dejal

    Neverjetno, spektakularno. Ne morem verjeti, kako daleč je prišel spletni razvoj!

  4.   Joe vega je dejal

    Ne vem, zakaj se ti viri pripisujejo HTML5, to je čisti Javascript, pred vzponom Flash-a, z Javascriptom ste lahko počeli vse te stvari, v Barceloni je bila raziskava, ki je naredila nekatera spletna mesta, ki so mi takrat padla v glavo, vse v javascriptu toliko, da sem se naučil od njih in oblikoval par z odskočnimi kroglicami in vse, popolnoma sem jih izgubil in še vedno obžalujem. Ne spomnim se imena studia, to je bilo nekaj takega kot ti2 ali 2i2, to je bilo leta 98 ​​ali približno tako.

  5.   ASDF je dejal

    Joe Vega ... ... kaže, da nimaš nobene ideje o HTML5 ... .lol

  6.   Joe vega je dejal

    Morda nimate kakšne krvave ideje o html5, res je, vendar petelina zamenjate s kokošnjakom in jezika ne ločite od okolice. Izzivam vas, da naredite primer, kakršen je tukaj, brez uporabe Javascripta, samo s html5, in razumeli boste, kaj sem mislil v objavi, ki sem jo izbrisal. Še več, gledal sem izvorno kodo primerov in obstaja nekaj, ki jih je mogoče enostavno narediti, ne da bi jih pritrdili na html5.
    Res je, da html5 prinaša številne izboljšave in stvari, ki veliko olajšajo, toda lovorika fantastične stvari, ki je prikazana na tej strani, je Javascript.

  7.   santiago barcheta je dejal

    Zanimajo me predstavitve te vrste ... ali imate vadnico ali stran z viri ?? Hvala vam!!!