There is an ongoing assumption that responsive web design is the right approach to take for applications and websites for mobile environments. There’s no doubt that mobile first combined with responsive design can bring excellent results in the right circumstances but there’s an additional approach to consider: task-oriented design; which examines the user’s requirements prior to deciding on a responsive approach to design and in many circumstances guides the design team away from responsive.
Responsive design is cost-effective; you begin with the principle of mobile first and design a single site or mobile app which then scales to fit into other screen sizes. Mobile first tends to prevent the overload of the screen when the site is scaled to its smallest size. However, it is worth noting that this is not always the best way to design a site or app to be used across a wide-spectrum of devices.
Task oriented design asks the question; what will the user do with this application or website on the specific device on which it will be used?
There are two main tasks for apps and websites:
- Tasks which involve consumption of information: Think the Guardian or the BBC – these sites are all about providing content (of various types) to be consumed by the user. The requirement for interaction is minimal and whether they are delivered by a mobile website or a mobile app – it’s likely that responsive design is going to be OK for sites that focus on information consumption.
- Tasks which involve increasing levels of user interaction: Once you step away from information consumption most apps and websites require greater degrees of interactivity – this may mean that responsive design is not the right choice. Adaptive design, where a different version of the site/app is built for each screen size may be a better choice.
Examining the Usage Model for Task-Oriented Design
Author/Copyright holder: Antoine Lefeuvre. Copyright terms and licence: CC BY-SA 2.0
While there will always be some overlap between platforms in the way that users work – each platform tends to serve a discrete usage model.
- Desktops (and laptops) – users tend to use these at a desk. They are sat and unmoving for reasonable time intervals. They perform complex tasks more frequently than on other platforms. They are more likely to be able to focus on a single task rather than multi-tasking. The traditional mouse/keyboard combination offers a very effective user interface to support this. The more controls and the more complex the task – the more likely it is that the user is going tosit down and use a desktop or laptop to get the job done.
- Tablets – once again users tend to be stationary for the time they use a tablet. However, they’re likely to use a tablet for a shorter-time period than a desktop/laptop and a typical usage interval might be 15-30 minutes. The keyboard is better designed for work than the smartphone keyboard but it’s not as good as the traditional desktop keyboard either. The more switching between virtual keyboards required – the more likely the user will abandon the tablet and the task or switch to using a desktop/laptop to perform it. It’s a good idea for an app to automatically switch keyboards when data input format is consistent.
- Smartphones – phones are more likely to be used in very short intervals. They are often used for on the fly multi-tasking (checking Facebook, e-mail, appointments, etc. in the same period of use). The keyboard is much more limited and task complexity is likely to be much reduced when compared to even the tablet.
Task Analysis For Task-Oriented Design
Author/Copyright holder: Ggd101. Copyright terms and licence: CC BY-SA 3.0
It’s important that design teams conduct a thorough task analysis early in the design phase. This is a much neglected activity but it can help determine the way that a mobile app or website should be built as well as helping to inform the cognitive model, the UI design and the development team’s use case creation.
When you take the device into account you might find a process like making a flight reservation goes something like this:
Desktop/Laptop – used for research. Comparing all the options. Examining the places the flights terminate in and checking hotel availability, sights to see, local transport, etc.
Tablet – once the options are narrowed down on the desktop – the user might then want to review their final options on their tablet before booking those flights.
Smartphone – may only be needed to review, forward or change a flight reservation or to check in before arriving at the airport. It may also be vital in the event that the flight is cancelled to be able to choose an alternative.
In this instance, a flight booking app, needs to offer quite different information and functionality to the same user on different devices. A responsive design simply won’t get the job done – it would be better to build 3 versions of the same app or website and afford the user the choices and functionality they need to serve their needs.
Of course, this information only comes from user research – you cannot assume that your users’ needs will be different from device to device. They may not be. However, if they are markedly different when you start using a task-oriented approach it’s a clear indicator that responsive design probably won’t serve their needs effectively.
Author/Copyright holder: falkowata. Copyright terms and licence: CC BY 2.0
The Take Away
Task-oriented design asks the question; “Is responsive design the correct approach for my mobile application or website design?” In the case of information consumptive sites the answer is that responsive design is probably the right decision to make. In the case of interactive intensive sites/apps the answer may be more complex. Exploring what your users need on each platform will help you make better design decisions resulting in better UX with the finished product.
- For usability resources for task-oriented design check here - http://www.userfocus.co.uk/resources/taskchecklist.html
- A comparison of object oriented design to task-oriented design can be found here: http://uxmastery.com/object-focused-vs-task-focused/
- Task-centred design patterns can be found here: http://www.demystifyingusability.com/2010/06/5-competitive-hallmarks-of-taskoriented-design.html
- Hero Image: Author/Copyright holder: Richard J. Mayer. Copyright terms and licence: Public Domain.