Tag Info

Hot answers tagged

30

Yes, and it's called finger-friendly. Smaller touch targets are harder for users to hit than larger ones. When you’re designing mobile interfaces, it’s best to make your targets big so that they’re easy for users to tap. But exactly how big should you make them to give the best ease of use to the majority of your users? Many mobile developers have ...


29

There's no 'right' answer here. What is more important is that you are consistent within your own documentation. Regarding touch interfaces, the typical interaction is 'tap'. Regarding desktops, the typical interaction is 'click'. In both cases, it's not the ONLY interaction, however, as both touch devices and desktops can be navigated in other ways ...


23

TLDR; A time based message (timestamp, declarative sentence, or both) in the pull to refresh tray assists user understanding of the age of data shown in the feed. New items available to pull can be indicated with a visual counter. Example: Tweetbot has executed their pull to refresh in a useful, informative way. The time based message is always shown as ...


20

This is a pretty broad question, but if you're looking for some resources, here are a few I would suggest: Apple iOS UI Design Dos & Don'ts Apple: Designing for iOS7 Android Design Guidelines Designing Mobile Interfaces by Steven Hoober and Eric Berkman Mobile Design Pattern Gallery: UI Patterns for Mobile Applications by Theresa Neil Microinteractons: ...


17

Your question seems to suppose that styluses (at least as the primary method of input) were once in favour. I don't necessarily agree that that's true. Styluses solve the problem of using an interface designed around precise targeting of elements (e.g. designed for use with a mouse) without requiring substantial changes to the interface itself. In this way, ...


15

I would say Apple has to do with it, but they're certainly not the only reason. Why use styluses in the first place? Remember the good ol' PDAs? UI-Design: You can instantly see why styluses were used with devices like these: You had no choice! How would somebody possibly touch the UI-elements on this screen with a finger? UI-Design was more ...


14

As you will be using Android, perhaps refer to their own Design Principles documentation? They use 'touch'; Access the entire collection of apps and widgets by touching the All Apps button at the center of the Favorites Tray. I would also say you 'touch the button' because isn't that exactly what you are doing on a touch screen device? That surely is ...


14

I would flip the problem on its head: instead of tracing around the wound, have the user paint a colour over the wound. Give them two tools; a paintbrush and an eraser. This behaviour is similar to the Quick Mask mode in Photoshop and it works great because you can use a very large brush size at first and then come at the sides with a large eraser to ...


14

Here are 3 ways to accomplish a high-precision, trace-style outline without the fat-finger effect. Approach 1: Similar to Kit Grose's excellent answer. A mask gets applied, and you can use brush and eraser to adjust the boundary. The only difference here is, if you need to see the detailed interior of the wound, then the mask works in reverse, i.e. the ...


12

Most commonly I have seen this done with a refresh timestamp, so you might see a message "Last updated 5 seconds ago" at the top of the item list, close to the place where new items would appear when available.


11

The difference between touch and mouse is much deeper than just the size of the controls. It requires another way of thinking: • Swipe rather than scroll (which requires you to rethink the role of scrollbars) • Pinch rather than click to zoom. • Cursor remains invisible (because under your finger). This makes operations much more direct but also less ...


8

To really answer your question, we need to consider why people need a stylus in the first place. 1. Stylus for resistive touchscreens (past -> present) You can't operate a resistive touchscreen with your finger, at least not like a capacity touchscreen. Resistive touchscreens pretty much need hard objects in order to work correctly, which means your ...


7

Click implies the pressing of a physical switch which then creates a 'click' sound - typically on devices with input devices attached (such as a mouse) Push implies moving something out of its original position, typical of a physical button, again similar to a mouse (or moreso key) input Press implies moving into physical contact with something, the ...


6

In order to answer this question you should conduct eye tracking studies. However, Google kind of has an answer already by describing a 'meaningful transition' in their design guidelines, especially 'hierarchical-timing' (see link below). http://www.google.com/design/spec/animation/meaningful-transitions.html#meaningful-transitions-hierarchical-timing They ...


5

It's much faster and easier to use a finger than to have to pull out a stylus every time because not only do you have to pull the stylus out, you then have to use two hands to interact with the device if you're moving or don't have a surface to place your device on. Hands on the other hand (pun intended) let you operate your device with 1 hand (hold in ...


