Questions tagged [microinteractions]

Microinteractions are contained product moments that do one small task.

Filter by
Sorted by
Tagged with
1
vote
2answers
34 views

User interaction for interdependent fields

Context: I'm working on a screen where a table will be rendered based on the user's choice of "Country" and "Organization". Both these fields are interdependent and the user needs to have the ...
3
votes
6answers
206 views

Interaction for dependent sibling input fields?

I have two fields in a form - Country and Organisation. These hold the same hierarchy and are dependent on each other. Meaning, the user should be able to either select a country first and then select ...
0
votes
2answers
60 views

Best way to let user select something underneath another an object

For an application I'm developing I've been thinking about an aspect of the UI. Imagine I have an application that lets me draw shapes. I can select drawn shapes by clicking inside of them. But there'...
0
votes
2answers
88 views

How to display m x n mapping

I have group of products that a user would want to batch checkout to different addresses. Step 1: User selects the products they want from a tabular list and clicks on checkout Step 2: Next, a ...
2
votes
3answers
409 views

Improving UX for multi-selectable cards

I'm designing a screen where the user should be able to: 1. Select b/w multiple options (displayed in cards) 2. Search for other cards and be able to select those as well. Here's a picture for better ...
3
votes
3answers
113 views

what transition to have between two screens when there is where minor change in content?

I have a series of files that the user can look into. User can open any file and view the file and user can navigate using arrows to view the next file and problem I am facing is where there is very ...
1
vote
1answer
88 views

Workflow/design pattern for allowing user to add multiple fields

Context: I have a page where a user can select from multiple input sources. Within the selected source(s), they can define multiple source links. Problem The way I have currently structured it is ...
1
vote
1answer
49 views

Interaction Tme

I am creating a mobile app for a Shopping mall. I have animated the tab bar icons that change from line-art style to filled icon when selected. A standard UX law states that the interaction should be ...
1
vote
2answers
86 views

How do you document and share motion/animation information with developers?

I have project right now. I'm building a website with a developer guy. I shared all the assets using Zeplin. But since this is the first time, I should also share how everything should behave. I have ...
1
vote
1answer
51 views

What is the term for the design pattern/micro-interaction where you speed up an action by holding a button?

I think most of us are familiar with the interaction of holding onto a button and watching a particular value increment or cycle through at a constant speed. However, I think it is common practice ...
4
votes
3answers
490 views

range/single field switcher

Currently working on car listing app where users can browse cars contact sellers etc... One of the filters we have is the year, right now we're providing the user with 2 fields (Year From - Year To) ...
-1
votes
1answer
114 views

Search box with clickable keywords?

I'm working on a search box in which the user will be entering keywords that can be clicked/interacted with. For example, say, a user types in "Fender Guitar", the words "Fender" and "Guitar" will be ...
3
votes
2answers
122 views

Preferential behaviour for displaying empty row states

Given a UI component is part of a control used to manage a collection of business items - in this case cargo's in a manifest - I'm trying to explore the preferential behaviour for the component when ...
2
votes
1answer
164 views

Should I fake like facebook “like” button?

Instantaly color changes when you hit Facebook like button.we all know it doesn't happen so fast. it is fake. But you tube like icon change color with little delay (depends in connection). I have ...
0
votes
2answers
92 views

What is the name of the design pattern used to create, rename and load user-presets such as styles, favorites, and workspace layouts?

I want to find out what other people have found out about a very common design-pattern. However, my searches come up empty. The pattern is a minimalist save/load feature for things secondary to the ...
3
votes
1answer
77 views

Will hover will be extinct? Any research or case studies done on frequency of hover in desktop

I am typing this on my mobile so let me keep it short. I am talking about contents that is revealed on hover in desktop. So what we do in mobile UI is we make it visible at first sight. I want to know ...
1
vote
2answers
250 views

Best pattern for an image link on a card

I am using cards with images in a project. Ideally, I would like to have the images to be clickable and link to additional information on the topic presented on the card. On desktop, this works ...
4
votes
4answers
259 views

“Cut and Paste” in a tree structure

I am working on a web app that provides a visual programming environment to generate 3D models - Mobius It involves creating a scripts by adding lines of coding and just editing parameters. We are ...
1
vote
1answer
137 views

Team availability - Interaction challenge

I have an interesting interaction problem to solve. I'm working on an app which has a functionality called team availability. The challenge is that the user needs to see the teams availability for the ...
0
votes
1answer
121 views

Selecting and deselecting items for 2 state interactions

I am designing a web application which will show rows and columns of data (a table), when the users select (on click) a row within the table, they will get some supplemental data appearing in a side ...
4
votes
1answer
191 views

Is it a bad practice to hide small blocks of content under a “see more” link/button?

I'm designing a page where there's a columnar list of shops and a small description for each of these shops. The client asked us to include logos and to hide the description with an arrow pointing ...
1
vote
1answer
258 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.
0
votes
1answer
129 views

