No one sets out to create a poorly designed app. Every project begins with high hopes and great expectations, but it’s amazing how quickly app design can start to unravel. Typically the problems with the user experience (UX) result from the accumulation of seemingly minor issues -- compounding imperfections that ultimately cause users to quit the app and never come back.
Credits to Nathan Barry, Jack McKibben, Lauren Pedigo, and Joe Chernov of Kinevy.com
2. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 1
No one sets out to create a poorly designed app. Every project begins
with high hopes and great expectations, but it’s amazing how quickly
app design can start to unravel. Typically the problems with the user
experience (UX) result from the accumulation of seemingly minor
issues -- compounding imperfections that ultimately cause users to
quit the app and never come back.
Many of these small mistakes emerge early
on in the process, long before the visual
design is even considered. Early decisions,
like the initial feature set and how your
backend system will work, can have a
dramatic impact on the UX of the entire
project.
This eBook explores nine of the most
common UX pitfalls in mobile app design. It highlights the traps so
that app developers know how to avoid them. But if you’ve made any
of these mistakes, no need to worry. The eBook also explains how to
overcome the setback.
The 9 Most Common UX Mistakes in Mobile App Design
1. Not simplifying the feature set
2. Forgetting state
3. Not using finger-sized tap targets
4. Overcrowding views
5. Keeping the user waiting without feedback
6. Displaying the wrong keyboards
7. Failing to do usability testing (or ignoring the results)
8. Ignoring speed and caching
9. Overusing push notifications
3. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 2
Mistake 1: Not Simplifying The Feature Set
If you want to build a product that is
simple to use, then creating a simple
product is a good place to start. We
tend to think of all the wonderful things
our app could do, but then things get
messy when we try to implement the
entire list of possible features. So the
trick is to plan everything you might
want in the application, then pare down
the list to only the most important
items. This is sometimes referred to as arriving at your MVP, or
Minimum Viable Product, but I prefer the following characterization
by Dan Cederholm of SimpleBits: “Dream big, implement small.”
Analog as it is, for me it works best if I write everything down on
paper and then circle the absolutely critical features. I do this rather
than crossing out the optional features. It seems like a minor differ-
ence, but if you pick out the mandatory features you will end up with
a much shorter list.
When working from the short list of mandatory features you can set
the bar for user experience very high. Then later as you add more
features you can work hard to maintain your high standards.
The designers at 37signals say, “It’s better to build half a product than
a half-assed product.” Cutting features at the beginning is the best
way to start building a great product.
Mistake 2: Forgetting State
A few weeks ago I was trying to get some work done on my iPhone.
Hunting for a particular piece of data required me to drill a few layers
deep into the app’s navigation. Then, realizing I needed something
from the web as well, I quickly switched over to Safari.
4. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 3
When I returned to this app moments later, I was shown the top-level
dashboard. Wait, what?
What happened to the page I had worked so hard to find? Although
no data had been lost, because the app hadn’t remembered my
navigation state, I felt as if the app had wasted my time. It created a
frustrated user.
Your app should always try to act on behalf of the user. It should
remember the last screen the user was visiting so they can immedi-
ately pick up where they left off when they return.
Remembering state can also work across devices. Since a single
person may use multiple devices in which the apps sync between
them automatically, then the user will expect the data to sync as well.
For example, if an Angry Birds player
clears multiple levels on his iPhone,
then he shouldn’t be set to the
beginning on his iPad.
State is a prime example of a UX issue
being heavily impacted by backend
functionality. If you (or a collaborator)
don’t have backend development
skills, you might want to try a back-
end-as-a-service provider that has
pre-built this capability for you.
Mistake 3: Not Using Finger-Sized Tap Targets
Literally the biggest thing you can do to improve the usability of your
app is to increase the tappable area for every button. You’re design-
ing for fingers and thumbs, not mouse cursors (which have a higher
pointing accuracy).
Apple recommends a minimum of 44px by 44px for any element with
which the user is expected to interact. The same recommendation
applies to other smartphone platforms.
5. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 4
Of course, this guidance doesn’t mean
that the button needs to appear that
large. The tappable area can extend
beyond the visible borders of the
button. This will help users avoid the
frustration of trying multiple times to
tap an element. Just be careful if you
position several buttons close to each
other. Make sure that your extra
tappable area doesn’t overlap with
other buttons.
Mistake 4: Overcrowding Views
If you are used to designing for desktop computers, you’ll be
surprised at just how little content you can fit on a mobile phone.
Because the screens are so much smaller, and tap targets need to be
larger, views quickly become overcrowded. The solution is not to
make elements smaller. That will just frustrate your users. Instead
you need to add more views.
Whenever I start designing a new
mobile app, I underestimate the
number of required views. I start
out thinking it will be a relatively
simple app with fewer than five
views, but then the views start
adding up. Before long I find I need
as many as 20 views to handle all
the necessary tasks (registration,
forgot password, setting notifica-
tion times, etc).
But that’s okay. It’s better to add more views than it is to overcrowd
just a few views. Dedicating an entire view to setting a notification
time is just fine. Just make sure that your transitions are quick,
buttons are clear, and that it’s easy to get back to the previous view.
6. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 5
Mistake 5: Keeping The User Waiting Without Feedback
Users have very little patience with mobile applications. As a mobile
app developer, you might be frustrated with a user’s impatience
because you understand that some tasks are always going to be
slow, especially when the user has a
weak network
connection or an older device.
“Typically the
problems with the
If your app is too slow or feels unre-
sponsive, it only takes a single tap of
user experience
the “home” button before your user is result from the
gone and never revisits your app. accumulation of
Luckily there is an easy way to help seemingly minor
your users become more patient: issues. ”
Simply keep them informed.
Typically the problems with the user Click to tweet
experience (UX) result from the accu-
mulation of seemingly minor issues
Let's say you are trying to populate the database on the first run of a
newly installed app. By default, iOS shows a splash screen while the
app is installing. Instead of the generic splash screen, you could
display a simple message with a loading animation that reads,
"Installing ..."
That step alone will grant you several seconds of patience. If it takes
longer you can buy more time by changing the message. Next set it
to "Loading database ..." If you need even more time wait several
seconds and update the message again. "Loading interface ..." will
give you still more time. Change the messages to what makes sense
for your application, but keep the user informed.
You see, the user is just worried that your app has locked up. No one
wants to keep staring at a screen that isn't going to do anything else.
By changing the messages it shows that your application is still
working on their behalf.
7. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 6
Mistake 6: Displaying The Wrong Keyboards
Have you ever typed in a URL and been happy to see a button on the
keyboard that has “.com” on a single button? That single button saved
you three additional keystrokes.
That little shortcut is possible because we know what type of data is
expected in a text field, so we can change the keyboard to make that
easier. This means that you can add an “@” button on the main
keyboard for entering emails or showing that “.com” button for URLs.
There are actually eight different keyboard variations available to you on
iOS. Whenever you put in a text field you can select which keyboard
should be used to input the content. These range from the default
keyboard to number keyboards that are entirely different, with lots of
subtle variations in between. Look through the options and choose the
one that makes the most sense for each field.
You can also choose the keyboards on
mobile web apps by changing the
input type. Normally for form fields
we use <input type=”text” /> and
<input type=”password” />, but in
HTML5 even more options are avail-
able. The one you should use most
often is <input type=”email” />.
Visually it doesn’t look different from
a standard text input, but iOS and
Android will automatically display a
keyboard with a period and an @ symbol to make it quicker to enter
email addresses.
Mistake 7: Failing To Do Usability Testing (Or Ignoring The Results)
Typically when you develop an app you know the product so well that
you can’t accurately judge how easy it is to use for someone experi-
encing it for the first time. You are simply too close to it. Concepts that
are intuitive to you, since you designed them, may need more expla-
nation for a new user. The solution is to conduct usability testing.
8. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 7
That may sound like a fancy term, but it really can be quite simple.
Find a friend or unsuspecting stranger who can give unbiased feed-
back. Hand them a phone running your app and ask them to com-
plete a specific task, such as “Create a new to-do item.”
Resist the urge to coach them. Just watch what they do,
catalogue where they get confused, and gauge how quickly they find
the necessary buttons.
It’s best if you can get them to verbalize their thoughts in this
process.
Take notes as you watch them. Once they complete a task give them
another one and keep watching. This process can be invaluable,
provided the participant feels free to share his or her unvarnished
opinion.
After you’ve captured feedback from a few people, make the fixes
before testing with others. Generally there’s little need to conduct
user testing with lots of people. You’ll reach the point of diminishing
returns quickly. I’ve consistently
found that users encounter 90% of
the same issues.
Using potential customers or at least
people in your target market is best,
but almost anyone will do. Just weigh
the value of their feedback based on
how close they are to your target
customer.
Pitfall 8: Ignoring Speed & Caching
When implementing features and designing a great user experience,
it can be easy to forget that speed is a feature. In fact, if your app is
slow, your users may become frustrated and never even try the
app-differentiating features you spent so much time building.
9. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 8
Facebook recently released an update to their iOS app. This update
dramatically improved the user experience, but visually very little was
different. So what made the difference?
Their entire update focused on making the app fast. Facebook, like
many apps, needs to get almost all of their data from a server that
was slowing down the entire experi-
ence. By decreasing requests and
implementing caching, the speed of
the app improved so much you could
see user reviews on the App Store
pointing it out. Caching your data to
improve load speed is another area
that a thoughtfully architected
backend can provide -- and, in doing
so, radically improve the user experi-
ence of your application.
Pitfall 9: Overusing Push Notifications
Many apps need to be used actively in order for the developer to
generate revenue (e.g., increasing views for advertisements or
enticing users to make in-app purchases). So how do developers get
users to come back?
Push notifications are one option, but many developers use them
poorly. Do you really want to be reminded to use that app you never
cared about in the first place? In that case a poorly targeted push
notification may be the final straw needed for the user to uninstall
the app.
That’s not to say you shouldn’t use push notifications, because you
should. Just be smart about it.
If you send targeted notifications based on a user’s preferences or
location it can help make your app more sticky and keep them
coming back. This is just another reason to have a server-side com-
ponent to your application. The better your information about your
10. HOW TO AVOID 9 COMMON MOBILE UX MISTAKES 9
customers, the more targeted you can be in your interactions with
them.
All this will save you from sending a mass push notification in a
desperate attempt to get some of your users back.
Wrapping Up
Many of these mistakes are easy to make, but luckily most are easy to
fix as well. It takes an attention to detail throughout every step of the
app creation process to finish with a great user experience.
Near the launch of a new app I find it helpful to get away from my
normal design process and try to see the application as a user. Start
at the beginning and go through the
setup steps exactly as your first
users will. Take notes at every
juncture, paying special attention to
places in the flow that don’t make
complete sense or could cause
confusion.
Write down a to-do item for each
spacing issue, every sentence of
copy that isn’t clear, and each bug
you encounter -- especially the
things you didn’t have time to deal with when you were building the
feature.
You don’t necessarily have to fix everything on that list, but it is
important to be aware of everything your users may encounter. Then
when you are back in your design or development mindset you can
power through many of those tasks quite quickly.
Though if you take nothing else away from this, I want you to start
doing usability testing. It really does not have to be complicated. Just
watch your users as they use your product. You will learn so much in
very little time.
11. HOW TO MAKE AN APP: iOS EDITION
Written by Designed by
Nathan Barry Jake McKibben and Lauren Pedigo
Barry is a software designer and author
of two books: The App Design Hand- Project Manager
book and Designing Web Applications.
He enjoys teaching design, creating new Joe Chernov
products, and writing about the entire
process on his blog, NathanBarry.com.
Nathan lives in Boise, Idaho with his wife
and one year old son. A favorite pastime
is traveling and showing the world to
little Oliver, though he won't remember
any of it.
What is Kinvey? Kinvey makes a fully-featured Backend as a
Service solution, offering 3rd party data integrations, multi-plat-
form support, push notifications, and custom business logic on a
platform where it's free to get started and you only pay when your
app is successful.
Build your backend today