Back to Insights

Five mobile design takeaways from the Breaking Development Conference

The Breaking Development Conference held last year in Nashville was fantastic. When I attend conferences, the most interesting learning doesn't necessarily come from the sessions themselves, but from thought-provoking discussions with other conference-goers or speakers between sessions at coffee breaks, lunch breaks, or over beers in the evening.

However, the vast majority of the Breaking Development sessions were just as thought-provoking as those impromptu conversations outside of the formal conference. This is pretty special.

Listed below are my five biggest takeaways for designing for mobile:

  1. There needs to be a paradigm shift when looking at your mobile strategy.
  2. Never underestimate how important teaching touch is to ensuring your mobile site/app is a success.
  3. Take advantage of the very special capabilities of what mobile gives you.
  4. Buttons are a hack
  5. Mobile web comes first

Below I delve into a little bit more detail of each. They are all inspired by the fantastic presentations at the conference and interesting conversations that came out of them and I encourage you to seek out the original presentations for more fantastic content.

  1. There needs to be a paradigm shift when looking at your mobile strategy.

    If there was any theme at the conference, it was that our thoughts about mobile have been proved inherently wrong with recent developments in smartphone technology and must change for us to embrace this technology as designers. For example, apparently 39 percent of mobile use is on the toilet (quoted from Jason Grigsby's Casting Off the Desktop Shackles presentation). Due to the influx of new (and very capable) devices, companies need to start (if they haven't already) thinking about a mobile strategy as the desktop vs. mobile scale is starting to tip rapidly in favor of mobile.

    Desktop should no longer be thought of as the Web's primary access point, which is the way many websites are designed. "Make it function fantastically on the desktop then tack on a mobile offering if we have time later," is a very limited way of thinking that can set companies back when preparing for the future that is rapidly arriving.

    We have a fantastic opportunity to change the way we think in the design of applications. Instead of designing for the desktop, and including a mobile component, how about designing for mobile and including a desktop component? Jason Grigsby (@grigs) stated via Twitter "We'll know the mobile web is 'ready' when links to a desktop version are understood to be unnecessary", which I found to be a very important statement. Things shouldn't be dumbed down for mobile. Its user base is sophisticated and with steady increases in mobile bandwidth each year, users expect great mobile experiences. There is a shift in thinking — a mobile solution is the number one design focus, and a desktop version provides everything a mobile solution does, but takes advantage of extra hardware access that a desktop computer and a higher bandwidth Internet connection can provide

  2. Never underestimate how important teaching touch is to ensuring your mobile site/app is a success.

    One of the most difficult things to teach in a touch interface is gestures, which are, as Josh Clark put it in his Buttons Are a Hack presentation, "the keyboard shortcuts of touch interfaces". How does one figure out what different gestures exist, what a tap vs. a double tap vs. a tap and hold do (or if they're even implemented in that particular interface) without experimentation? How does one even know how to experiment considering that solid conventions still aren't universally applied in touch (although some have been established like pinching/spreading to zoom in/out)?

    Josh's presentation focused on three main areas of teaching touch: Level Ups, Power Ups, and Coaching. You might recognize these three terms from various aspects of video gaming. And why not? Video games have been teaching very complex forms of interactions for years so it would seem natural to look to gaming for inspiration when teaching touch.

    Level Ups Power Ups Coaching

    -We learn best by receiving it in smaller doses

    -We build on basics very well and learn as we go

    -The best time to learn is when it's needed (user motivation)

    -Gestures make you more efficient

    -They're the keyboard shortcuts of touch

    -Deliver a power up when users earn it

    -We're taught by demonstration, we learn by practice

    -Do not overdo it and ensure that you respect people's time with tips that interrupt flow


  3. Take advantage of the very special capabilities of what mobile gives you.

    Mobile provides the same basic access to the Internet that the desktop does, but due to the mobile nature of the device and some pretty sophisticated technological features (like GPS and a camera) mobile can provide users with functionality that the desktop cannot.

    Using the principle of locality, mobile devices can better serve users by providing geographical context to searches. An example of this is the Subway Finder application (and many others of the same design) which given your current location, will find you the closest Subway restaurant. This can be really handy given the immediate-in-nature use of mobile devices.

    With direct access to hardware features like a phone's camera, applications like the Twitter app can upload pictures directly, instead of the two step process requiring a user to first download pictures from a camera to a desktop computer before uploading them.

    Main Functionality of Twitter InterfaceAlso, one can design to take advantage of the fact that many mobile users are only on their devices for very short pockets of time. They're not going to want to jump through a lot of hoops in order to access buried content or navigate complicated menu structures.

    For examples you just have to look at the Twitter mobile website and mobile app. They have both been optimized in a task-based approach highlighting the most important functions this service provides. The interface has been designed to emphasize these very prominently, as shown in the image to the left.

    For Twitter there are really two main functions widely used: the ability to write a tweet quickly and the ability to browse Twitter feed. The vast majority of the screen has been dedicated to browsing tweets with the button to compose a new tweet appearing in the top right corner with nothing else in the header.

  4. Buttons are a hack

    Josh Clark's presentation of the same name was thought-provoking. He focused on the opportunity to rethink interactions and interfaces going forward in a world that's not constrained by the keyboard and mouse. He said that the entire concept of a button was to add a required layer of abstraction as a way of interacting indirectly with what's on the screen due to the constraints that came with our interfaces at the time. With touch interfaces, instead of clicking on an element on the screen with a cursor we can now directly interact with this element, which in itself is powerful, but introduces its own challenges.

    The comparison has been made that touch interfaces are Natural User Interfaces (NUI), but that comparison isn't entirely accurate (as defined by Wikipedia). NUIs require that all interactions on touch devices mirror real life physical interactions (i.e., they should be natural to users and don't need to be learned), which isn't necessarily true with all of today's touch interactions. When was the last time you were looking at a paper map and tapped the paper twice to get a closer look? That being said, while some of the interaction would indeed be included under NUI guidelines (horizontal swipes accessing more content like turning pages in a book), others are inherently not that intuitive, exposing a need to communicate what they are and what they do in some way.

    Josh also introduces examples where direct metaphor conventions are not followed. For example, where the iPad's address book native app is styled to look just like an address book with pages and a spine, when you use a horizontal swiping motion on the application, instead of flipping the page (as NUI guidelines would suggest) the app prompts you to delete the contact.

    Essentially the lesson here is where NUI touch interactions are appropriate and suggested, they should be followed and buttons should be removed. There will still be abstract actions that are hard to naturally convey with actions that will still require buttons. However, where we can remove buttons we should—and then we can interact directly with content.

  5. Mobile Web Comes First

    Many of the speakers voiced their opinions on the native vs. mobile web debate. I think the most interesting presentations were the ones given by Luke Wroblewski (Mobile First presentation) and Scott Jensen (Mobile Apps Must Die presentation). Weighing all of these opinions together, the message was clear.

    • "Not every mobile device will have your app on it but every mobile device will have a browser" – Jason Grigsby (@grigs) via Twitter

      It is very important to have a mobile-optimized website because increasingly a user's first exposure to your brand will be on a mobile device. If I were browsing to a site for the first time on my mobile device and it prompted me to download an app in order to consume any content, I would very quickly browse away from that site. It is an unfair expectation that every user will download an app just to get at their content.

    • At this point in time, if your business model requires native access to hardware (like the GPS receiver or the camera or direct hardware access) then a native app will give you the most reliable access to the hardware.

      Unfortunately, the amount of support for native hardware access in the majority of mobile web browsers is poor or non-existent. Updates are planned and coming quickly (either in the form of frameworks or enhancements to JavaScript), but at this point in time they cannot be relied upon, so developing a native app is the way to go.