Blogging was where we began, and how we built our company so we have preserved this archive to show how our thinking developed over a decade of developing the use of social technology inside organisations

Design strategy for the changing web

by Mark Mitchell

Co-authored with Davide Casali

We create social tools and systems that work for users, so-called situated software that feels native to a particular context. Social software solutions informed by case studies and driven by a constant focus on the user experience. In a world of rapid technological advancement, we must acknowledge that our interaction with the web has fundamentally shifted.

Our access to rich social exchange and powerful analytics is no longer limited to the desktop computer. Nor is it exclusive to a small subset of handheld devices. Social solutions should address specific needs and encourage user engagement but only by recognising user interaction within the context of available technology and day-to-day use will adoption be truly successful. Accepting that we cannot always predict the next advancement in mobile or tablet technology, we can create solutions tailored to existing technology and devices that remains flexible enough to adapt to innovation ahead.

How can you refine and expand your current offering? Which mobile strategy is appropriate? Research, user needs, and content strategy will inform your decision to which approach is best for your audience.

 

 Messaging

Messaging is the simplest possible solution for interaction available to mobile users. Using widely available technology like SMS and RSS with social platforms, messaging encourages and supports mobile usage behaviours. Coupled with a strong engagement strategy, this solution can utilise existing channels such as Twitter or Facebook to build a good user base with minimal setup requirements.

It is best suited for low-budget situations and for services that provide some sort of news update.

 

 Responsive CSS

In a landscape of an ever-expanding number of devices, Responsive Web Design is a complete rethink of the role of design on the web. Rather than build for specific devices or screen sizes, responsive CSS recognises that users frequently change the way they access content. It draws on the latest technology to create one fluid website that remains consistent (if not exact) from desktop to mobile, video game console to tablet. By designing for the browser, this solution remains device agnostic with a focus on content first.

Responsive CSS is ideal when the same user experience (architecture, features) is transferable from the desktop to the mobile. It works best as a holistic package planned from the start: an efficient approach with contained costs that works across most devices and screen sizes.

e.g. Headshift, Authentic Jobs

 

 Mobile UX

In instances where users need a distinct but similar mobile experience to the desktop, a good option is to design a separate mobile website with its own special attributes, built in parallel to the desktop solution. This acknowledges the different user needs between mobile and desktop, and works well for companies that offer a utility or feature (such as localised search) that makes the most of a mobile device. A specially designed architecture will prioritise these features.

Further, Mobile UX can incorporate the technology found in Responsive CSS to provide a distinct experience while still targeting a variety of screen sizes.

e.g. mobile.guardian.co.uk, mobile.twitter.com

 

 Mobile App/HTML

An effective way to gain many of the benefits of a native platform while keeping a simple but effective codebase is to create an app using web technologies (HTML5, CSS3, Javascript) and wrapping it inside a native shell. The user experience is tailored much like a native application, though much more portable.

Performance is similar to that of a standard website with the additional advantages of a native platform: hardware recognition, store distribution and easy access. Reusable code balances maintenance requirements, useful for projects without the budget for a full native application.

e.g. PhoneGap, Financial Times

 

 Native App

A native mobile application is software designed around mobile behaviours, built for a chosen platform like the iPhone or Android. It is often the best possible option as it has the most potential for creating a diversity of solutions. By making use of device hardware, apps give the user a high-speed, tailored experience rich with animated interactions.

The higher cost of development and limited device portability is offset by the significant benefits to the user and the custom features afforded to the audience.

e.g. Facebook, Evernote

4 Responses to Design strategy for the changing web

  1. Pingback: Design strategy for the changing web « Dachis Group Collaboratory

  2. By Digital Project Manager Toronto on September 4, 2011 at 4:15 am

    Another huge perk about Mobile App/HTML vs Native Apps are the instaneous feature updates and modifications. Rather than requesting visitors download an updated version of the app from an app store or marketplace, the visitor can immediately have access to the update on the mobile site. I find this really difficult to compete with. Not to mention, this usually more cost effective (of course depends on the situation, but I am speaking generally) and when done properly, is web-friendly to all devices (Responsive CSS).

  3. Pingback: Responsive Web Design, Mobile First, and the Future of Content Consumption « Dachis Group Collaboratory

  4. Pingback: Interesting elsewhere – 20 December 2011 | Public Strategist