Hvernig WebGL endurheimtir arfleifð Flash
Manstu eftir öllum þeim verkefnum með framúrskarandi samskiptum, hugsandi hreyfimyndum og spennandi meðfylgjandi hljóðum sem leiddu til mikillar innblásnar notendavara? Já, líkurnar eru á þeim sem voru búnar til með hjálp Flash.
Hins vegar hata ég að viðurkenna það, tímum þessa mikla margmiðlunar vettvang er lokið. Flash er loksins dauður. En óttast ekki! Eins og oft gerist þegar einn dyr lokast, opnar annar, og Flash er hægt að skipta út með fréttari og kröftugri eftirmaður. Technologies eins WebGL , og meðfylgjandi JavaScript bókasöfn eins og Three.js eru ört vaxandi og gerir verktaki kleift að byggja Flash-eins og verkefni án þess að fylgja öryggisvandamálum.
Í dag ætlum við að leggja áherslu á WebGL og Three.js. Þetta pörun er öflugur valkostur fyrir immersive UX.
WebGL og Three.js
WebGL þjónar sem grunnur sem veitir tæki til að vinna með gagnvirkri 3D og 2D tölvu grafík. Það gefur þér tækifæri til að blanda saman og passa þætti með HTML-þætti og sameina þær við aðra efnisþætti á síðunni eða bakgrunni.
Three.js er Javascript bókasafn með lista yfir hár-endir lögun sem leyfir þér að starfa með tjöldin, myndavélar, ljós, rúmfræði og fleira. Það er ætlað að opna möguleika WebGL með því að bæta auka virkni við vettvang. Það gerir það einfalt að búa til GPU-flýta 3D hreyfimyndir án þess að treysta á viðbótum vafra.
Samhæfni málefni
Með nútíma tækni ertu alltaf í vandræðum: annaðhvort búið til "einn stærð passar allt" verkefni sem mun hlaupa á mismunandi tækjum og bjóða upp á samræmdan notendavandann eða setja allt á línuna og þegar í stað vekja hrifningu áhorfenda sem þú getur náð .
Með WebGL og Three.js er það sama sagan. Safari, Opera og meirihluti farsímavafna (og það er að segja ekkert um Internet Explorer) eru eins og flug í Chardonnay. Því miður er fjöldi notenda fastur við arfleifar vafra, þannig að eindrægni er nokkuð hindrun en stuðningur er að aukast (sem er meira en hægt er að segja fyrir Flash) og að því tilskildu að þú notir það ekki fyrir neinn verkefni sem skiptir máli, WebGL og Three.js eru frábærir valkostir.
Dæmi
Ógilt
Ógilt er tilraun með Hi-ReS !, skapandi stúdíó með aðsetur í London. The verktaki vildi abstrakt frá takmörkunum sem felast í nútíma vettvangi og vöfrum og prófa takmörk núverandi tækni. Það virðist sem þeir negldu það.
Það er eingöngu skrifborð forrit sem er knúið af WebGL og Web Audio lögun. Þrátt fyrir Howler.js, GSAP og Coffee Collider, tók Three.js þátt í að framleiða þessa framúrskarandi leiksvæði sem óvart dregur á netinu gesti í ferðalag sem lítur út eins og stafræn bók.
Endurskipuleggja ágæti
Þessi gagnvirka herferð hollur til Sennheiser er afmælisdagur sem sameinar ekki aðeins stórkostlegar Sci-Fi landslag heldur einnig fjölmargar háþróaða eiginleika og smáatriði. Það er hreint Króm tilraun sem gerir gestum kleift að taka þátt í myndun og mótun hljóðmerkis. Þrátt fyrir að áfanga myndunarinnar hafi verið lokið, tóku ein milljón manns um allan heim til þátttöku í því, að það væri brúin. Þér er velkomið að gera þitt eigið framlag, skoða þessa miklu hljóðskúlptúr og notaðu innra myndskeiðið og hagnýta framkvæmdina.
Bruno Quintela
Persónulega eigu Bruno Quintela er rauntíma veitir WebGL tilraun sem sýnir möguleika listamannsins og möguleika núverandi vefur tækni. Notaðu músina til að skoða svæðið vandlega. Dragðu það í mismunandi áttir til að sjá hvað er falið inni í þessu magni nákvæmlega sett saman 3d marghyrninga með gljáðum fleti. Hugmyndin þjónar sem frábær opnun fyrir vefsíðuna sem skilur sterkan og varanlegan fyrstu sýn.
Agnapróf
Þetta verkefni sýnir hvirfilvind meira en minna pantaðar og skipulögð rör af agnum sem geislar af hátækni. Það er stjórnstöð sem hvetur þig til að spila með slíkum eiginleikum eins og radíus í sívalur-lagaður ský, þéttleiki rör, hæð, mælikvarða og fleira. Hugmyndin er dáleiðandi.
Vatnsskyggni
Þessi listamaður hefur tekist að líkja eftir vatnalífverum með því að líkja eftir náttúrulegum hegðun vökva. The kúptur lögun og bylgjulengd yfirborð með sól endurspeglun sem lýkur snertir endurskapa sannarlega raunhæf vettvangur sem grípur augun frá fyrstu sekúndu.
WebGL kornhöfuð
Eins og þeir voru þegar Flash var vel, eru agnir öll reiði nú á dögum. Teiknimyndir í ýmsum stærðum og gerðum má sjá í fjölmörgum verkefnum og þetta verk er einn slíkur. The lúmskur útgáfa af höfði sem er óljóst minnir á greindur manna-eins og vélmenni frá skáldsögum Isaac Asimov er sanna meistaraverk. Ekki aðeins er framkvæmdin á óvart, heldur einnig hegðun hennar. Það bregst við hreyfingum músanna, náttúrulega halla höfuð til hægri, vinstri, upp og niður.
Dynamic 3D Confetti Texti
Texti áhrif eru ein af leiðunum til að kryggja upp leiðinlegt tengi með skýringu á playfulness og svali sem og leggja áherslu á nauðsynlega stafsetningu. Rachel Smith er confetti-innblásin lausn mun örugglega hjálpa til við að auðga hönnunina með skærum tilfinningum og setja titilinn á miðjuna. Sláðu inn orð í innsláttarreitnum hér fyrir neðan til að sjá allt galdra. Björt og skær 3D rúmfræðilegir stykki munu móta beiðnina og gera niðurstaðan snjallt gagnvirkt.
3D Panorama Viewer
Three.js kemur sér vel í sameiginlegum verkefnum sem Max Chuhryaev reynir. Lausn hans umbreytir auðveldlega víður myndir í grundvallaratriði í notendavandanum. Það hefur skemmtilega sjónarhorni og hægt að færa myndavélina: saman gerir þau þér kleift að finna hluti af samsetningu. Það gengur vel með landslag, borgarmyndir og innréttingar, sem gerir notendum kleift að njóta fegurðar truflanir margmiðlunar.
Triangle Pattern Generator
Þessi tilraun gefur þér frábær marghyrndan bakgrunn með fallegu 3D tilfinningu. Það virkar líka sem leiksvæði þar sem þú getur gert sum svæði bjartari og aðrir dimmer: bara nota músina. Valkosturinn gerir þér kleift að stilla upp mikið af upplýsingum um striga, þar á meðal ljós, möskva, hlaða og jafnvel flytja út stillingar.