Trend dizajna: fotografije koje oživljavaju
Fotografija uživo. Cinemagraph. Pomične slike. Još uvijek u pokretu. Toliko je imena ovog trenda u web dizajnu, prepoznatih po junačkoj slici za koju se čini da oživljava na suptilan način.
Nije baš fotografija, ali nije ni videozapis. Pokret je često ograničen na jednu radnju na slici kako bi se privukla pažnja korisnika i privukla ih u sliku. Bez obzira na to kako ga nazivate, ovaj trend utječe i pojavljuje se svuda u web dizajnu, kao dijeljivi gifovi i na društvenim mrežama.
Evolucija trenda
Teško je reći odakle je krenula ideja za "žive" fotografije, ali možete tvrditi da je Apple pomogao da bude popularniji. Tvrtka je predstavila fotografije koje uključuju dodir s kretanjem s iPhoneom 6S. Taj mali dodatni trenutak užitka isti je koncept za žive fotografije na web stranicama. Nešto je dodatno u zvjezdanoj slici zbog čega je gledate samo malo duže.
Taj isti koncept pokretnih slika počeo se pojavljivati na više mjesta. Čini se da još uvijek kadrirajuće reklame na digitalnim panoima uključuju nekoga tko tada treperi ili namigne na vas. Čak i postave za Sunday Night Football uključuju igrače glave koje trepere nakon sekunde, pokazujući vam da je to zapravo aktivna akcija.
Zašto koristiti ovu tehniku? Duže drži pažnju korisnika i pruža zanimljiviju točku vizualne reference. Flixel, tvrtka koja proizvodi kinografske slike za kupce, kaže da prosječna fotografija u pokretu drži pozornost korisnika 9 sekundi, u odnosu na 1 sekundu za prosječnu fotografiju.
Fotografije ili ilustracije
Žive slike ili kinografije mogu raditi s fotografijama ili ilustracijama. Ne postoji pravilo koje kaže da morate koristiti jednu ili drugu vrstu slika. Gledajući dvije slike gore, možete vidjeti da bilo koji stil može biti vrlo učinkovit.
Drugo razmatranje je da se gibanje ne mora stalno odvijati u petlji. Hillmann Living iznad sebe baca proizvode na početnu stranicu dok se puni. To je jedini pokret i tada je fotografija upravo to, mirna fotografija. Ono što je u vezi s učinkom lijepo je to što vas tjera da gledate izravno u stolice koje tvrtka prodaje odmah. Ova tehnika na suptilan i zanimljiv način prikazuje korisnicima ono što je na stranici važno i na što se trebaju usredotočiti.
Bar Z Wines koristi drugi pristup. Ilustrirana početna stranica čini se u početku prilično otvorena, ali mala ravnina leti petljom kroz gornje središte zaslona. Taj pokret pomaže usmjeriti korisnika da pogleda važne riječi na ekranu: "Naša su vina nefiltrirana." Korisnik odmah zna nešto o porukama na ovoj web stranici jer ih privlači najvažniji jezik zahvaljujući pokretu na zaslonu.
Savjeti za uspjeh
Ova tehnika može raditi na brojne načine i za različite dizajnerske primjene. Neki od najboljih primjera dolaze iz jednostavnih prizora ili pejzaža gdje je lijepa fotografija polazna točka.
Trava se može kretati na vjetru ili u krajoliku. Osoba može treptati kad se izloži u i predimenzioniranom glavom. Proizvod se može nagnuti ili okrenuti ili dovršiti radnju za koju je dizajniran.
Najvažnija stvar kada razmišljate o ovom trendu je jednostavnost. Ako je previše gibanja, vjerojatno biste se trebali odlučiti za video. Element iznenađenja je ono što ga čini; korisnici očekuju mirnu sliku, ali to tada zaživi.
- Držite se jedne stvari i jedne upotrebe po web mjestu.
- Treba izgledati realno.
- Kretanje mora slijediti zakone fizike.
- Kretanje treba biti suptilno, ali uočljivo.
- Ne pretjerujte dodavanjem zvuka ili puno klikova radnji.
- Razmotrite suptilnu kontrolu korisnika, poput pokreta koji se događa pokretima miša.
- Razvijte pokretnu sliku koja se može koristiti u više kampanja, a ne samo na vašoj web lokaciji.
Kako to radiš?
Postoji puno načina da se ovaj efekt stvori u vašim dizajnovima. Metoda zaista određuje na vašoj razini vještine, kako planirate koristiti žive slike i proračun.
Neke od opcija za stvaranje suptilnog pokreta uključuju:
- Stvorite gif.
- Upotrijebite mrežni alat (dostupan je broj s različitim troškovima.
- Stvorite sliku kao video s ograničenim pokretima.
- Koristite aplikaciju ili čak svoj iPhone.
- Skupite fotografije u video formatu.
Isprobajte ovaj YouTube vodič kako bi vam pomogao u planiranju i stvaranju žive slike.
Savršen primjer
Web stranica za Monochrome Paris savršen je primjer ovog trenda na djelu. Početna stranica naizgled je jednostavna slika zapisa, ali kruti element gotovo izgleda istopljen i preuzima kretanje tkanine koja se kreće na vjetru. Učinak je privlačan, privlačan i privlači korisnike u dizajn.
Učinak pomaže stvoriti interes na suptilan način. Zamišljeni vizual izgleda malo realnije zbog pokreta. Pomičite se po stranici i drugi pomični elementi pozdravljaju korisnika, uključujući normalan prikaz okretanja zapisa.
Ova web stranica je izvrsna studija slučaja u učinkovitim načinima korištenja ovog trenda. Nagnite se i kliknite da vam pomogne u jogiranju.
Zaključak
Bez obzira na to kako ga nazivate, živa slika jedan je od onih trendova koji će se vjerojatno zadržati. To je još jedan način dodavanja animacije dizajnu, bez nužnog stvaranja stvarnog videozapisa. To je učinkovito i može biti puno jeftinije od video produkcije.
Trik u ovom trendu je osigurati da izgleda namjerno i stvarno. Uključivanje blesavog pomaka pokreta nužno vam neće dati željeni efekt. Vratite se i stvarno pogledajte gore navedene primjere, idite na web stranice i kliknite ovdje. Pogledajte na što vas ta animacija vodi u dizajnu. U svakom od primjera, pokret pomaže korisniku da dođe do određenog elementa ili izvrši određenu radnju. Ta namjerna i usmjerena uporaba pokreta ključ je učinkovitog dizajna kinografija.
