0

I know we can produce very powerful animation effects in Android using AnimationUtil and xml animation files but would this be considered a good practice for Material Design, specifically for a case when we wait for user do do something.

For example, I have activity with single image or image button on it. User lands on this activity and is expected to tap on that image. I want to give some feedback to user rather than having just a label like "Click here".

I could make a nice animation using AnimationUtil class and xml file in res/anim folder. But would that be how material design recommends it doing? I looked through Material Design guidelines and could not find anything specific to "animation effect waiting for user input" but the screenshot below makes me believe using animation does not violate Material Design guidelines.

Any suggestions?

I am talking about something like this example

enter image description here

pixel
  • 9,653
  • 16
  • 82
  • 149
  • You are free to design your app however you'd like. Material Design is just a way of designing and ordering the UI so users intuitively know how things interact and relate to one another. Adding an animation to your button doesn't violate that. But the question you should ask yourself is, if you don't animate the button, will the user really have no idea they can click it? If the answer is that they won't know, then you likely have other design flaws going on as well. – NoChinDeluxe Oct 07 '15 at 16:26
  • @drschults Thanks for your reply and I am aware of that. But the question is if there are any Material Design guidlines specific to this situation. I could not find any so my conclusion was the same as yours. – pixel Oct 07 '15 at 16:32
  • There is a [section in the Material Design docs on animation](https://www.google.com/design/spec/components/buttons.html). There is also [one for Buttons](https://www.google.com/design/spec/components/buttons.html). You could review those, but what you are wanting to do is not a typical design, so you won't find it specifically mentioned. So again, the questions you want to ask about this design are, is this distracting to the user, does the user actually need this feature, and does it really bring anything needed to the UX design? – NoChinDeluxe Oct 07 '15 at 16:53
  • @drschultz I updated my question. Thanks for your response. – pixel Oct 07 '15 at 17:14
  • I don't see any button in your screenshot. Is there supposed to be one? I do see the volume control (but I assume that got there while you were trying to take the screenshot with the volume key and power key). Otherwise, I do see four colored dots and the word text "Listening...". Listening implies that the user should speak to his phone, not press something. If that's what you want to do, to turn on the microphone and to actually listen to the user, you should show a microphone in an animated circle just like Google or Shazam does it. – Stephan Branczyk Oct 07 '15 at 17:34

1 Answers1

1

There are no specific guidelines against animating buttons while waiting for user input. But you would want to make sure that the animation makes sense in the context of your application. For instance, if you are designing a game, then it would be great to have a button with a little game character on it jumping up and down trying to get the user to start the tutorial for their first time. But if you are designing an email app or a feedreader or something, it would obviously be pretty distracting to have icons and buttons flashing, wiggling, and spinning all over the place. So with that in mind, you would want to make sure the animation is 1) needed, 2) not distracting, 3) fits with the design of the rest of your app.

There are plenty of Stackoverflow questions that show how to do various animations on buttons, so just search for the one you want to do. For instance, if you just wanted to do a simple pulsing alpha transition, this question shows how to do that perfectly: android - How can I make a button flash?

Community
  • 1
  • 1
NoChinDeluxe
  • 3,446
  • 1
  • 16
  • 29