20 labākie bezmaksas reklāmdevēji UX Motion Designers

Interfeisa dizaineri ir ieinteresēti par UX dizainu, izmantojot animētus maketus, kas emulē lietotāja darbības. Šie UX maketi paļauties uz kustību ar animētiem efektiem kā saskarne reaģē uz lietotāja ievadi.

Lielākā daļa UX dizaineru iemācās izmantot programmatūru, lai izveidotu šīs animācijas. Divas populārākās izvēles ir Adobe After Effects un Princips (tikai OS X). Jūs varat dizaina saskarnes maki programmā, piemēram, Photoshop, un pārvietojiet UI šajās programmās animācijai.

Ja vēlaties uzzināt UX animāciju, tad freebies būs milzīgs aktīvs. Jūs varat izpētīt citu darbu un spēlēt ar savu dizainu, lai redzētu, kā tas viss darbojas.

Zemāk jūs atradīsiet vislabākos pamatprincipus un AE lietotājus iekļūšana UX kustības dizainā. Viņi noteikti palīdzēs jums saprast kā darbojas UX animācija, un kā izveidot savu.

1. Dzēst darbību

Swiping ir ļoti izplatīta darbība mobilajām lietotnēm dažādiem mērķiem. Ir izmantota noklusējuma iOS zvēliens darbība rādīt alternatīvas opciju rediģēšanai / dzēšanai, un tas ir tieši tas, ko jūs saņemat šajā freebie, ko radījis Ramil Derogongun.

Jūs varat lejupielādēt bezmaksas AEP failu After Effects un izmēģināt to pats. UI seko a ļoti vienkārša stiepļu karkasa shēma ar lietotāja ievadi tiek parādīts zils punkts. Šie lietotāja uzvedības veidi ir vislabāk redzami izmantojot animāciju jo tas dod izstrādātājiem iespēju redzēt kā saskarnei jādarbojas.

2. Widget Swipe

Šeit ir vēl viens novirzīts animēts makets, kas koncentrējas slaidrādes grozā. Izstrādāts Leon Wu, šī bezmaksas swipe animācija nāk ar PRD failu, kas ir sagatavots principam.

Animācija ir ārkārtīgi vienkārša un parāda, kā vienumiem vajadzētu pārvietoties ekrānā piemērojot spiedienu. Jūs arī jutīsieties par atvieglošanu kad tiek izlaists zvēliens.

3. Dualshock UI

Šeit ir neticami dinamisks UX animācijas efekts, ko dala Aleksandrs Boyčenko. Šis makets ir balstīts uz PlayStation Controller mobilo lietotņu lietotāja interfeisam. Tas ietver skices un principa failu, kuru var lejupielādēt bez maksas.

Šis freebie parāda, kā izveidot pārejas velciet starp ekrāniem. Bet jūs varat arī redzēt, kā lapas elementi tiek aktivizēti ap ekrānu dažādos virzienos.

4. Hamburger Menu Animācija

Hamburger ikonas joprojām ir visas dusmas mobilajās saskarnēs. Šī izvēlnes ikona freebie parāda, kā animēt trīs joslu ikonu "X" ikonā.

Tas ir atkārtota animācija, tāpēc "X" arī atdzīvojas hamburgeru izvēlnes ikonā. Šī ir lieliska freebie, lai uzzinātu vektora manipulācija UI elementiem.

5. Snapster

Šis bezmaksas makets ir paredzēts mobilajai lietotnei Snapster. Tā koncentrējas uz uz ekrāna kur lietotāji var redzēt lietotnes demonstrācijas un uzzināt, kā tas faktiski darbojas.

Tas ir PRD fails, un diemžēl tas nav patīkams ar After Effects, tāpēc tikai šis princips var gūt labumu no šī.

6. Spinneru ielāde

