Dissolving the screen: making touch screen apps more touchable

Kye Lewis
2 min readNov 12, 2018

--

Touch screen apps are more popular than ever, but when developing an app its important to remove as much friction as possible, to make the experience enjoyable for the end user.

Here are five quick tips to make your touch screen apps more touchable.

An example touch interface which uses many of the tips outlined below- the interactive button is clear and large, the feedback is obvious and immediate. This page was developed quickly using a number of existing resources including FontAwesome, Google Fonts, vex.js, buttons.css and Wikipedia [citation needed]

Make your touch targets obvious

If your touch buttons or controls don’t stand out, your end users may not be sure where to press, or that the screen is even touchable at all

There are many CSS libraries and examples online that can help you create great looking buttons and controls that stand out from your content. You can use color, texture and depth with drop shadows.

Be careful with the balance- you don’t want to lean too heavily on any one of these elements, and you don’t want everything on the screen to be wildly inconsistent.

Get feedback from colleagues or other parties to help you refine the design.

Keep accessibility top of mind

You may not be able to open every experience to everyone who comes by, but there are some simple things you can do to make your app as open as possible.

Use large, easily touchable buttons and controls.

Check that your controls aren’t too high or too low to be operated by a variety of people.

Make controls as simple as possible to operate.

Experiment with what feels natural, and get feedback from those who haven’t worked on your app, so you don’t develop tunnel vision.

Keep your UI highly responsive

If your app slows or stutters when you’re using it, the magic will be broken and users will quickly tire of the experience. Test your app on the specific hardware it will run on, to make sure it can keep up with demand.

Add audio and visual cues

A small button press sound, or a small animation added to your button press helps alert the user both that the item is touchable, and that they’re interacting correctly with the app. It’s important that this happens in sync and as soon as the event happens, to keep the magic going.

Don’t make this distracting, my tip is to use the smallest cue that is clear to the user.

Keep the content interesting & engaging

Too much text or blocks of irrelevant images or video will quickly have your end-user walk away.

Use a good combination of text, voice, music, video and images, along with interaction where appropriate, to keep users interested in your message.

Using these five tips, you can help ensure your touch app reaches its full potential.

--

--

Kye Lewis

Technical Director & technology advocate. I follow cryptocurrency, personal transport, wearables. Opinions are my own.