Questions tagged [animation]
movement of elements on a screen that can help solidify their relationship, create a visual appeal or rearrange/remove controls or information presented visually
136 questions
3
votes
5
answers
307
views
Is there any underlying rule/paradigm for UI that prefers LACK of animation, as in a game?
There are plenty of questions/answers discussing when/where to optionally include animation in an app. Now it comes to the point, there is almost ubiquitous animation all over media. Even a few ...
- 370
3
votes
2
answers
2k
views
Clockwise or counter-clockwise loading animation
Is there any rule for using CW or CCW loading animation?
Does CCW animation means "slow" or "rollback" or something? Or maybe CW direction means going forward, straight direction etc?
UPDATE: due ...
- 133
1
vote
2
answers
294
views
How fast should a user-initiated horizontal scroll be?
I have a bunch of athletes that have their faces linking to their bios. On desktop computers where users don't have the ability to touch-swipe, arrows take over the job.
Click here for a working demo
...
- 360
5
votes
3
answers
381
views
Is perpetually animating a button an acceptable method for indicating that it has been activated?
I work alongside a client and another designer. We currently have menus that open via button taps. After tapping the buttons, the client and other designer have decided that said buttons should ...
- 51
2
votes
2
answers
414
views
Floating animated message vs. confirmation message. When to use each?
Some pre-clarifications:
By floating animated messages I mean the Firefox style messages usually appearing bottom right of the window, for example, when a file downloaded successfully.
By ...
- 1,552
2
votes
1
answer
604
views
With respect to creating circles, what are the pros and cons of the following methods? [closed]
I am making a website in which the home page will have 5 circles each linking to a category of items (e.g. cities, phones, etc.). The user will click on circle to go to the specific page for that item....
- 21
0
votes
1
answer
151
views
Use of animation in a projector presentation [closed]
Q: Is it a good idea to embed GIF or other animation into a Powerpoint presentation?
I am working on a 50 minutes technical presentation and trying insert some "breaks" after each 10-15 minutes. The ...
- 103
19
votes
10
answers
12k
views
Why are spinning animations typically used for loading sequences?
This question is asking about why spinning animations tend to used as "conventional" indefinite loading animations - it is not asking why a particular software/app/OS uses a spinner.
Also the ...
- 495
0
votes
1
answer
370
views
Help! 'Saving' animation for edits that are saved on change (without clicking a save button) [duplicate]
I can't think of great examples on the net (comparisons to draw, that is). You've seen the feature before though. You are making an edit to something--say, a setting. And when you make the change, ...
- 353
5
votes
4
answers
338
views
Will animated feedback be annoying or nice?
I'm developing a website called Fablelane which allows you to write your own stories and have others contribute outcomes or "chunks" to that story.
Right now (if you go to the website), there's an ...
14
votes
6
answers
4k
views
If you can't improve loading time, is distracting the user a good technique?
On several implementations I've worked with, loading times can be as high as four seconds for the start page. When all reasonable options are done, is it possible to distract the user to make the ...
- 55.2k
1
vote
3
answers
302
views
loading new view from which direction ? L2R or R2L?
I've been developing mobile apps using sencha touch for quite a time now. In that, whenever a new view is to be loaded, default animation direction is from Right-to-Left. This can be seen in android ...
- 113
15
votes
6
answers
1k
views
Why are nested elements scrolled to the opposite direction?
My question is about scrolling conventions, and spatial scroll conventions in general (even here it's only horizontal, but same applies for vertical scrolling).
Looking at the below mockup, why is it ...
- 7,674
3
votes
4
answers
3k
views
Expandable Card Interaction
I'm trying to create a card with some text/images inside, which can expand down and expose more content if a user clicks on the expand button (a huge down arrow).
The natural way to do this obviously ...
- 31
1
vote
3
answers
340
views
Does animating statistical data make it easier to understand?
I'm looking at this presentation at Ted.com, and it uses impressive animated statistics:
Hans Rosling: Stats that reshape your worldview
Does using animated data make understanding statistical data ...
- 1,627
14
votes
4
answers
24k
views
How fast should a banner rotate on a website?
Are there any studies or published de-facto standards on how fast the slides of a carousel should change on the homepage of a website?
Here are some examples of sites that incorporate carousels at ...
- 503
6
votes
3
answers
2k
views
Guidelines/best practices for CSS hover animations in web UI
What, if any, are the accepted guidelines and/or best practices for using CSS animated transitions on hover in a web-based user interface? When does it start to simply become annoying and distracting?...
- 391
4
votes
5
answers
1k
views
What is this failed login visual shake feedback properly called? Is it beneficial?
Wordpress, Coursera and others have the "shake fail" feedback (see Coursera gif below).
Is there a name for this type of mimicry of a physical action (head shaking "no")?
Is there any evidence of ...
- 6,314
8
votes
3
answers
2k
views
Does a "faster" loading indicator make website/software seem faster?
While checking how a site works on Internet Explorer, I noticed that the page loading indicator spins a lot faster than in other browsers. Also, the iPhone uses a noticeably slower activity indicator ...
- 437
1
vote
2
answers
721
views
Tool for work between UI/UX Designers and developers to show animations [duplicate]
Possible Duplicate:
How can animations be depicted in wireframes effectively?
Are there any standard tools for work between designers and developers, especially for designer to explain flow and ...
- 27
5
votes
4
answers
501
views
What's this called and how does it fare from a UI perspective?
The Facts About Coventry website has a flash plugin app for navigation of data (bottom half of the page). It's a big circle where you can hover over the icons to get a description of the category and ...
- 153
5
votes
2
answers
626
views
Creating a transition pattern library
I am looking to compile and apply a list of transitions/animations across a web application.
Does anyone have any good examples of any existing transition pattern libraries out there?
I know the ...
- 2,184
301
votes
6
answers
30k
views
Why do progress bars animate backwards?
Gmail's new loading bar drew my attention to this today:
The colored pattern inside the bar animates from right to left.
The Mac OS progress bars do the same:
Is there a reason for this? If I was ...
- 6,264
5
votes
3
answers
2k
views
Should animations pause on mouseover?
Should animations pause on mouseover? I have my opinion, but I was wondering if there was any evidence to support/refute the idea that users expect this to happen.
EDIT: I'm specifically concerned ...
- 714
4
votes
3
answers
1k
views
What software is used to create GUI concept videos?
If I was to create a prototype or video of a GUI concept with animations, what software is best suited for that? The focus would be applications for mobile devices or screens integrated in homes, cars ...
- 141
12
votes
11
answers
5k
views
How can animations be depicted in wireframes effectively?
I came across a question on Quora about jQuery animations in wireframes, which got me thinking about the general conventions in depicting any animation in static wireframes. I've been using either ...
- 13.3k
16
votes
6
answers
7k
views
Blinking, bouncing and flashing elements
I'm responsible for the UI/UX in a software development company.
During my absence, some developers decided to implement a "bounce" effect on a button of a website that they think should have more ...
- 697
3
votes
2
answers
221
views
Animation on Handheld: How Much is Too Much?
In web applications in the 1990s, it was pretty common to see animation (animated gifs, marquees, etc.) -- since then, the industry has pretty much established this as a no-no for (professional) ...
- 519
2
votes
8
answers
581
views
Deliverables: Animated Movies - what to do when a clickable wireframe is not enough?
Since I started working for a think tank I am often confronted with the problem that my standard set of deliverables are not sufficient to describe a vision. I often need to highlight the context ...
- 221
4
votes
2
answers
948
views
When is it appropriate to use fading animated messages for feedback and notification.
To clarify: these are messages (text or symbols) that appear right at the point of interaction, and then float away and fade out.
You see this kind of animation when adding people to your Circle in ...
- 71.3k
14
votes
6
answers
3k
views
What is more pleasing to the eye fade in or suddently appear
I have a pop up menu. What is said to be easier on the users' eyes? Should I just have it appear immediately using visibility = true or should I have it fade in using opacity animation?
- 243
1
vote
1
answer
361
views
Best way to switch between views with different navbars
On the iPhone, when a set of views have different colored and textured navigation bars, what is the best way to animate in the new view when the user taps on a tabbar icon?
Should the new fade in ...
- 113
6
votes
4
answers
204
views
How should cancelled animations behave?
How should an animation behave when it is cancelled/changed?
For example, let's say I have a button in my application that triggers the visibility of a tool panel. When the panel is shown, an ...
- 915
7
votes
1
answer
455
views
How to define interactions and animations in an extensible way?
The whole question, summarised for answerability:
How would it be best for a designer to define really complex UIs?
Would it be a good approach to map how the mental creative process works, into ...
- 656
3
votes
1
answer
607
views
What examples are there of animated toolbar icons? [closed]
Are there applications (including web applications) that have animated toobar icons? I would imagine they would only animate on hover/mouse over, but I'd be interested to show someone this so we can ...
- 1,005
12
votes
9
answers
5k
views
How and when should you use animation in your application?
Sometimes applications can benefit from animations in the UI.
What tips do you have for determining when you should use animation?
How can you maximize the usefulness of animations and avoid misuse?...