Principi animiranog sučelja: Disney je mrtav

Predviđalo se da će fotografija biti smrt slike (rani dagereotip)

(Ako želite primati moje članke o animaciji sučelja putem e-pošte i biti dodani u moj bilten, kliknite ovdje.)

Novi medij

Kad se Paul Delaroche negdje oko 1839. godine susreo s Dagereotipom, on je slavno izjavio: "Od danas je slika mrtva!"

Do tada je jedini način vizualnog dokumentiranja vanjskog svijeta bio upotreba medija ručno nanesenog na površinu. Stoljeće zanata u različitim disciplinama rezultiralo je otkrivanjem brojnih načela i tehnika u raznim medijima. Kroz kulture i kako su ere napredovale, razvijali su se stil i vizualni jezik kako bi vizualni prikazi "trebali izgledati" - izvorni obrasci dizajna.

Rani fotografi, pokušavajući da njihove slike nalikuju popularnim slikama dana, često su koristili kombinaciju tehnika rasvjete i tiska kako bi ublažili svoje slike i stvorili slikarski izgled. Njihovo razumijevanje onoga za što je medij fotografije sposoban bilo je usko povezano, utjecalo i ograničavalo njihovo razumijevanje svijeta slikarstva.

Prošlo je gotovo stotinu godina prije nego što su fotografi poput Ansel Adams, Imogen Cunningham, Edward Weston i drugi iz 'Group f / 64' napravili značajan pomak u vizualni jezik koji fotografiju osim slike predstavlja kao jedinstveni medij - s vlastitim vizualnim jezik i načela, i čineći to, revolucionirali su domenu fotografije.

Edward Weston, Imogen Cunningham, Ansel Adams

Disney je riješio drugačiji problem

Srećom, našli smo se u takvoj revoluciji u UI animaciji.

Ollie Johnston i Frank Thomas su 1981. objavili Disney Animation: The Illusion of Life i uveli ono što je danas poznato kao '12 osnovnih načela animacije. 'Ovi su principi riješili problem stvaranja "realističnog pokreta" koji se događa kada organska tijela kretati se i reagirati u fizičkom prostoru (načela također pokrivaju stvari poput emocionalnog vremena i privlačnosti likova).

Animacija putem sučelja, kao dio korisničkog iskustva, stara je tek 20 godina i još je u povojima. Kako se pojavila domena UI animacije, jedini alati koji su mogli opisati kako se korisničko sučelje ponaša u vremenu bili su 12 principa animacije. Kao i to kako su rani fotografi pokušali razumjeti fotografiju kroz pravila slikanja, dizajneri su pokušali razumjeti UI animaciju kroz pravila Disneyjeve animacije.

Na površini, to je razumljivo jer postoji određeni stupanj preklapanja. Oduženi pokret, jedan od 12 načela animacije, pojačava osjećaj ispravnosti kroz pokret, nešto što je presudno za korisničko iskustvo. Bez olakšavanja, UI animacija se osjeća nespretno i čudno.

Potpuni prikaz vidljiv je kada se pobliže pogleda 12 načela u kontekstu korisničkog sučelja.

Squash i Stretch daju težinu i fleksibilnost objektima, što je više iznimka, a ne pravilo u korisničkim sučeljima.

Očekivanje stvara osjećaj da će se nešto uskoro dogoditi, a također je i gotovo beskorisno kada je u pitanju korisničko iskustvo. Djeluje na ograničen način za odabir mikro interakcija i stanja tipki.

Izložba se odnosi na izgled animacije, što ima smisla za Disneyjev crtić jer su likovi stalno u pokretu, ali u korisničkom iskustvu, ovo se misli samo kao 'dizajn'.

Straight Ahead Action i Pose to Pose su manje principa nego pristupa stvarnom procesu crtanja / animacije: možete stvoriti fluidniju animaciju ako crtate kontinuirane okvire ili koristite pozu za pozivanje za postavljanje nekoliko ključnih okvira i popunjavanje praznina , U iskustvima korisnika ovaj se postupak gotovo uopće ne prevodi, osim ako se ne događa stvarni okvir kadriranja po kadru. Prema zadanim postavkama, bez obzira na alat koji koristite, gotovo sva UI animacija kreirana je pomoću ključnih okvira.

Slijedite kroz i preklapajuće se radnje ima veze sa slijeđenjem zakona fizike i inercije i kako fizička tijela reagiraju, a oba imaju malo veze s korisničkim sučeljima, osim ako ne računate na sljedeći princip, koji je najkorisniji u grupi ,

Uspori i uspori kaže da je objektima potrebno vrijeme da ubrzaju i usporavaju. To je izuzetno relevantno jer 100% UI animacija treba koristiti ovaj princip. Obično ga se naziva "ublažavanje", a izuzetno je važno.

Arc (potreban za reprodukciju fizičkog pokreta) je gotovo neupotrebljiv za UI animaciju, a također je i iznimka nego pravilo.

Sekundarna radnja je korisna i izvrsna za prijelaze na zaslonu i postavljanje vizualne hijerarhije.

Vrijeme je relevantno pri crtanju znakova, ali u korisničkim sučeljima, gdje gibanje treba biti oštro da bi se osjećalo reakcijom, bilo mi je bolje osloniti se na olakšavanje kako bi se osmislio osjećaj interakcije, a ne trajanje.

Pretjerivanje se odnosi na stupanj realizma ili karikature, opet, jedva relevantno za UI animaciju, jer je dizajn unaprijed određen.

Čvrsti crtež je podjednako neugodan jer se UI animacija bavi ponašanjem objekata sučelja tijekom vremena, a ne stvarnim dizajnom samih objekata.

Apel govori i o vizualnom tretmanu, opet nevažnom za ponašanje sučelja tijekom vremena.

U zaključku

Stoga ostaje pitanje: zašto 12 osnovnih načela animacije ne opisuju precizno UI animaciju?

Slom se najbolje može razumjeti jednostavnim promatranjem: animacija UI ne poštuje ista pravila niti imaju iste principe kao organska tijela koja se kreću u fizičkom prostoru. UI animacija je različit medij, različit koliko je i fotografija od slike - s karakteristikama koje se preklapaju (i fotografija i slika statički su vizualni sastavi koji se oslanjaju na svjetlost i kompoziciju), ali u osnovi su različiti mediji.

Jednostavno rečeno, 12 osnovnih načela animacije ne odnosi se na UI animaciju jer rješavaju drugačiji problem.

Tijekom sljedećih nekoliko članaka istražit ću što su ti principi UI animacije, za što se rješavaju problemi sa principima UI animacije, kako se principi razlikuju od tehnika i kako možete dizajnirati i koristiti UI animaciju u svojim trenutnim i budućim projektima kako bi utjecali na upotrebljivost i stvorite uvjerljivije i učinkovitije korisničko iskustvo.