Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

How can I show the Front-End developer how the animation should be?

Hi guys, I am working with different Front-end developers and some of them are not in the same office, even the same country :) I would like to know: how can I do to show a freelance Front-end developer how the animations should be. I usually solve all the visual problems with Photoshop or illustration but I can't find a perfect tool to show them the animation I want for an element. Any advice or idea?

Pen and paper. Seriously. Flip book animation style.

3 Answers

I use pen and paper to explain the general overview of the project. I will try it too for animations. But sometimes animations are too complex to explain with pen and paper, sometimes the developer need a more visual resource. Dont you think?

I understand what you are saying. So why can't you create the animation then with computer software? What sort of animation is this? Do you need something like Maya to create a complex 3D animation, visual effects for film, etc?

The reason I suggested pen and paper is because you said, " usually solve all the visual problems with Photoshop or illustration but I can't find a perfect tool to show them the animation I want for an element."

If you can describe better what you are trying to achieve I can recommend software solutions.

You right. This is an example: http://tympanus.net/Development/ArticleIntroEffects/ How can I explain the developer to do this kind of animation without showing the link? Imagine you created the animation and you want to explain it to your front-end developer. How would you do that?

Why are you unable to show them that link if that is what you are looking for? I am a tad confused. Anyway. You could describe it like this.

You have two boxes stacked on top of each other, each with different content. When you select a link, you want the second box to slide up in place of the first one and display the contents. Transition definition can be specified once the slider is working.

This could work, I will try it. Thanks!