UI animatsiooni põhimõtted: Disney on surnud

Fotograafia jaoks ennustati maali surma (varajane surotüüp)

(Kui soovite saada minu artikleid kasutajaliidese animatsiooni kohta e-posti teel ja saada minu infolehte, klõpsake siin.)

Uus meedium

Kui Paul Delaroche kohtus millalgi 1839. aasta paiku dagerrotüübiga, kuulutas ta kuulsalt: “Alates tänasest on maal surnud!”

Kuni selle ajani oli ainus viis välismaailma visuaalseks dokumenteerimiseks käsitsi pinnale kantud kanduri kasutamine. Sajandeid kestnud käsitööoskus erinevatel erialadel oli avastanud arvukate põhimõtete ja tehnikate leidmise erinevates meediumites. Kultuuride vahel ja ajastute arenedes kujunes visuaalsete kujunduste „väljanägemise” stiil ja visuaalne keel - algsed kujundusmustrid.

Varased fotograafid, üritades oma pilte meenutada tänapäeval populaarseid maalinguid, kasutasid piltide pehmendamiseks ja maalilise ilme loomiseks sageli valgustus- ja trükitehnikate kombinatsiooni. Nende arusaam maalimaailmast oli tihedalt seotud, neid mõjutas ja piiras nende arusaam sellest, milleks fotograafia meedium võimeline oli.

Kulus peaaegu sada aastat, enne kui fotograafid, nagu Ansel Adams, Imogen Cunningham, Edward Weston ja teised grupis f / 64, jõudsid visuaalsesse keelde märkimisväärselt edasi, eristades fotograafiat maalikunstist kui ainulaadsest meediumist - oma visuaalsusega keel ja põhimõtted ning seda tehes pöörasid nad fotograafia valdkonna pöörde.

Edward Weston, Imogen Cunningham, Ansel Adams

Disney lahendas teistsuguse probleemi

Õnneks on meil UI animatsioonis selline revolutsioon.

1981. aastal andsid Ollie Johnston ja Frank Thomas välja filmi Disney animatsioon: elu illusioon ja tutvustasid nn animatsiooni 12 peamist põhimõtet. Need põhimõtted lahendasid orgaaniliste kehade korral realistliku liikumise tekitamise probleemi. liikuda ja reageerida füüsilises ruumis (põhimõtted hõlmavad ka selliseid asju nagu emotsionaalne ajastus ja tegelaskuju).

Kasutajaliidese animatsioon on vaevalt 20-aastane kasutajakogemuse osa ja alles lapsekingades. Kuna kasutajaliidese animatsiooni domeen tekkis, olid 12 animatsiooni põhimõtet ainsad kättesaadavad tööriistad kasutajaliidese õigeaegse käitumise kirjeldamiseks. Sarnaselt sellele, kuidas varased fotograafid üritasid fotograafiast aru saada maalimisreeglite kaudu, üritasid disainerid UI animatsiooni mõista ka Disney animatsiooni reeglite kaudu.

Pinnal on see mõistetav, kuna seal on teatav kattumine. Lihtne liikumine, mis on üks 12 animatsiooni põhimõttest, tugevdab liikumise kaudu „õigsuse” tunnet, mis on kasutajakogemuse jaoks kriitiline. Lihtsustamata on kasutajaliidese animatsioon kohmakas ja imelik.

Täielik jaotus ilmneb siis, kui vaadeldakse lähemalt 12 põhimõtet kasutajaliidese kontekstis.

Squash ja Stretch annavad objektidele kaalu ja paindlikkuse - see on kasutajaliidestes pigem erand kui reegel.

Ennetamine loob tunde, et midagi hakkab juhtuma, ja on ka kasutajakogemuste osas peaaegu kasutu. See töötab valitud mikrointeraktsioonide ja nupuriikide jaoks ainult piiratud viisil.

