Posted
December 14th, 2007 by Ktu
Since I was old enough to realize I was looking at a flash application rather than pure html I have noticed an obnoxious flaw in so many websites and applications.
Most animations are simply TOO LONG. They are long, and slow, and boring, and excessive. Tone it down. If there is one thing I have found, its that I hate waiting for stupid animations to finish so I can do something else.
Don’t get me wrong I am not bashing animations. I am simply bashing animations that are simply too long or too extravagant for their purpose. Every animation can be broken down to having a purpose. Figure out the purpose of your animation and apply accordingly.
l
l
l
My Acronym: KISS ASS (Keep It Short, Sweet And Simple Stupid)
Despite your longing to create snazy, jazzed up, star gazing, craptastic animations, you ultimately must kiss ass to the users.
- For most animations, keeping it less than 1 second really helps. In one second you can find enough frames to make your animation smooth enough, and still get your point across.
l
- If you have an animation heavy interface; That’s ok! But try making your animations shorter still, like around the .5 second mark.
l
- When creating your animations, try not to lie to the user. Bounce effects, Curving, Elastic effects, etc… (unless that is the goal) can, and will be very frustrating. WAIT, I thought you were going to end up over there! Why did you go backwards! WHY DO YOU TOY WITH ME!!!
l
- If an object is going to slide off the stage and disappear, and your flash embed is not full page, try adding a mask with a gradient edge or a gradient edge on the entire document that goes to alpha = 0. This will stop your objects from simply cutting off at a line and disappearing. It will give it a more natural feel especially if your flash is not the full size of the browser they are in.
l
- If you are going to use shape tweens that morph please please please make sure that none of your points cross over in weird ways. I don't want to see corners flipping over each other to replace another corner that should have stayed where it was. If you must use a morphing tween, use the Shape Hints. They are great tools to help your morphing animations look more natural and smooth. If that still doesn't do the trick, try breaking the animation up into multiple tweens to get the desired look.
l
- A great tool for more complex flash projects is Caurina's Tweener class. I'm sure a lot of you have seen it or used it. This Tweener class allows you to create time or frame based animations that is very flexible by using actionscript. If you have have been having issues trying to manage your animations within a project, try taking a dabble in this class. The documentation is clear enough to understand and can help you create amazing sites with a lot less mess of 'what part of the timeline should I go to?'
Yet even with all of these restrictions, your users have come to your site for a reason, and you should ALWAYS try to provide an experience that the user will enjoy. Try applying the few tips above and keep in mind that animations can MAKE or BREAK a site.
Don't forget there are times when extravagant and sweet animations can be acceptable and awesome, just make sure its the right time to use it.
I love suggestions and input.
Ktu
分享到:
相关推荐
On the web, the way you think about animations is different. The way you create them is also different...really different. The challenges that you once painfully overcame in older technologies like ...
常用动画效果 Animations 常用写法主要是两种 见代码
James Cabello Animations.7z删
SVG Animations.pdf SVG Animations.pdf SVG Animations.pdf SVG Animations.pdf SVG Animations.pdf SVG Animations.pdf
animations
Creating Web Animations 英文epub 本资源转载自网络,如有侵权,请联系上传者或csdn删除 本资源转载自网络,如有侵权,请联系上传者或csdn删除
14个3d箭头样式与动画,非常好~可以自己修改使用,14+Arrow+Animations+1.0.unitypackage
Animations.scml
Mega Animations Pack.unitypackage Mega Animations Pack.unitypackage Mega Animations Pack.unitypackage
Learn Adobe Animate CC for Multiplatform Animations 2nd Edition pdf Knowing the industry-standard animation and interactivity tool Adobe Animate CC can help you get a foothold in the exciting web ...
Animations 动画展示 轮播广告优化 常用动画界面展示 基层代码
View Animations 2. Auto Layout 3. Layer Animations 4. View Controller Transition Animations 5. Animations with UIViewPropertyAnimator 6. 3D Animations 7. Further Types of Animations
Creating Web Animations_ Bringi - Kirupa Chinnathambi
Magic CSS3 Animations 是 CSS3 动画的包,伴有特殊的效果,用户可以自由的在 web 项目中使用。Magic CSS3 Animations 结构非常简单,包括 CSS 样式:magic.css 或者是 mynified 版本:magic.min.css。 ...
iOS Animations by Tutorials v4.0 iOS Animations by Tutorials v4.0
Crowd Animations is an extension for GPU Instancer, and requires it to work. Support Forum | Documentation | F.A.Q. Crowd Animations is an out of the box solution for using massive amounts of ...
iOS Animations 动画 swift ios10
iOS Animations by Tutorials v4.0 iOS Animations by Tutorials v4.0