Skip to main content
6 votes
Accepted

Why are websites so poor in terms of transition & animation compared to native apps?

There are a lot of assumptions here and a lot of reasons on why, I'll try to break it down: It's a historic thing Animations as we know today, from complex Bezier-smoothed transitions to dialog pops ...
Nick's user avatar
  • 246
6 votes

Is it a good idea to show progress indicator inside a button?

Go for it. One of the added benefits of showing immediate feedback in the button being interacted with is a reduction in duplicate form submissions. This can be really helpful in ecommerce instances ...
Paul Gebel's user avatar
5 votes

Optimal duration for animating transitions

According to Google's Material Design guidelines: Larger animations on mobile devices are 300-400ms long. Smaller animations can be as short as 150-200ms. Animations longer or shorter than ...
Lachezar Petkov's user avatar
5 votes
Accepted

How long should a loading spinner take to do one rotation?

There are some comments on the question which are quite telling - some people can get stressed or anxious when they have difficulty following the motion of an animation or sequence. Yes, there is ...
Roger Attrill's user avatar
4 votes

Element transition between tabs

I think the two main things to consider here: 1) How helpful is the staggered transition compared to the simple? 2) How does the animation affect long-time users vs short-term users? For number 1, ...
NachoDawg's user avatar
  • 243
3 votes

Why are websites so poor in terms of transition & animation compared to native apps?

I'll admit up-front that I'm a bit of a "Luddite" as regards web-design: I generally dislike animations, and mostly prefer clean, simple designs. Having said that, I'll try to be as objective as ...
TripeHound's user avatar
  • 2,655
3 votes

CRUD without READ (detail)

It's not necessarily a bad practice to skip detail view. I think there are two salient points here: Inconsistency can be frustrating to the user. If the UI looks the same but I have to take different ...
saltdotac's user avatar
  • 341
3 votes

What's the name of this kind of transition?

I have always known this as expanding card, and you can search Google for that term and find examples and code to do it. However, Material Design used to call it that way, but in the new site ...
Devin's user avatar
  • 38.1k
2 votes

Is it a good idea to show progress indicator inside a button?

It's fine to have spinner / progress indicator in a button, but try to make the button big enough and put the indicator in the corner, so that the users don't feel distracted by the spinning indicator....
Stephenye's user avatar
  • 307
2 votes

User friendly transition between signup page and login page

Just like Mike, I would also find it really annoying if I am asked to sign in again after registering unless there is an email verification that is required. Another thought - How would you solve ...
Jitesh's user avatar
  • 21
2 votes

Using videos in a personal web-site, how good of an UX is that?

I've been a UX designer for 12 years or so, and I can tell you that it depends on the execution and what it is that you want the site to accomplish. Ultimately, think about what you want people to do ...
sandstack's user avatar
1 vote

Using videos in a personal web-site, how good of an UX is that?

I, personally, tend to disagree to: I really enjoy the high-end web-sites that have a video playing on the background, it makes me feel like things are in motion, it's more engaging, fun, and just ...
Gerold Broser's user avatar
1 vote
Accepted

Micro Transition for selection

There is a special term - Change Blindness. According to Wikipedia: Change blindness is a perceptual phenomenon that occurs when a change in a visual stimulus is introduced and the observer does ...
Lana's user avatar
  • 682
1 vote

How to communicate for required transitions to front-end developers?

Find examples online that you can show or prototype it yourself in figma using smart animate. I do some front end development and some things are much more difficult to do than you think. From the ...
Gene's user avatar
  • 1,324
1 vote
Accepted

CRUD without READ (detail)

If the data they need to edit is the one you're showing in your screen, then it's OK. If the details are more than what you see, then you probably shouldn't skip a read state. More sooner than later,...
Devin's user avatar
  • 38.1k
1 vote

CRUD without READ (detail)

It's ok to go directly to the Edit screen if the context allows. What it sounds like you are worried about is people's dismay at not seeing the detail screen, and unless that page looks very similar ...
Life's user avatar
  • 21
1 vote

How long should a loading spinner take to do one rotation?

How to decide on a speed for the iteration of a loading spinner... ? Experiment 1. Show users random pairs of spinner speeds. Have them choose their preferred speed of the two. Repeat.... Repeat... ...
習約塔's user avatar
  • 1,885
1 vote

How long should a loading spinner take to do one rotation?

I'd also argue it depends on the size of the spinner. Bigger views need to spin slower than smaller ones.
chris07's user avatar
  • 206
1 vote
Accepted

Element transition between tabs

First of all ask why you are using an animation. If it is for an artistic effect then you design it for the effect you need. Since we are on UX stack exchange it probably fair to say you are looking ...
Jonny's user avatar
  • 868
1 vote

Creating a transition pattern library

Did you tried http://sixux.com/tagged/transition/page/3 ? It uses video on Vimeo to show transitions. Also http://capptivate.co for IOS/mobile
Giults's user avatar
  • 610
1 vote
Accepted

Is it a good idea to show progress indicator inside a button?

Your button should have 3 phases if you plan on using the Progress indicator inside. Static Progress Success or Failure Floating Action Buttons in Material Design use a similar concept. You might be ...
Swapnil Borkar's user avatar
1 vote

Is it a good idea to show progress indicator inside a button?

I se no problem using such a solution, but keep in mind that: When submitted, the button shall only use the progress bar (left to right). When submission is completed, the text "Submit" shall NOT be ...
Ilias Bennani's user avatar
1 vote

Alternate language switch for translators

The language switch issue could be solved by a whole number of ways to make the current language more obvious on both the switch and the save stage. The problem of adding the wrong translation to the ...
Roux Martin's user avatar
  • 14.2k
1 vote

Creating an animation and interaction stylguide

As far as I understand your question, you must read this article: https://www.smashingmagazine.com/2015/05/functional-ux-design-animations/ It clearly categorises animation based on their logical ...
Jivan's user avatar
  • 3,728

Only top scored, non community-wiki answers of a minimum length are eligible