Šeit ir AEP After Effects freebie par mobilie iekraušanas spinneri. Šie animētie GIF veidi kļuva ļoti populāri, kad Ajax devās ceļā uz galveno interneta attīstību.

Tagad šie mobilie iekrāvēji ir desmiti, un tie pat var būt ļoti pielāgota lai atbilstu noteiktām saskarnēm. Šis freebie nāk ar AEP failu un Sketch failu, lai rediģētu vektorus, ja vēlaties tos modificēt.

7. Atskaņot / pārtraukt pāreju

Pārejas efekti bieži vien šķiet ļoti vienkārši, bet faktiski prasa labu darba apjomu. Šis Alex Pronsky radītais atskaņošanas / pauzes animācija ir lielisks piemērs.

Ar šo freebie jūs varat pārbaudīt, kā animēt dažādas plānas līnijas ikonas formās un simbolos. Kad esat iemācījušies programmu, tas ir daudz vieglāk izdarīt šāda veida stuff, tāpēc tas palīdz jums izmantot freebies pētniecībai..

8. iPhone makets

Lai gan šis freebie tieši nesatur animāciju, tas ir domāts, lai to izmantotu iPhone darbiem. Tas ir bezmaksas iPhone 5S AEP fails lietošanai After Effects kā iPhone veidne.

Vienkārši importējiet interfeisa maketu un izveidojiet animācijas After Effects. Tad jūs varat to pievienot šim iPhone maketam, lai dalītos ar savu komandu.

9. iPhone veidne

Tas ir vēl viens Custom After Effects veidne ar modernāks iPhone dizains. Freebie ir pieejama no šīs lapas UX in Motion.

Viss veidnē ir super viegli pielāgot. Lejupielādes lapā jūs atradīsiet arī sadaļu ar nosaukumu "Video instrukcijas", kur jūs varat uzzināt, kā aktivizēt lietotni.

10. Mikro animācija

Pat mazākās lietotņu animācijas var ievērojami ietekmēt lietotāja pieredzi. Šis freebie rāda a "Like" mikro animācija kad lietotājs "patīk" ziņu.

Sirds ikona ir sava animācija ar lietotāja profila fotoattēlu, kas pievienots piezīmju kaudzei. Šis freebie ir tikai princips, un jums ir arī .mov failu, kuru vēlaties lejupielādēt, ja vēlaties.

11. Seifa lietojumprogramma

Digitālās maki ir kļuvušas daudz populārākas, un šī freebie atvieglo tā izstrādi. Jūs saņemsiet skices failu ar visiem neapstrādātajiem vektora elementiem, kā arī bezmaksas PRD failu principa animācijai.

Šo freebie ir izstrādājis Sergejs Bykovs kā jautrs mazliet blakus projekts. Bet tas var būt ļoti izglītojošs, ja jūs to atdalīsiet, un strādājiet ar animāciju soli pa solim.

12. iOS slēdzis

Izmantojot Apple iOS 7, pasaule ieguva svaigi izstrādātu slēdzi uz / off uzlīmēm. Tas noveda pie daudziem dažādiem efektiem, ieskaitot bezmaksas animāciju atdarina vietējo ieslēgšanas / izslēgšanas slēdzi.

Šajā failā jūs iegūstat ļoti vienkāršu animācijas efektu ar pamata atvieglojumu. Slēdzis pārslēdzas, un fons kļūst zaļš, pēc tam tiek atgriezts atpakaļ, kad slēdzis ir izslēgts.

13. Ritter App

Šeit ir vēl viens lielisks freebie, ko izlaidusi Sergejs Bykovs par to, ko viņš sauc par Ritter App. Tas ietver bezmaksas skices failu vektora interfeisam, kā arī bezmaksas PRD failu principa animācijai.

Jūs saņemsiet daudz dažādu animāciju šajā freebie, tāpēc es domāju, ka tas būtu lietderīgāk vidēja līdz progresīvam dizainers. Iesācēji var arī daudz ko mācīties no tā, taču viņiem var būt strauja mācīšanās līkne.

