Animate the element and the user will take notice and
draw a direct correlation between the cause and the effect.
129
C H A P T E R 6
Figure 6-1. The loading indicator in Google Calendar
Animations can add to the experience in other ways, too:
??? Drop-down menus that fade or slide aren??™t as jarring to the user as a sudden on/off
switch, especially as the user slides over multiple navigation items.
??? Links to named anchors (links that start with the number sign: #) can cause the
browser to glide to the anchor instead of instantly displaying the section. For links
to places elsewhere on the same page, users understand that they haven??™t been
sent to another page; they are just in another location on the same page.
??? In a drag and drop, animating the dragged item back to its original location when the
user lets go of it can make clear to the user that the drop didn??™t happen.
It is prudent not to overdo animations, of course. In particular, it??™s important to keep animations
short and snappy. Taking too long to complete an animation means that users are left
waiting for the animation to complete before proceeding with the task they want to accomplish.
Although most animations should probably be no more than half a second long,
interact with what you??™re building and ensure that it feels snappy without going crazy.
Yahoo! has a Design Pattern Library that discusses various patterns and their uses in
depth.
Pages:
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199