September 30, 2016

Let’s Talk About:

Guiding with Motion Design

The roles and responsibilities of a designer have grown over the last several years thanks to an incredible array of tools, online mentorship/teaching opportunities, and technology improvements. More than ever, interactive experiences are brought to life through motion design, and it’s expected that our work reflects design thinking outside of static comps. 

Motion is an excellent tool for guiding a user, conveying a feeling or mood, and adding polish to a final product. In our work with Dick’s Sporting Goods and The North Face last winter, we brought a mountain alive through an interactive map that unfolds into a unique shopping experience. Check the site out for yourself, as well as the following list of tools, resources, and inspiration for your motion design needs!

DSG Outerwear

Community Thoughts on Guiding with Motion Design...

  1. 1. Tumult Hype 3.5 For quick motion brainstorms and ideas, our design and UX teams turn to Tumult Hype. It’s easy to use, timeline based motion toolset let’s us quickly show our clients a more lively vision for our interactions.
  2. 2. Animation Bootcamp Our own designer extraordinaire Minh Tran just finished up this 6 week course recently. We’ve been wowed by the projects he’s been pumping out through on this intense, highly educational program.
  3. 3. Mt. Mograph Mt. Mograph offers a huge array of After Effect tutorials and examples for designers to learn from. Additionally, Mt. Mograph has created some huge resources like his “Motion 2” library, which is packed with pre-scripted tools to allow you to create more and click less.
  4. 4. GreenSock GreenSock is an animation platform consisting of a set of small javascript files that helps you create great looking interactions and effects that work in all browsers.
  5. 5. Creative SVG Letter Animations For designers, the near limitless access to all kinds of type provided by services like typekit opened up a slew of creative doors on the web when it came to web typography. Now we have the tools to step it up another level, leveraging SVG animations.

Related Articles

Washington DC Metro
105 West Broad Street
4th Floor
Falls Church, VA 22046

Durham, NC
309 E. Chapel Hill Street
4th Floor
Durham, NC 27701

Boulder, CO
1915 Broadway
Boulder, CO 80302