Repeat or not repeat actions buttons?

I have a discussion with my boss about repeating the same several action buttons in different parts of the application. The actions are: add subtask, add note, add meeting, add message and add file. I ...
2
votes
3answers
186 views

Effective view switching when space is at a premium

I have an area in which space is at an absolute premium and I have a very small space to switch between a mailing address and a billing address. I'm struggling on deciding on a tight but effective UI ...
5
votes
1answer
546 views

social sharing ui/ux on mobile. actionable text + icons or icons only [duplicate]

We trying to implement decent social sharing module for our app and have 2 question, which are pretty much related: Is it important to have visible text which directly say to user what to do, like ...
3
votes
2answers
315 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 ...
1
vote
1answer
73 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 ...
2
votes
2answers
104 views

how do you measure the effectiveness of an interaction model applied to an app

i'm working on an interaction model for an e-commerce app. This includes screen transitions and micro interactions. My question is what are the potential measurable benefits of implementing an ...
93
votes
7answers
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://...
1
vote
1answer
75 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 ...
0
votes
1answer
584 views

Creating an animation and interaction stylguide

extending to the animation aspect of a style guide that we have already built for our ecommerce website and app, What area's of the UI do you need to look at. These are currently what I could break ...
0
votes
2answers
157 views

On a single section of multiple items in mobile device, whether to scroll horizontally or vertically?

I am designing some file sending app similar to email apps. Below is an example of layout. For the [files attached] section, which scrolling method is more preferable, horizontal scroll, or vertical?...
3
votes
3answers
393 views

Aligning UI animation and interaction to brand identity

When coming up with a brand identity, designers will come up with brand guidelines, colors, font style and sizes, usage guidelines, do's and don'ts some brands like intel, macdonalds and intel even ...
1
vote
3answers
361 views

How to combine search and edit in one widget?

Suppose an application where you work with text snippets. You can search for and reuse existing snippets as well as create and edit new snippets. Thus, we basically have two modes: A search mode ...
5
votes
3answers
5k views

Two Actions on an Android Snackbar?

The Android Design guidelines encourage '0-1 actions, not dismiss or cancel' for Snackbars (actionable toasts). My question is about cases when a Snackbar is the best option to not interfere with ...
1
vote
1answer
349 views

interaction design animations style guide

I'm trying to come up with a standard set of animations for each interaction of an e-commerce web site i'm working on. This is a project that's after on a style guide project(something similar to http:...
3
votes
1answer
425 views

Is it problematic to have dropdown selector options expand above the field instead of below?

I'm designing a product-based website, and I have a dropdown selector at the bottom of one of the pages near the footer. When I went to review development, I noticed that the way the dropdown selector ...
1
vote
2answers
817 views

Do users understand this hybrid checkbox/radio control? [duplicate]

I'm wondering about the perennial problem that arises when presenting multiple options, where the user can select none, one, or several options. Using checkboxes, it's not clear whether a user ...
2
votes
3answers
108 views

Why use a video editing tool for web based motion design?

I see a lot of interaction designers are using tools like quartz composer, origami, adobe after effects to design interactions. What benefits does it bring to web app and native app design?
6
votes
5answers
2k views

Right and left representing good and bad

I've been playing around with material design and was making an app where the user can interact with an element by either swiping it right or left (pressing it does a third thing). The idea is that ...
99
votes
6answers
14k views

Star vs Heart icon to represent save as a favourite

I am working on a mobile app that involves the user saving a favourite location. I wanted to use an icon to represent that feature, but I'm not sure which one is better – a star or a heart icon. Some ...
9
votes
4answers
3k views

Is there a reason why you can like your own post?

Facebook, Instagram, and Twitter all enable you to like/favorite your own post. Is there a reason behind why they allow you to favorite your own post? Should it be done an alternate way? There doesn'...
65
votes
9answers
7k views

How to convey: “don't move until the task is done!”

Our local public transportation system uses electronic cards (something like RFID technology) to validate rides. Users enter the vehicle and place their contactless card against a reader, and a beep ...
9
votes
2answers
8k views

Material design solution for popovers

Material design has no popovers, and I wonder what should be used as a replacement? For example, how would you advise Product Hunt to replace their popover when they switch to material design?
12
votes
6answers
3k views

How do you make sure users know that there is a tooltip attached to something?

I've read Do people actually use tooltips?, and there are mixed answers there - I know a lot of people do use tooltips, but there are still a lot of people, in my opinion, that don't use tooltips. ...
1
vote
1answer
873 views

How long should a feature tooltip be displayed before fade-out?

I have a tooltip with 5 words like "Try out some custom options" in my application. My goal is to get people to interact more with options. Is there any basis to calculate how long to leave that ...
2
votes
1answer
504 views

Usage of animated buttons and effects on user experience

I see more and more animated buttons in service oriented web applications, especially in registration and completing an action. In the literature of persuasive psychology, moving objects are used for ...