Lavastus viitab animatsiooni paigutusele, mis on Disney koomiksi jaoks mõttekas, kuna tegelased on pidevalt liikumises, kuid kasutajakogemuse all mõeldakse seda lihtsalt kui kujundust.

Straight Ahead Action ja Pose-Pose on vähem põhimõtteid kui lähenemisviisid tegelikule joonistamis- / animatsiooniprotsessile: pideva kaadri joonistamisel saate luua sujuvama animatsiooni või poseerida mõne võtmekaadri seadistamiseks ja lünkade täitmiseks poseerimise abil . Kasutajakogemuste kohaselt ei saa seda protsessi peaaegu üldse tõlkida, välja arvatud juhul, kui toimub kaadrite kaupa animatsioon. Olenemata kasutatavast tööriistast luuakse vaikimisi peaaegu kogu kasutajaliidese animatsioon võtmekaadrite abil.

Toimingu jälgimine ja kattumine on seotud füüsikaseaduste ja inertsiseaduste järgimisega ning sellega, kuidas füüsilised kehad reageerivad - mõlemal on kasutajaliidestega vähe pistmist, kui mitte arvestada järgmise põhimõttega, mis on rühmas kõige kasulikum .

Slow In ja Slow Out ütleb, et objektid vajavad kiirendamiseks ja aeglustamiseks aega. See on äärmiselt asjakohane, kuna 100% kasutajaliidese animatsioonist peaks selle põhimõtte rakendama. Seda nimetatakse tavaliselt leevendamiseks ja see on äärmiselt oluline.

Kaar (vajalik füüsilise liikumise taasesitamiseks) on kasutajaliidese animatsiooni jaoks peaaegu kasutu ja on ka pigem erand kui reegel.

Teisene toiming on kasulik ja sobib suurepäraselt ekraanisiireteks ja visuaalse hierarhia seadistamiseks.

Ajastus on tähemärkide joonistamisel asjakohane, kuid kasutajaliidestes, kus reageerimine peab liikumiseks olema terav, on minu arvates parem loovutada interaktsiooni tunnet, mitte kestust.

Liialdus on seotud realismi või karikatuuriastmega, mis on UI animatsiooni jaoks vaevalt asjakohane, kuna kujundus on eelnevalt kindlaks määratud.

Tahke joonistamine on samuti enamasti vaieldav, kuna kasutajaliidese animatsioon tegeleb liidesiobjektide käitumisega aja jooksul, mitte aga objektide endi tegeliku kujundusega.

Apellatsioon puudutab ka visuaalset käsitlust, jällegi pole see oluline, kuidas liides aja jooksul käitub.

Kokkuvõtteks

Seega jääb küsimus: miks ei kirjelda animatsiooni 12 põhiprintsiipi täpselt kasutajaliidese animatsiooni?

Jaotust saab kõige paremini mõista lihtsa vaatlusega: kasutajaliidese animatsioon ei järgi samu reegleid ega füüsikalises ruumis liikuvate orgaaniliste kehade põhimõtteid. KÜ animatsioon on eraldiseisev meedium, nii erinev kui fotograafia maalikunstist - kattuvate omadustega (nii fotograafia kui maal on staatilised visuaalsed kompositsioonid, mis toetuvad valgusele ja kompositsioonile), kuid on põhimõtteliselt erinevad keskkonnad.

Lihtsamalt öeldes ei kehti animatsiooni 12 peamist põhimõtet kasutajaliidese animatsiooni puhul, kuna need lahendavad erinevat probleemi.

Järgmise mitme artikli jooksul uurin, millised on need UI animatsiooni põhimõtted, milliseid probleeme UI animatsiooni põhimõtted lahendavad, kuidas põhimõtted erinevad tehnikast ja kuidas saate UI animatsiooni kujundada ja kasutada oma praegustes ja tulevastes projektides, et mõjutada kasutatavust ja luua veelgi köitvamaid ja tõhusamaid kasutajakogemusi.