Paper Prototyping as a core tool in the design of mobile phone user experiences
Introduction There is much competition in the mobile telecoms industry. Mobile devices are increasingly feature- rich — they include mega-pixel cameras, music players, media galleries and downloaded applications. This requires the mobile user experience (UE) designer to explore and structure complex interaction design solutions. Designers need to achieve this while retaining clarity and usability for the customer. Paper prototyping offers a rapid design method that addresses these issues, enabling the designer to work through every detail of the user experience early on.
Typically, mobile phone UE design projects involve multiple disciplines. Team members may be software engineers, marketing managers, network specialists or business managers. All of these ‘stakeholders’ have their own viewpoint on what a product should be and how it should function. Each stakeholder has needs and requirements that should to be considered in a design solution. The stakeholder may include clients, internal people and/or a mixture of both. Paper prototyping provides a tool for everyone involved to be part of the design process. It enables collaboration and consideration of a design solution from multiple perspectives.
Structure of document: • Part 1: Problem Space
Outlines the design constraints faced by designers and how paper prototyping helps. • Part 2: Project walkthrough
Illustrates the design approach by walking through the design process for a ‘Manchester United’ custom mobile user interface.
• Part 3: Design exercise Suggests design exercises and a process that enable experimentation with the paper prototyping method.
Interaction Design: Beyond human-computer interaction Sharp, Rogers and Preece 2007 John Wiley & Sons, Ltd ISBN-13: 978-0-470-01866-8
2 Paper Prototyping
About the author Matt Davies has specialised in user interface design for over 11 years. He combines an interaction design and visual design approach. He currently works in a global User Experience Group at Qualcomm in the UK. He has focussed on mobile UI design for over 4 years, working with clients worldwide providing user-centred design across project lifecycles. As well as designing, Matt has spent around 700 hours running usability lab studies with users. This experience has provided a deep understanding of user behaviour, which he feeds into his design approach. Matt has also spent time in academic research with cognitive and educational psychologists at Sussex University UK.
Part 1: Problem Space This section outlines the design issues that mobile UE designers typically face and how paper prototyping helps solve them.
The design challenges for mobile UI projects typically are the issues of time, device constraints and the diverse teams involved in projects.
As designers, how can we design the best user experience in the fastest time possible? How can we achieve this while working within constraints of a small device and achieve the objectives of all stakeholders involved? Designers need rapid methods with which to collaborate, prototype, evaluate and iterate their designs.
The following section covers the core design issues mobile UI designers face and explains how paper prototyping helps work through them.
Design Issue 1: Device Constraints The constraints of mobile devices make them a challenging platform to design for. The constraints include limited input controls (keys, keypad) and small screen size. Also, devices by different manufacturers or with different navigation approaches have varying configurations. Often a service needs to be designed for multiple devices and that adds complexity for designers.
When designing for the PC-based product, designers have the flexibility of a large screen area, and ‘point and click’ input using the mouse. Whereas for mobile, there is no ‘point and click’, text entry is slow using the mobile phone keypad, and the screen display size means that the presentation of information is more challenging. A simple example would be if a designer created a search function for a mobile phone. The design process would immediately involve more constraints than if designed for a PC. First, text entry constraints — typing search keywords will be slower, requiring more user effort and more design consideration. Second, the search-results screen creates challenges to the designer. How can a long list of items with many words be effectively displayed on a small screen?
Part 1: Problem Space 3
These challenges require mobile UI designers to work through the entire user experience and flow. They need to consider the use of softkeys, menus, sub-menus, use of hardkeys, time taken for processes to complete, menu information architecture, payment issues and other issues.
How does paper prototyping help? Paper prototyping as a process is rapid and iterative so that issues can be explored from many angles quicker than other methods. Mapping the entire UI enables the designer to consider the overall flow as well as the details of the menus, sub-menus, keys usage and other issues. In the case where the product/service is being designed for multiple devices (with different navigation), the method can include creation of a set of paper prototypes for each device.
Design Issue 2: Time to Market The mobile industry moves fast. There is a culture within the industry that ‘we need this yesterday’ or ‘we need to get this into the market before anyone else’. Design methods in the industry often need to be rapid if they are to respond to this. The challenge is in achieving design solutions rapidly, while retaining innovation and clarity.
How does paper prototyping help? To a business, the time of their designers and developers is a high cost. Paper prototyping saves time at the start of a project. It enables iterations and discussion to be completed before designers or developers start their time consuming work of creating visual designs or writing code.
This saves huge amounts of time and money as the ‘right’ product is developed from the start. The designer and developer can then work to create their visual designs and code based on the paper prototype design.
As part of the paper prototyping work, UE designers work centrally with the team, identifying potential user experience/usability issues from the start of a project. This also saves time and cost longer term as any UE issues are captured before the time-consuming design/development work starts.
Design Issue 3: Multiple Stakeholders Mobile UI design projects often involve large, multi-disciplinary teams. This is a major challenge for UE designers. How can designers get all stakeholders to be ‘on the same page’, with their ideas combined and synchronised. The stakeholders often will include software engineers, project managers, marketing managers, commercial managers, handset manufacturers, network operator specialists, visual designers and content managers.
Each stakeholder has a varied skillset, background, ‘discipline language’, requirements and motivations. For example, the marketing person may want to generate profit through ‘‘cool new
4 Paper Prototyping
revenue generating services’’, while the software engineer is concerned that ‘‘the new concepts will be difficult to implement in the timescales’’. While on the other hand, the handset manufacturer might see limitations of their target device in providing that service — while the UE designer is focussed on the complete product experience, from the customer perspective.
How does paper prototyping help? Paper prototyping provides a powerful way to collaborate. It enables all stakeholders to work on a single view of the product user experience, as a group.
The method enables everyone in the team to discuss their design ideas — comparing designs, throwing out designs, iterating designs, until the optimum design is reached.
A key strength comes from the simplicity of the materials used in design sessions. The use of just pens and paper to draw the user experience enables all stakeholders to be involved, regardless of their skillset or discipline. Anyone can sketch their ideas to explain them, so there is no division of the group based on skillsets. For example, each stakeholder has tools that are specific to their role. The visual designer uses Photoshop, the developer writes C++ code and the marketing person who creates PowerPoint documents. None of them use all of these tools. So, using pen and paper provides a common tool and a method to communicate ideas across disciplines.