14. Uzaicināt draugus

Mēs visi zinām un mīlam Google plus ikonas lidojuma izvēlni. Nu, Jardson Almeida izveidoja draugu ielūguma izvēlni, pamatojoties uz vienkāršu materiālu dizaina koncepciju.

Viss tika izstrādāts skicē un importēts uz animācijas principu. Jūs saņemsiet abus failus kā bezmaksas lejupielādējamus failus un rotaļlietas.

15. Kartes novilkšana

Lūk, vēl viens vispārējs svārstīgs freebie, kas tiek izmantots tikai principiem. Tas ir kartes zvēliens interfeiss izveidotas vispārējas nozīmes slaidrādēm vai vietējām lietotņu UI.

Es domāju, ka tas ir ideāls freebie iesācējam, kurš vienkārši nokļūst Principā. Tas nav tik sarežģīti, ka jūs jūtaties zaudēti, taču tas nav tik vienkārši, ka jūs jūtaties trivializēti.

16. Tērzējiet kartē

Daudzi dizaineri joprojām izmanto Photoshop saskarnēm, un tas attiecas arī uz šo tērzēšanas brīvroku karti. Varat lejupielādēt PSD failu interfeisam un PRD failu pamatprincipu animācijai.

Tas ir pārsteidzoši pieradināts stila animācija, taču tas joprojām izskatās lieliski un darbojas tieši tā, kā jūs gaidījāt vienkāršās kartēs / ģeogrāfiskās atrašanās vietas noteikšanas lietotnē.

17. Lietojumprogrammu ielāde

Mobilās lietotnes bieži izmanto ekrānu ielāde pastāstīt apmeklētājiem, ka kaut kas notiek aizmugurē. Viens no maniem iecienītākajiem freebies šajā kolekcijā ir Roman Wagner radītā iekraušanas animācija.

Tas ielādē atsevišķus elementus viens pēc otra kad iekraušanas ekrāns ir pabeigts. Šī animācija ir ļoti gluda un pilnīgi uzticama mobilo lietotņu dizaina jomā.

18. Onboarding kartes

Lietotājs onboarding ir būtisks solis katrai jaunajai mobilajai lietojumprogrammai. Šajā posmā vienmēr ir patīkami iekļaut dažas animācijas, tāpēc šīs onboarding animācijas var būt ļoti noderīgas lietotņu dizaineriem.

To izveidoja Austin Baird, un to atbrīvoja bez maksas, lai to izmantotu jebkurā UI / UX projektā.

19. Principi Demos

Turpinot iejusties principā, jūs uzzināsiet daudz uzlabotas darbplūsmas metodes. Viens no labākajiem bezmaksas braucieniem ir tas, kas radīts Yalantis radošajai komandai.

Tas ir pilnīgi bezmaksas resurss, lai Principi lietotāji varētu lejupielādēt un atskaņot. Tā aptver dažus trikus, kas parāda, kā kļūt par pro principā animāciju.

20. Nolaižamās izvēlnes

Izvēlnes nolaižamajā izvēlnē bieži tiek izmantotas traks animācijas, lai iegūtu mūsu uzmanību. Šī After Effects freebie izmanto a nolaižamo kāpņu animācija atsevišķu elementu izvēlnē, lai tos varētu nomest kā kāpnes.

Tas var nebūt noderīgs ikvienam, bet tas noteikti ir lielisks veids, kā uzzināt par After Effects interfeisa animāciju.

Galīgie vārdi

Visi šie resursi ir pilnīgi brīvi lejupielādējami un rotaļlietas savos projektos. Ja jūs esat pilnīgi jauns ar UX animāciju, es garantēju, ka jūs daudz ko iemācīsieties, pētot šos freebies. Ja jūs zināt citus lieliskus resursus, nekautrējieties atsaukt saites komentāros.