Making an app is fairly easy. You have an idea, scribble some mockups on a napkin, spend a month or two hunched over your computer and then release it to the world. The overwhelming majority of apps are average or maybe even good. Taking it to the next level is much harder. What makes a good app great?
Two acronyms that are often thrown around as interchangeable are UI (User Interface) and UX (User Experience). To most people (even developers, designers, and project managers), these are just buzzwords that describe the general look of an app: colours, graphics, gradients, etc. The often-overlooked difference is that the interface is what the user sees, whereas the experience is what the user feels. Subtle, I know, so let’s look at some examples of what I mean.
When Apple released iOS 7 last year, they built it around three main themes:
These themes affect the interface (UI) of an app, but their effect on the experience (UX) is far more substantial.
One of the most intriguing features added to iOS 7 was the inclusion of a full physics engine: UIKit Dynamics. It allows developers to create captivating and engaging experiences for users. For example, as you swipe up and down in the Messages app you’ll notice how each message appears to be attached to the previous and next message. Depending on the scroll velocity, the messages slide and bounce into place. Reading messages without this feature is perfectly fine, but this extra touch adds engagement to an otherwise dull task.
View example: Messages
Another example is accessing the camera from the lock screen. In previous versions of iOS a user would swipe up on the camera icon which resulted in a linear animation while the camera app was displayed. In iOS 7, the lock screen now has weight to it and is affected by gravity. Swiping partway up and letting go results in gravity pulling the lock screen down, bouncing off the bottom of screen. Even more interestingly, moving the camera up and slamming it down again can result in a big enough bounce that the camera app opens as a result. Again, this is an unnecessary feature but one that adds whimsy and excitement to an otherwise simple interaction.
View example: Camera Lock
Blurring is widely used in iOS 7 to provide a context to the view being displayed. For example, when pulling down ‘Notification Center’ from the top of the screen, instead of overlaying the entire screen with an opaque background, a blurred view is used instead, dynamically blurring the contents behind the view providing a sense of depth and context to the user.
View example: Blur
Animations are used in nearly every app. Pushing a screen onto a navigation stack causes the new screen to animate in from the right. Opening an application from the home screen causes the application to seemingly expand from its icon. What makes an app really stand out is using custom animations to enhance the experience. Take the stock Weather app, for example. If the current weather is snow, snow gently falls within the application. If it’s cloudy, a cloud silently moves across the screen. These animations are unnecessary for the user to understand that the weather is snowy; the textual content says so. But the use of animations greatly enhances the experience, helping the user “feel” the textual content, giving them a sense of immersion in an otherwise static experience.
View example: Weather
As great as animations can be, they can also be distracting. Imagine an app where every UI element animated onto the screen, fading in and out and moving all over the place. Sure, this may be considered fun by some, but after one launch users will likely never want to use the app again. Great animations in applications are ones that are hardly noticeable until they are no longer present. They enhance, never distract.
Finally, we come to custom transitions. Prior to iOS 7, there were only a handful of stock transitions available out of the box: push, pop, flip, crossfade, and present modally. It was quite difficult to create a custom transition. Not impossible, just really hard. In iOS 7, Apple has given developers the ability to create entirely custom transitions when changing tabs in a tabbed interface, pushing/popping controllers on a navigation controller, presenting modal controllers, and transitioning between collection view layouts. Have a look at the Calendar app. When you transition from year to month the layout morphs between the two views, and again when transitioning from month to week. It provides the user with a sense of context and flow. Tapping the back button in the top-left corner morphs the layout back to the previous one.
View example: Calendar
These are just a handful of concepts and technologies developers can employ to enhance their applications and make them more immersive. Implementing just one of these concepts can take time from a planning and implementation perspective, but the experience payoff is totally worth it; your users will love you for it. Your good apps will become great.