Nikola Zdravevski's Blog

I'm that guy who brought 21.5'' iMac all the way from Jersey to Macedonia as carry-on baggage.

UX Wins in the Foursquare iOS App

| Comments

The more I get into the iOS development the more I see how other fellow developers and/or designers don’t care at all about the UX (user experience) and user interface elements they use. I feel that not enough attention is paid on the visual beauty of the app. So we have all this apps that look-alike or apps that try to be original, but in some, for me wrong ways.

However, of course there are exceptions out there and apps that is pleasure to look at. One of them for me is the new foursquare iOS app, or foursquare version 5.x. I really like the subtle, simple and minimal, yet very cool and good looking details that make you love this app.

Following here are some of the distinctive UX features I have found throughout the foursquare app.

1. UIImageView Background Image

If the user has added a photo to her check in, this photo is shown on the feed as a horizontally scrollable image that hides a girl with a camera in the background.

2. Unique Pull To Refresh Design

We all know the default/Tweetie-like Pull To Refresh control that is used widely across iOS apps and that only features text, a direction changing arrow i.e. nothing original and has even become boring nowadays. Exception is the Apple implementation of its very own Pull To Refresh mechanism that can be found in the stock Mail app under iOS 6 and foursquare’s Pull To Refresh control. They really did a great job here simply by providing a crown image that is shown only if the user kind of overscrolls the refresh control. Fells good when that mayor crown shows up all of a sudden and totally unexpected.

On this picture one can also notice the great rounded edges on the UINavigationBar’s top corners (just below the status bar). I totally like this design.

3. Custom UISwitch

This is by far my favorite social network sharing switch. I love it because of its minimal and pure perfection. When the user turns a switch on it instantly becomes more vivid simply by tinting itself in the color associated with the social network the switch represents.

4. UITabBarItem Title

UITabBarItem names are really important aspect of the app design and should be chosen very carefully and wisely because they will be shown at all times the user is using the application. That said, foursquare has chosen a great and original way of naming their user account tab bar item and instead of boring and traditional names like Profile, Account or User they have named their tab bar item after the user’s first name. Cool and very user friendly.

5. Venue Likes

If the user has liked a venue and is now checked it at that venue, a little heart shows in the bottom right corner of her/his profile picture revealing that user’s appreciation of the specific venue.

In a conclusion, foursquare is a great app with an awesome, beautiful and user oriented design. I use it regularly both for checking in and for inspirational iOS app design ideas.

Thanks for reading this.