176
votes
Why are animations out often neglected, even from Google?
Animation is used to draw focus to objects. It makes less sense to draw focus to an object the user is no longer pointing to (and thus, is no longer interested in focusing on), than to draw focus to ...
- 1,466
37
votes
Why are animations out often neglected, even from Google?
I don't think it's a design decision; I think they're neglected because, at least in web development, they're kind of annoying to implement and don't contribute enough to the UX to make them worth the ...
- 480
17
votes
Why are animations out often neglected, even from Google?
Pay attention to the fact that the three examples above are all functional animations but serves a different purpose.
The first two examples acts like a modal box pop up. User opens a box and expect ...
- 171
5
votes
social sharing ui/ux on mobile. actionable text + icons or icons only
Your decision should also be informed other factors:
how much you desire to encourage that behavior
how dense/sparse the information on screen already is
how many social networks you plan to provide ...
- 151
5
votes
Two Actions on an Android Snackbar?
It's not exactly a snackbar, but the google website uses a small popup with two links as call to action to download the native app. The two actions are clearly styled as primary and secondary and the ...
- 1,860
5
votes
Should I fake like facebook "like" button?
You're asking whether actions which need to be sent to the server should be shown to happen instantaneously, or after a delay as you wait for the confirmation to be received back by the client/...
- 544
5
votes
Accepted
Which animation or visual queue indicates that there's more content below on mobile
You don't need an animation for this as long as you make sure to avoid the Illusion of Completeness. If users have the impression that there is more content down there then they will eagerly scroll. ...
- 1,355
4
votes
Accepted
Improving UX for multi-selectable cards
As Muhammad Jahangir already hinted at, using Chips to select multiple results in searches is a very common approach.
If you google "ux search multi select", a lot of the results look like this:
...
- 6,816
4
votes
Novel design patterns used to attract user attention but not a call-to-action
There is a word in german for it (for this very specific purpose in graphic design): "Störer". Which I have seen translated to eye-catcher.
The purpose is simply disruptive marketing, interrupting ...
- 422
4
votes
Accepted
Novel design patterns used to attract user attention but not a call-to-action
UI Mascot
...repetitive tasks often struggle with retaining users: people abandon them because they feel bored, and boredom is simply lack of stimulation. By using positive stimuli like humor, ...
- 18.3k
4
votes
What type of design pattern to use to toggle list actions?
I would consider making "Add to watchlist" and "Add to send list" a togglable button:
Add to watchlist => Remove from watchlist
Add to send list => Remove from send list
...
- 316
3
votes
Repeat or not repeat actions buttons?
What if I told you, you both can be right?
Your boss is right by offering the same actions on a higher level. This allows advanced users to use your UI without having to individual go to each entry ...
- 1,751
3
votes
Why are animations out often neglected, even from Google?
Opening animation
If the UI layout changed suddenly, like when there is no animation and the change happens fast as it happens in modern PCs, then the user would be hit by the "What did I break?!" ...
- 3,369
3
votes
Accepted
Aligning UI animation and interaction to brand identity
I'm not sure if there is a guideline on brand animation but I have a gut feeling that there is none, I could be wrong though.
My personal approach to animation is to identify the brand keywords. I ...
- 1,797
3
votes
range/single field switcher
you could achieve this by using a range slider. Like this:
Problem with this pattern: you have a fixed starting point. If your site deals with very old cars, this solution doesn't work. To get it to ...
- 3,415
3
votes
What type of design pattern to use to toggle list actions?
Instead of a Button, you can give the Add to Watchlist and Add to Send list as Checkboxes so that they don't have to use a separate button for removing, just unchecking the options will remove it from ...
- 56
2
votes
How to combine search and edit in one widget?
download bmml source – Wireframes created with Balsamiq Mockups
You search and the snippets that contain the search term pop up. You can see a preview of their content. You can copy them to ...
- 185
2
votes
Accepted
What are the variables needed for describing Friction, Elasticity, magnetism interactions in a UI
I think you are talking about something which is available in jQuery, which they call "Easings" https://api.jqueryui.com/easings/
In this website the movement is communicated using a diagram which ...
- 8,904
2
votes
Best practice for prototyping and making motion animations for iOS and android
Depending on the complexity of your animations, and the methods in which you used to create them, you'd be surprised as to how easy hand off can be.
Since it's just micro interactions and a loading ...
- 21
2
votes
Accepted
Can using animation positively lengthen the user journey
Nielsen and Norman have an exhaustive article on the use of animations -- I suggest you read that.
There has been research done on loading screens and animations. For example, one study found that
...
- 2,776
2
votes
Accepted
Effective view switching when space is at a premium
You could use sectional tabs (as opposed to tabs at the top level) with an underline:
If you feel the need for typographic balance, another option is to add a subheader over the contact section (not ...
- 24.6k
2
votes
Accepted
Is it a bad practice to hide small blocks of content under a "see more" link/button?
It is not bad practice, it is called progressive disclosure.
By adding progressive disclosure you avoid clutter and only give the extra information when the user wants and asks for it. Do you think ...
- 11.4k
2
votes
Accepted
Microinteraction and transition are same?
Microinteractions: Small "delightful" elements that are part of a whole experience.
Note: Microinteractions often use transitions to show the interaction between the user and the system.
Example: ...
- 1,751
2
votes
"Cut and Paste" in a tree structure
To fix the keyboard commands issue: Microsoft softwares generally allow the user to achieve things in three different ways. the keyboard shortcut (which you've already identified), a menu-bar ...
- 14.2k
2
votes
Preferential behaviour for displaying empty row states
I would agree with Bharath Selvaraj, but I want to point out that the Hybrid Approach and Option 1 conflict with the expectation of how data is input in the UI from your example and Option 2.
In the ...
- 63
2
votes
Accepted
range/single field switcher
I was about to comment on BrunoH's answer: https://ux.stackexchange.com/a/122001/98561, which I find a very nice and straightforward solution for desktop users as setting the sliders requires some ...
- 3,125
2
votes
How do you document and share motion/animation information with developers?
I have no idea about Zeplin but I use others like AE, Pixate and Flinto to make UX animations. When it's needed to tell our developers how my demo works and the effects I required, I recorded the ...
- 166
2
votes
Accepted
Workflow/design pattern for allowing user to add multiple fields
You can minimize the form for each source once it has been completed.
This way, the user will only see the list of all sources (type of sources) already contributed and one form for a new source.
...
- 1,549
2
votes
Interaction for dependent sibling input fields?
I think this might be a better solution, in this example you can select from either parent and either hide or show the available selections in a highlight, you could also provide collapse controls on ...
- 6,306
2
votes
User interaction for interdependent fields
One approach is to have the default filter set to the most common search, and have users be explicit about the starting dimension.
In the sketch below, I'm suggesting some friction up front aiming for ...
- 24.6k
Only top scored, non community-wiki answers of a minimum length are eligible