UI design in motion

Motion design has become a huge part of the process behind any product design project. It's impossible to design interfaces without thinking about the different states of the UI. Clicking here will do this and that, the types of transitions and curves. All of these variables are crucial part of the design process. Motion sometimes help visual designers in reducing elements and driving user's attention to an specific part of the UI. Because of the importance of motion I have been paying much more attention to projects that showcase that. Dribbble is a great place to get inspired.

For this post I selected a few examples of motion design applied to UI. They are simple but inspiring. Of course there's also the need of validation, but for now let's just focus on the inspiration.

UI examples

Location Select UI prototype animation motion gif principle googlemaps gradient icon user interface slider directions locationMobile App Prototype ui ux animation prototype interaction app motionIntercom Messenger animations motion web ui messenger design chat appWatch Face in motion concept motion animation green clock time face apple watchDownload Button — animated motion ux ui loading aftereffects sketch principle gif animated animation downloadInput Fields Interaction – FREEBIE suicide squad freebie motion animation interaction input form ux uiSapiegos ux ui motion interactions clean clear green white minimal promo website webNCP animation itsoft ncp motion judical webdesign

Brought to you by