designing ios apps that rock!
Post on 16-Jan-2017
Embed Size (px)
Joey Rigor Kontak Mobile Apps March 4, 2016
apps that rock!
This post is about
the lessons we learned about designing iOS business apps.
The same concepts can also be used for building mobile apps in other
your company is ready to embrace theOK,
A common challenge mostcompanies face is how to transform a desktop
system into a mobile app.
Now, where do we start?
Start with the user experience.
Wikipedia defines user experience (UX)
as referring to a person's behaviours, attitudes, and emotions about using a particular product, system, or service.
Forget about how your desktop app looks like
and how it runs.
Heck, that desktop app is already running for 10-20 years and you
already know the business requirements by heart.
What you dont know (and should know)
is how to integrate these business requirements
into the design of a mobile app.
Do not make the mistake
of just trying to fit the desktop interface to the smaller screen of your target device and then call it
a mobile app.
It doesnt work that way. Really.
Think about the design.
The picky details and obsession to perfection is
what drives Apple designers and engineers to
create Great Apps.
Steve Jobs is known for pushing the design of Apple products to
So how can we adopt this
Apples Human Interface
Guideline is a good
The guideline is about how an app
should look like and how it should run.
To attain this, developers shoulduse the same basic UI concepts and
elements in building it.
Apple just wants all the apps in their store to have the same exceptional user experience.
Building an app that
should capturethe following core concepts:
Simplify the interface. Only use elements that complements each
other.Avoid adding visual objectsthat overwhelmsthecontent.
The content should be the focus. Everything else is secondary. Your design should primarilyconsider how the content
will be shown.
Don't overwhelm your screen
with too much unneeded visual
Before adding anything to your screen, always ask
the questions - Is this necessary? Will
it helpfocus the content?
Negative space alsobring focus
and clarity to the content.
(or blank spaces) gives breathing
Picking the right colours and appropriate font can suggest which elements are tappable, highlighted,
neutral or subdued.
Colour and font are twoaspects that makes or breaks your design.
This is the majorarea iniOS app design that Apple explained thoroughlyin their
It isalso the most time consuming aspect of design - trying the bestcombination of
font and colour toyour interface.
The function of icons
and buttons should always be
Do not use an icon or button that users are not familiar with.
The objective of every screen should be clear.
The user interaction that goes with it should be easily perceived and self explanatory.
Users should know what to do next.
In real life, when you go to one roomto another, you get a sense of motionand distance. That way
you don't get lost. That same concept should be applied to the user interface."
Depthisa very abstract concept, but at the same time very powerful.
Animations andtransitions of screensare built-in in Xcode (the development platform
foriOS) and you canexecute it easily.
But use it subtly and don't overdo it.
Excessive animationswill become distracting (even
irritating) over time.
Use it wisely to create an exciting and unique user
Your app should be
'fun' to use.
To summarise, the core design concepts to make your
mobile app rock are:
There you have it.
Colour and font. Icons, buttons and
DeferenceFocus the content
Simplify the interface.
Animations and transitions.
Yup, I know these concepts are pretty
The next post will show how we use it to build our iOS B2B app.
Learn on, grasshopper. The night is still young.
My blogs will try to convince everybody to learn how to code. How to become creators of technology.
This became a passion as I see people using technology in their daily lives but have no idea how it works. Sadly, almost
all of us are mere consumers.
As a software developer, I have always been interested in learning technology and how I can share what Ive learned
specially to others with professions outside my field.
This is part of a series of posts about how I can convince you to be a coder.
Stay tuned, grasshopper.
To know more about our company and other blogs, just click the link below: