Mircointeractions
âąAls PPTX, PDF herunterladenâą
0 gefĂ€llt mirâą362 views
Microinteractions show that attention to small details can deliver big and powerful results.
Empfohlen
Weitere Àhnliche Inhalte
Ăhnlich wie Mircointeractions
Ăhnlich wie Mircointeractions (20)
KĂŒrzlich hochgeladen
KĂŒrzlich hochgeladen (20)
Mircointeractions
- 3. What is Micro-interactions? â Feedback or the result of an action. â Accomplish an individual task. â Enhance the sense of direct manipulation. â Help users visualize the results of their actions and prevent errors. Microinteractions are the contained product moments that do one small task.
- 4. Why Microinteractions? â More control through immediate feedback â Instructions - microinteractions can guide users in how to work the system â Visual rewards - Small but satisfying effects enhance the UX â Meeting expectations
- 5. Identifying Opportunities â Switching on/off (features, functions, or the entire UI itself) â Adjusting setting preferences (i.e., volume) â Viewing or writing a small piece of content (i.e., status message, comment) â Connecting one device to another (i.e., computer to phone) â Uploading and downloading â Notifications â Social media sharing â Pull-down and hidden menus â Showing changes (i.e., play button changes to pause)
- 6. Identifying Opportunities â Show System Status the interface should keep the user informed about what is happening
- 7. Identifying Opportunities â Show System Status Or where the user is
- 8. Identifying Opportunities â Highlight Changes Sometimes we have to show notifications to make sure the user sees it
- 9. Identifying Opportunities â Keep Context Use motion to smoothly transport users between navigational contexts, explain changes in the arrangement of elements on a screen
- 10. Identifying Opportunities â Visualize Input Microinteractions help reveal information and help user to reach their goal
- 11. Four Parts of Micro-Interactions Trigger: Initiates an action Rules: What happens in the interaction Feedback: How you know whatâs happening Loops and Modes: Considerations about how the microinteraction is reused
- 12. Best Practices for Microinteractions â Fast response time â Keep the user informed â User research â Use whatâs available â Design for repeated use â Use a human voice â Keep It simple, stupid â Follow the rules of animations
- 13. Thank you!
Hinweis der Redaktion
- New UX trends,
- Iphone silent mood
- There are 4 point we should consider when defining microinteractions
- More control through immediate feedback â The user instantly knows their action was accepted, giving them more confidence in further usability. Instructions â Also microinteractions can guide users in how to work the system. Meeting expectations â In todayâs web design landscape, microinteractions are the norm
- Â keep your user informed about what is going on. And users expect to get responses immediately. But there are situations when an app needs some time before an action is completed. So, the interface should keep the user enlightened about what is happening.
- Takeaway:Â Donât let your user get boredâââkeep the user informed and show them progress (e.g. a loading bar engages the user and prevents confusion).
- Sometimes we have to show notifications to make sure the user sees it. Animation can help Takeaway: In many cases animation effects are used for getting userâs attention to important details. You should use KISS principleâââmicrointeraction is supposed to be small and simple.
- This is especially apply for mobile devices, because itâs simply impossible to fit a lot of information on one screen.
- Data input is one of the most important elements of any application. And micro-interactions turn this process into something special. You can use existing elements to deliver feedback.
- Trigger âThe numbered floor button is a clear visual signifier. Pushing the button is the trigger. Rules ââ basically, what it does. In this case, when you push the button, the elevator will move to that floor. Feedback âWhen the button lights up, people know the elevator will respond accordingly. Loops & Modes For an elevator, the loop is that the button is recognizable enough that the user will understand the function immediately for different elevators, and that the pushing process is not very difficult.
- Here, weâve collected the top expert advice about using microinteractions: Fast response time â A near-immediate response time, within 100 mili second ideally, keeps the user feeling in control. Keep the user informed â A loading bar or status icon engages the user and prevents confusion. user research â Knowing your users will make them more precise and effective. Make sure the visual cues and animations are appropriate. Use whatâs available â Donât add more than necessary: use existing elements to deliver feedback if you can. Design for repeated use Use a human voice âless mechanical voice, Keep It simple, stupid â Donât turn your microinteraction into a macrointeraction. Itâs supposed to be small and simple, so donât get too clever. Follow the rules of animations â Finally, Microinteractions show that attention to small details can deliver big and powerful results. And it enhance the User Experience of an application