|
АБРАКАДАБРА (Тоже самое но в читаемом виде)
Luboy, kto igral ili nabludal za igroy druzey, libo v principe videl
igri, kotorie bili vipu6eni v 80-90-x godax, doljni bit' znakomi s
texnikoy parallaks-skrollinga.
Vspomnite takie igri, kak Mario Bros, Streets of Rage, Mortal Kombat, Turtles in Time ili original'nuu igru Moon Patrol.
V etix igrax texnika parallaksa nabludaetsa v tot moment, kogda
neskol'ko fonovix sloev s razli4nimi teksturami dvigautsa s raznoy
skorost'u, 4to sozdaet effekt trexmernogo prostranstva.
Po4emu a na4al govorit' o retro-igrax v stat'e o veb-razrabotke? Samim
prostim otvetom mog bi bit' «potomu 4to oni klevie», no net.
Parallaks-skrolling avlaetsa klassnim dizaynerskim konceptom, kotoriy
prokladivaet svoy put' v mir veb-dizayna. Nike bili odnimi iz pervix,
kto ispol'zoval etu texniku s bol'6im uspexom, kogda oni nanali
marketingovix gigantov Weiden and Kennedy dla razrabotki ix
original'nogo sayta Nike Better World. Sayt Nike Better World s togo
vremeni bil obnovlen i zamenen na noviy, odnako est' drugoy sayt,
dovol'no poxojiy na to, kak vigladel perviy parallaks-dizayn ot Nike —
sayt o sportivnix napitkax Activate.
Navernoe, vi zametili, 4to vo vrema prokrutki stranici sayta vniz
neskol'ko razli4nix elementov, naxoda6ixsa na etoy stranice, dvigautsa s
raznoy skorost'u. Davayte dla primera voz'mem stranicu, otobrajennuu na
kartinke sverxu. Po mere prokrutki stranici vniz vi uvidite, 4to
golubie to4ki v fone (te, kotorie nemnogo razmiti), dvigautsa s toy je
skorost'u, 4to i skrollbar. Takje, vi uvidite, 4to gruppa golubix to4ek,
kotorie bolee sfokusirovani i lejat na perednem plane, dvigautsa s
nemnogo bol'6ey skorost'u, 4em skrollbar. Bistree etix to4ek dvigaetsa
tekst “0 SUGAR | 0 CALORIES | NATURALLY SWEETENED” i glavniy zagolovok
stranici “Products”. I, nakonec, est' izobrajenia samogo produkta, kak
malen'kie i rasfokusirovannie v fone, tak i bol'6ie, sfokusirovannie i
leja6ie na perednem plane. Fonovie izobrajenia produktov dvigautsa s toy
je skorost'u, 4to i tekst, v to vrema kak izobrajenia produktov na
perednem plane dvigautsa bistree etogo teksta. Eto vse i avlaetsa
ideal'noy demonstraciey parallaks-skrollinga, kogda raznie sloi
izobrajeniy nakladivautsa drug na druga i vse dvijutsa s raznoy
skorost'u pri prokrutke stranici, sozdavaa effekt trexmernosti.
Parallaks-skrolling ne ograni4ivaetsa tol'ko vertikal'nim skrollom
stranici ili skrollingom po pramoy linii. Otdadim pravo Nintendo dla
demonstracii ideal'nogo primera, podtverjdau6ego eto utverjdenie.
Vspomnite rannie igri Nintendo, gde na6i geroi obi4no dvigalis'
gorizontal'no sleva napravo vdol' ekrana, a ne vertikal'no vniz, kak mi
videli eto na sayte Activate vi6e. Prokatites' na MarkioKart Wii i davayte pogovorim o nekotorix klevix 6tukax, kotorie mi tam mojno uvidet'.
Pervuu ve6', kotoruu vi zametite, eto napravlenie skrollinga stranici —
ono ne vertikal'noe, a kak skazano vi6e, a izna4al'no gorizontal'noe.
Kone4no, eto kruto, no eto takje ne noviy koncept. Takje, vi zametite
parallaks-effekt s dinozavrom Yo6i i pancirami na fone, Mario i Luidji
na perednem plane i osnovnim kontentom, kotorie sme6autsa s raznoy
skorost'u pri prokrutke. No kak tol'ko vi doedete do stranic #highlights
i #attack, traektoria sme6enia perestanet bit' ideal'no gorizontal'noy.
To je samoe kasaetsa perexoda mejdu stranicami #rediscover i #snes.
Izobrajenia ne tol'ko soxranaut svou raznuu skorost' sme6enia, no i
menaut ob6ee napravlenie s gorizontal'nogo na vertikal'noe.
Stoit takje otmetit', 4to ispol'zovanie effekta parallaksa na va6em
sayte ne doljno bit' ograni4eno li6' vozmojnost'u sozdania
iskusstvennogo 3D-effekta. Sayt nemeckoy studii veb-dizayna Webseitenfactory
avlaetsa primerom togo, kak mojno ispol'zovat' parallaks dla dobavlenia
razli4nix effektov na stranicu sayta, naprimer dvijenie ikonok po
raznim traektoriam, ix uveli4enie i umen'6enie po mere skrollinga sayta.
Parallaks-skrolling takje mojet pomo4' ojivit' sayt, na kotorom ne osobo
mnogo kontenta. 4to esli ves' va6 sayt sostoit iz mission statement,
ili razdela about us, plus kontaktnaa informacia? Skoree vsego, vi bi
mogli sdelat' eto odnoy stranicey i pri opredelennix usloviax u vas bi
polu4ilsa neploxoy odnostrani4niy sayt, no zapomnitsa li on posetitelam?
Skoree vsego, net. No 4to esli dobavit' k nemu nemnogo parallaksa, kak
eto sdelal narod na Spring / Summer ?
Moim pervim vpe4atleniem bilo “O, etot sayt vigladit simpati4no”. No
kogda a na4al ego skrolit', vpe4atlenie srazu je stalo “Vau, etot sayt
krut!”. Dobavlenie prostogo parallaks-effekta kak raz delaet raznicu
mejdu neploxim i zapominau6imsa.
Parallaks-skrolling — eto xoro6iy truk, kotoriy mojno derjat' v rukave. I
ego vsegda mojno primenit' nezavisimo ot togo, delaete li vi slojniy
mul'tistrani4niy sayt, ili je prostoy odnostrani4niy sayt-vizitku.
Primeri saytov s parallaksom
Nekotorie iz nix o4en' krutie, rekomenduu oznakomit'sa:
- artofflightmovie.com
- laurentiuswonen.com/jaarverslag2010
- smartusa.com
- beetle.com
- liptonicetea.pl
- manufacturedessai.it
- iutopi.com
- marklawrencedesign.com
- rapidboot.com
- reverenddanger.com
- netlash-bseen.be
- discover.store.sony.com
|
|