60

When typing on a computer, keying in a phone number on a telephone, or a PI Number on an ATM or POS, isn't tactile feedback just as relevant as it is for other applications? Absolutely yes. That's why you can't (reliably) use your touchscreen smartphone if you can't look at it. I used to write SMSs doing something else because muscle memory did all the job ...


52

We are really at the early days of touchscreen technology. While audio feedback and advances in haptic feedback could make this slightly more viable, I see touchscreens as an interim workaround on the journey towards gestural (+ audio) input. The mistake in this design shown in the video is (in my opinion) using a touchscreen at all - i.e. a 'touch ...


46

I don't think you can guarantee it If you try to make people mimic how their signature 'should' be, you'll open a lot of cases where people struggle with their device and can't get it to look the same. It reminds me of every time I receive a parcel, and they make me sign that I received it. Even with a pen my signature ends up looking like a 3-year old ...


38

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 (...


35

Thought I'd throw my two penneth in as a former Automotive Interaction Designer for a large British car manufacturer in the premium and off-road/footballer market owned by an even larger Indian company. Starts with "Jag", ends with "...nd rover" Anyhow, for those of you familiar with those brands you'll know they use touchscreens. I'm not a fan. The NHSTA ...


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 ...


24

There are too many issues with overlaying two different dragable items on the same control. For one - if you want both values to be the same then it's going to be hard to see that there are two indicators, or if you then want to adjust one of them it's difficult to make sure you're grabbing the correct item. If there are only two drag points, then why not ...


23

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 ...


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 ...


22

Advantages A touch screen has the advantage of greater context sensitivity. The sizes, shapes, colors, and labels of controls can change during operation to reflect what is needed for a particular step of a process. Non-touch devices often simulate this by placing a control next to the bottom or side of the screen and displaying a label next to that control,...


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: ...


20

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 ...


20

My signature is basically habit and muscle memory from repeatedly writing my name with a generally standard sized pen. It varies a bit at the best of times. Even if you ask me to sign on a whiteboard using a marker, that varies a fair bit from my "normal" signature due to the implement being a different size. When I've signed for stuff in the past using a ...


18

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 ...


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, ...


16

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 dependant on ...


16

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 ...


15

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 ...


13

Please please please never disable zooming. Ok, you might have thought you got your website design right, you might have thought that you got every font size right, and every photo was clear enough that your users never needed to zoom in on anything. So your users would come to your site, the mobile version would kick in, and they would merrily scroll up ...


13

Can we start with the obvious: Why? Follow up questions: Are you assuming your app has the same legal power as a "wet signature"? You may be in for a surprise! Do you have anybody on staff who is a handwriting expert? Have you seen what other "industry standard" applications do? E.g. Docusign, credit card readers?


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.


12

The best example of a slider as you have mentioned is a volume control. it is defined as "move smoothly along a surface while maintaining continuous contact with it." Whereas the swiping action is defined as "hit or try to hit with a swinging blow." The swiping action is only used in few places where the actions will not cause any major changes in the ...


11

@Obelia has proposed good idea. I just want to show how cue could be implemented in unobtrusive way, so instructional modal window could be eliminated. The menu itself explains the feature with its behavior.


11

That's a tough problem. You could use a drag-from-the-edge to reveal a menu. I would make drag from the left edge to pull a menu "drawer" from the left. You could put some visual cue that this feature exist, something minimal like so: download bmml source – Wireframes created with Balsamiq Mockups or teach that this feature exists with no visual ...


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 ...


10

You could try to expand responsive zones of small draggable areas. Moving close toward those zones is clear indicator of user intentions. It brings smart behavior to your app and provide better usability, as target is increased and moving distance is decreased (Fitts's law in action). To indicate small zones more clearly, you could also use more brighter ...


10

I have been dealing with designing for swipe gestures recently and you raise a very important question, as the main problem with most mobile gestures is discoverability . More and more, swipe is becoming a standard and well known gesture with the rise of Tinder. However, mobile users are still very much used to tapping buttons. Tapping is by far the most ...


9

One less device We use touch screens because it removes the device that acts as a proxy for our hands. Humans act on the physical world haptically—through touch and pressure. A mouse, or other pointing device, lets the user move a pointer that represents a finger. Touch removes the need for the proxy device. It also enables multi-touch in a way that ...


8

I think just as important is padding between buttons and where the button is located on the screen. Some advocate that due to phone cases it is difficult to touch buttons at the edge of the screen. Due to the large size of smart phones currently in the market one handed use is probably on it's way down, but it may still make sense to consider reach of a ...


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