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
0
votes
0
answers
60
views
Use of animation on mobile intro screens
I am working on a mobile app for a client and have used static placeholder images in the first three intro screens, the usual UX pattern from my point of view.
The client has hired an animator who has ...
- 1
1
vote
1
answer
51
views
Designing a Queue with Flashing Animation for New Queue Numbers. How long should the flashes be?
I'm designing a Queue display for a typical service counters which shows a bunch of queue numbers.
There are approximately 8 counters
Queue numbers need not be displayed in sequence
There will be ...
- 461
0
votes
2
answers
63
views
I woud like to know what type of effect has been used in the UI design of the website? [closed]
What type of effect has been used in the home page of this website as the image moves with the cursor .
https://www.niarratravel.com/
1
vote
1
answer
653
views
Flipping word animation effect
I sometimes sees some effects on websites that allows you to flip the text, for instance
We are a word company.
Where word would flip around a few adjectives like dynamics or smth like that.
Can ...
- 113
1
vote
2
answers
167
views
How to do loading animations when at certain times the application is too fast for them?
I am facing a strange "catch-22" like problem, while developing an application for a mobile browser. My problem is that, some inner-app screens are fetching data from a back-end server, and ...
- 141
4
votes
2
answers
2k
views
Mobile ui design - Scrolling effect to hide navbar and show it on scroll up
I am looking for examples of the effect used mostly in mobile design, where by scrolling down the navbar hides from view, and by scrolling up again it returns in view.
Does this effect have a specific ...
- 537
0
votes
1
answer
119
views
Removing an item from Favorites
I'm building an application with 2 pages: Favorites and Browse.
I have an Add to Favorites button (a star icon that fills or unfills when the user clicks on it).
When a user clicks to remove an item ...
1
vote
1
answer
93
views
What's the name of the header shrinking animation in Samsung's One UI
I'm curious about the name of this behavior, I remember reading it in a design blog a few months ago but completely forgot about it, algo OnePlus implemented something similar in OxygenOS 11 and ...
- 11
1
vote
1
answer
533
views
Nested sidebar behavior
I have a nested sidebar that goes 3 levels deep. I would like the interaction to slide left/right:
So in this example, if you click on "Jobs" in (1), (2) would then slide in. My question is,...
- 1,414
3
votes
1
answer
395
views
Should we animate tab switching?
I opened up a feature request for Windows Terminal to talk about adding some form of animation when doing tab switching between fields. The most common pattern is to make the transition instant.
...
2
votes
2
answers
108
views
Is it a good choice to use a more complex animation for loadings?
Currently for a loading animation I use an animated gif (imagine like a wave rotating on itself, which is inherent to theme of the app), instead of a classical loading animation. The thing is that I ...
- 41
0
votes
1
answer
50
views
What is the keyword for this effect: an animated person walks out from the bottom right corner of a website?
What is the keyword for this effect: an animated person walks out from the bottom right corner of a website? Better yet, any link to any provider that still exists today?
Anybody know this may feel ...
- 265
0
votes
1
answer
398
views
What is the best ease curve and speed for color transitions?
I am creating a desktop app, and I'm currently implementing animations.
I understand from Material Design Guidelines that I should set the speed for transitions for desktop apps at about 100-250 ms to ...
- 101
3
votes
1
answer
200
views
Gesture driven interfaces and hint animations - good or bad?
Many times I saw statements that "Interface/design you need to explain is a bad design". I do agree with it (e.g. if you have nav bar then having labels under/next to icons is beneficial), ...
- 31
18
votes
2
answers
6k
views
YouTube Premiere countdown animation
YouTube has a feature called Premiere that allows creators to publish videos so that they are premiered live, at a particular time, to all viewers.
At the beginning of each premiere is a 2 minute ...
- 299
1
vote
2
answers
2k
views
Why are websites so poor in terms of transition & animation compared to native apps?
It's 2020 and web standards allow for really powerfull animations. Compatibility is barely an issue since most browsers are evergreen and most devices are powerfull enough. On top of that, it's easy ...
- 113
3
votes
3
answers
249
views
What should happen when deleting a table?
Let's say we have a table with 10-50 rows, and 3 column each.
Below the table we have a button like empty table, which removes all the rows from it.
After the click happens, what do you think should ...
- 195
0
votes
1
answer
342
views
Too many loading indicator on a single web page
I was assigned to design a web page, which has a lot of control buttons. Each button requires an activity indicator, to tell the user that the corresponding action is in process. There are some ...
- 31
1
vote
1
answer
108
views
Need help for finding a user-friendly item queue component layout and presentation
I'm looking for alternate layout/UX ideas for presenting an item queue component.
The data and behavior I'm to present is a linear queue, a stack of items -- digits, letters, small images. A ...
- 113
3
votes
1
answer
358
views
Animation and gamification
I'm trying to add a few animations to my application targeted towards teens, specifically animations that increase user engagement.
Similar to how twitter introduced the heart animation.. it's ...
- 327
1
vote
1
answer
74
views
Validation of a text file: how to best show the inline editor?
I'm making an app that validates a text file and then shows the errors associated with it. Currently all errors are listed as rows.
I'd like to make it easy to correct the errors in the text file so ...
- 149
2
votes
4
answers
2k
views
Should the sun rise from left or right side?
I'm making a widget for a strategy game that displays the sun in its background and you can see it rising, moving across the widget and setting as time passes.
The sun rises from the east, on the ...
- 123
0
votes
1
answer
95
views
Micro Transition for selection
I'm using a dropdown select in my design. The user makes a selection, and the content below changes. The problem is the content below is very similar and isn't obvious that it has changed. I was ...
2
votes
1
answer
83
views
How long should I wait before animating the navigation bar in/out when the user scrolls?
I'm currently working on a new design for a site and I've encountered a problem I've never found before.
I want to collapse the navigation bar up when the user scrolls down to increase available real ...
- 21
3
votes
2
answers
898
views
How to handoff animation for iOS developers? [closed]
I'm a designer and interested in different ways I can handoff animation to iOS developers and the best ways to do that depending on a particular case.
1. JSON
I know Lottie works best for animating ...
- 953
1
vote
4
answers
165
views
Progress indicator position in iOS [closed]
Having a little bit of struggle while designing a iOS app. What do you think is the right position for progress indicator - right or left side of text?
Checking for updates...
or
Checking for ...
- 41
2
votes
1
answer
688
views
Pulsing to grab attention
I want to know what you guys think about a pulsing animation to grab attention to know about the advantages to login.
The idea is having a circle pulsing and when the user makes hover it shows a ...
- 579
2
votes
1
answer
85
views
Use top-looking arrow when navigate between screens [closed]
When I was designing something in Adobe XD I thought about an icon which will display in search bar to go backwards in app. My activity uses slide up to open another activity with search bar. Let me ...
- 25
1
vote
2
answers
67
views
how frequently should numbers refresh on an exercise machine?
I'm building an application that runs on a tablet connected to an exercise machine (a rowing machine)> The tablet is running a video of the instructor, and overlaying the video is the performance of ...
- 203
4
votes
4
answers
602
views
What's the purpose of a "Pause Animation" button on a loading animation?
Many of the loading spinners on Chase bank's rewards portal have a "Pause Animation" button below them. Is there a reason to include this below animations?
- 41
1
vote
1
answer
174
views
Displaying acronyms
I'm working on a website for a student society. The society has been established for a good number of years now, and in its humble beginnings it was known by an acronym. For the purpose of this ...
- 35
6
votes
3
answers
1k
views
How long should a loading spinner take to do one rotation?
Whilst I'd always prefer an estimated time, I get that's not always possible, so we fall back to the tried and personally hated, loading spinner.
I've always thought that having it do one iteration ...
- 163
1
vote
1
answer
423
views
Microinteraction and transition are same?
During my last presentation on transition/animation, it was asked that "are microinteraction and transition same?"
I said no but could not back my answer.
Could someone please explain.
1
vote
1
answer
971
views
Best method of showcasing UI interaction / animations for case studies or portfolios?
I'm building a site full of case studies and I want the ability to show UI animations of how the user interacts with the interface. My app is a browser based app.
Some simple things I'd like to show:
...
- 33
1
vote
1
answer
280
views
What is a good duration time for UI animations?
To minimize initial cognitive load, we plan to hide dependent fields within our software by adding animation to show / hide them when called.
I have been looking for articles on duration timing on ...
- 543
0
votes
1
answer
86
views
Should additional animations be shown *after* the first app-app transition?
On a new iOS device, when I try to open a special URL (app URL, universal link, or phone number), iOS will ask me if I want to "Open in X app"
When this occurs, a visual animation occurs that ...
- 1,028
3
votes
3
answers
406
views
MockUps - Prototyping UI using After Effects. Is it worth it? [closed]
I am a visual Designer and currently work as a UI_UX designer at the company I work for. I wanted to ask my colleagues here and front-end Devs as well your opinion about presenting After Effects ...
0
votes
1
answer
92
views
How are hero animations done? [closed]
An example could be seen on Valueact website. I need some direction as to how this is implemented.
4
votes
2
answers
405
views
Best practice for prototyping and making motion animations for iOS and android [closed]
I am currently working on redesign on for both android and iOS. I wanted to use small animations and feel confident that I can prototype them using principle, flinto or after effects. However how can ...
- 431
2
votes
1
answer
491
views
What are main disadvantages of decorative animation and when it is a good use and when it is not?
What are main disadvantages of user interface animation and, in particular, of decorative animation, and how to keep a balance in the UI?
As introduction, I think the animations are an useful tool ...
- 4,521
2
votes
1
answer
140
views
Card-swipe based interface for macOS: Human Interface Guidelines
I was looking towards creating an app for solving an issue I've had with quickly sorting files. The interface would be similar to Tinder's but for files (images, system files etcetera).
Reading ...
- 21
1
vote
1
answer
84
views
Can using animation positively lengthen the user journey
When users use an app or a website, different levels of effort and cognitive load are needed at each point of the user journey.
While various negative factors cause bad UX can potentially shorten a ...
- 10.8k
0
votes
1
answer
294
views
How fast is too fast? [closed]
Users like apps to be fast. Many apps use animations to "smooth" the experience. If an animations are too slow, the app feels...well, slow. But if the animations are too fast, they may be so fast that ...
- 831
4
votes
2
answers
922
views
Element transition between tabs
I'm building an app that in one of its screens has 2 tabs.
In each tab there is a list of elements (cards), and i'm wondering :
What type of transition between tabs should i use?
Is there a ...
- 1,201
4
votes
2
answers
259
views
What’s the point of the fadeUp animations on website landing pages?
Recently, I’ve been noticing a lot of website homepage’s using fadeUp animations on the page content.
Spotify’s homepage is a good example.
I’m curious to know why they do this.
To me, it seems ...
- 43
95
votes
7
answers
18k
views
Why are animations out often neglected, even from Google?
Animation-In are fine BUT no animation when something disappears. IS THIS GOOD?
From Google images
From Toptal
https://www.toptal.com/designers/ux/interview-questions
From Designation
http://...
- 3,748
0
votes
2
answers
2k
views
Is there a name for this loading animation?
I can notice this animation looks like an default pattern, because I've seen it at so many apps and websites.
I would like to know what's the name of it but I can't find any results.
- 161
10
votes
5
answers
6k
views
Is it a good idea to show progress indicator inside a button?
Typical examples: Ladda UI for Bootstrap 3.
Crazier examples: Progress Button Styles.
This is for a desktop app, if it matters. Consider that the target view has about three different buttons. The ...
- 277
1
vote
1
answer
79
views
What are the variables needed for describing Friction, Elasticity, magnetism interactions in a UI
Preparing specs for developers of 'pull to refresh' and flick gestures. I'm trying to figure out how to spec these out. Compared to defining normal animations like movement with time and distance this ...
- 10.8k
7
votes
3
answers
468
views
Do users understand "Shake to say no" animations?
It seems to be more prevalent recently that a form or action that is deemed invalid will respond by shaking in horizontal "no" like animation. A simple example seen here:
or:
This can be ...
- 15.4k