5

The big thing is that you don't want your user to reach a dead-end. How can you curl this microinteraction back around to another action? Is there is an action that the user could take to keep their feed updated more like following more topics, people, or questions? Give the user a proactive way to keep their stream updating instead of an error message that ...


5

Typically, apps like Twitter or Facebook use this kind of pull-to-refresh: ...but when there is no new data, it simply returns to normal, like you said. One possible solution is, after finding no new entries, change the "Loading..." to say "No new entries", then disappear after a short delay.


5

No, not necessarily. In the past, designers used heavily skeuomorphic patterns -- visual styles that strongly resembled physical, tangible objects in order to suggest how they can be interacted with. Physical buttons are often round or shaped to someone's finger because the user is physically touching them, and early digital designers wanted to make sure ...


4

Interesting question. Rather than having a dead zone (safe zone) that does nothing, you should make your "safe area" trigger the label editing. If you do this, then tapping the tile will either trigger the navigation, or editing of the text box. This way there will be no sense that the tile is "broken", and the user can easily cancel out of editing the ...


4

We developed some very early touch screen apps starting back in the 1970s and 1980s, and have learned a lot of lessons and developed our own set of guidelines over the years. (Please note that we did our work with full screen size terminals, long before the existence of handheld devices like tablets and phones.) First, we had to understand our users. ...


4

A little late to the party but I'm developing a project with a designer who is absolutely in love with modals. For mobile devices in 2014, modals are still a poor UX choice because of positioning and scrolling issues. They are most often JavaScript driven, which means if accessibility is important to your project then there will be a cross section of site ...


4

I've seen the term finger-friendly used before, which is pretty succinct. An interface may be fine for a mouse and keyboard, but may not suit finger taps, slides, etc. Either create a dedicated interface for the purpose (such as a smartphone or tablet app) or adapt the one design to suit both use cases. There's also more to finger-friendly interfaces than ...


4

An important factor to consider is the audience of the application (or website). It seems that typically, many younger audiences (or those familiar with touch devices) are used to swiping across carousels. If you look core applications of iOS (and I'm assuming Android as well), you'll find that carousels support swiping to switch to the next image. However, ...


4

You haven't gotten a satisfying answer because there is no satisfying answer. You are trying to make an application built with desktops in mind work well on a touch screen without changing your basic design, which is not possible. On a desktop, you have multiple ways to trigger actions on something (click and mouse over), while on a touch screen you ...


3

As there is no on-hover trigger (no on mouse over action), you have three options: selecting an element on the list, then using a button above/beside the list to perform an action on this element (but it's not what you want to achieve, I believe), not displaying anything by default (hiding completely the buttons triggering actions) and displaying them only ...


3

The strength of traditional tooltips is that they are highly contextualized, and only visible when the user is focused on that particular task. This is the benefit that you're truly trying to replicate for touch – not the tooltips themselves. This benefit can be replicated in a few ways, a few of which revolve around the design principle of progressive ...


3

Personally, I think these apps got it right—in context, the result of this operation (e.g. "move all the items on this screen up a bit") can be accomplished by a newbie through a series of separate individual operations ("move this item up, then this item up, then this item up"). It's not an operation that needs to be performed often, and it's suitably easy ...


3

I suppose the first point to make is that you shouldn't depend on invisible interactions to accomplish anything. The example made in virtualnobi's comment of iOS's swipe-to-delete gesture is a good example; Mail items etc. can be deleted the long way by choosing Edit, then checking the items you wish to delete, then choosing "Trash"/"Archive" at the bottom ...


3

It doesn't matter much (because you're animating). Perhaps it is important to mention that as you use animation for the buttons, visual cognition has it that the effect of their position is likely to be minute. This is due to the fact that motion (animation) is the most effective way to draw people's attention - it is very hard for the brain to ignore. You ...


3

Adding a tap would require extra efforts from the user. Why make user to take such steps. Scrolling is synonymous to exploring without causing the pain. Plus when I look at other Ecommerce apps, scroll is used almost everywhere. Have a look at some of these Images:



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