As seen on

M-PULSE ANALYSIS: Make Great Mobile Apps By Borrowing From Responsive Web Design?

Topic: Media, Mobile Apps | Author: Peggy Anne Salz | Date: April 18, 2012

responsive web designAt M-Pulse we make the transition to an all-app show, using our platform to bring our growing audience of mobile app developers and brands the information and insights essential to produce and promote engaging and effective applications. We kick off with a look at design and why it comes first — full stop — and connect with Arturo Toldeo, Senior User Experience Designer in the Windows Phone Design Studio in Redmond.

His advice to everyone, everywhere in mobile to put the experience (and the person) before the technology (or anything else) is not new. But it has new urgency as developers struggle to architect apps (and thus experiences) that respect our requirement for multi-screen multi-tasking. In a world where digital experiences must move across platforms and devices, the pressure is on developers to blur the borders that might disturb this flow.

In other show segments:

  • Rob Woodbridge gives us his take on the Instagram acquisition by Facebook
  • I highlight a recent, must-read blog post from friend, colleague and mobile authority Tomi Ahonen. He has compiled a list of the largest mobile social networks worldwide showing the real reach of Instagram (and presenting Google, Twitter & Co. with a shopping list as the land grab for social kicks up a gear). If this snapshot has whet your appetite for more, then check out Pearls Vol 2: Mobile Social Networking. the latest in Tomi’s series of eBooks bringing us mobile case studies and insights from around the globe.
  • We raise our Goblet of Rock to IJM Mobile, an app from the International Justice Mission (developed by Brushfire Media) that combines content and community, allowing us to connect (unite) and raise awareness about oppression, slavery and sexual exploitation.

Responsible and responsive design

responsive web design for appsWe’re not in Kansas anymore. Multiple screens have moved the industry to a new level. As Arturo puts it: The focus on screens and platforms is off the mark. It’s about the “fluidity of experience for the user, which manifests itself in multiple screens and multiple form factors.”

Getting there from here will require app developers to develop a new mindset that puts people first. As Arturo sees it: “The only way to stay mentally healthy is to think more in terms of the experience and disregard … the screen sizes, the platforms and even the technology.”

Interestingly, Arturo believes getting UI and UX right in this new cross-media world demands developers adapt Responsive Web Design (RWD), an approach all about adjusting the layout of content to the viewing environment, to how they think about their apps. (RWD allows users across a broad range of devices and browsers to have access to a single source of content, laid out so as to be easy to read and navigate with a minimum of resizing, panning and scrolling.)

RWD has helped Web developers tackle the challenges of delivering a great experience via one Internet (not a Splinternet), and Arturo is convinced mobile app developers — increasingly confronted by the challenge of creating apps we can enjoy on a multitude of screens — would benefit from a similar approach. “As a designer it is time to start implementing some of these Responsive Web design best practices and start thinking in terms of layout and of being fluid.” (By way of background, RWD uses fluid proportion-based grids to adapt the layout to the viewing environment.)

Metro and more

Arturo also gives us the include track on the seismic shift at Microsoft since it made the brave decision to build a product from scratch. This thinking is at the core of Windows Phone — and central to Metro, the design language that represents a new design paradigm at Microsoft. For a deep (and satisfying!) dive into the philosophy driving this shift, check out http://ux.artu.tv/, where Arturo shares his views on the Microsoft UX and related stuff world from a *designer* perspective.

Put simply, Metro is a comprehensive, end-to-end, flexible and extensible design language. No doubt an excellent match with our requirement for fluid experiences where we are in control, not technology.

metro design language

Metro design language description excerpted from Arturo's blog

My take:

Arturo’s advice is timely and pertinent. Apps are more than applications. Companies across all verticals are harnessing apps to deliver experiences (content, advertising, interactions) that must be free to flow across the screens that define our lives (PC, TV, smartphone, tablet, games consoles). Is Responsive Web Design the answer? Arturo is convinced the way forward in mobile is for developers/designers to adapt RWD best practices and mindset.

In the meantime, it’s exciting to see RWD take center stage in a wider discussion about digital strategy led by my esteemed colleague Matthew Snyder (formerly Director of Strategy at Nokia) , who heads up both his consultancy ADObjects and a new venture focused on RWD called ResponsiveAds. In a recent (and excellent) presentation he has broken down the consumer journey into two sections: Awareness, Consideration and Intent, where the Web is the engine of discovery and action; and Support, Loyalty and Advocacy, where mobile apps add a needed personal and portable aspect to the relationship established between the consumer and the company. (And — more importantly — triggered by interactions via the Web!) Matthew’s central argument: Matthew’s central argument: It’s not “mobile first in a multi-screen world,”, but rather “context first in a  cross screen world.”

In his view RWD could be “10x greater than Mobile Web Design (MWD) in just one year from now,” as companies (and agencies) seek to deliver a fluid experience across all screens, a fluid presentation that requires common content and links (ensuring they are findable via Google; Twitter and Facebook  regardless of screen/device, for example). The inevitable advance of RWD also creates the necessity for Responsive advertising, which is why Matthew has also launched  ResponsiveAds. The company offers completely customizable publisher supply side tools to give website site owners the ability to deploy an advertising and monetization strategy across all screens, thus leveraging their existing operations and relationships with ad networks, mobile and online ad servers. ResponsiveAds has also launched its Private Beta, allowing a handful of publishers, ad networks, ad servers and agencies to work with the company to refine the cross-platform features and self-serve process before the full open launch.

Check out Episode #12 of m-pulse here.


Next week we continue the countdown of what app developers need to know to grow their business.  Check out untetherTV for the full-length interview – and I’ll provide additional analysis in a companion post here at MobileGroove. If you have a good company or a great story, then submit it for consideration (peggy@mobilegroove.com or rob@untethertv.com). It may be that we include YOU in an upcoming segment of the show.

Enhanced by Zemanta

Leave a Reply

Your email address will not be published. Required fields are marked *