GUIDe for Saving Face: Developing Killer GUIs with Agile Methods (90min)
Agile methods are frequently associated with iterations, incremental development, and adding one thin slice of functionality at a time. We have mantras such as YAGNI and “The Simplest Thing That Could Possibly Work.” We promote refactoring. These concepts are, however, harder to apply to UI-intensive application code than faceless back end systems. In this tutorial, we will incorporate ideas from user-centered design, discussing how we approach user-facing agile application development at Reaktor through a mixture of presentations and hands-on exercise.
This interactive tutorial begins with an introduction to the dynamics of iterative and incremental development of GUI applications, built around our experiences of building applications for clients and for internal use over the past years, looking for a synthesis of agile development and user-centered design.
The approach we describe has had strong influence from Alan Cooper’s work and the GUIDe method from Interacta Design, also heavily influenced by Mr. Cooper’s ideas. GUIDe was introduced at our company through Karri-Pekka Laakso, one of the original GUIDe authors, as a result of Interacta’s gestures towards integrating their model with Extreme Programming. With Mr. Laakso joining Reaktor, we set on a journey of evolving our practices, seeking to integrate ideas from GUIDe (such as simulation-based, goal-directed design of UI prototypes) with our Agile methods.
The goal of this first part of the session is to give the participants a good idea of how we work, starting from how our interaction designers study the stakeholders’ and users’ goals, how the initial UI designs are developed, and how the development teams collaborate with user interaction designers to deliver working software in an iterative, incremental process.
After familiarizing ourselves with the method, we are going to experiment with a specific portion of it - the simulation-based design. The goal of this part of the tutorial is to help the primary persona - a developer with little or no user interaction (or user interface) design skills - learn enough of the vast body of UX knowledge that she is both comfortable and capable of creating Pretty Good UIs™ and, hopefully, has gained the appetite for continuing that learning.
This experimentation takes the form of a hands-on exercise. In the exercise, participants will develop user interface designs for a using low-fidelity tools such as paper and overhead transparencies. We will engage in the assignment in pairs, iterating a UI design to cover more and more scenarios. The presenter will visit the pairs during the exercise for clarification regarding the assignment and guidance regarding the design technique. We will conclude the exercise by reviewing some of the designs (on a voluntary basis) with the whole group and shortly discuss the process through which the designs were created.
After the hands-on exercise and review, the tutorial continues with a brief introduction to a set of user interface design patterns that have emerged as essential in our work. We have found that awareness of these patterns makes a big difference in our developers’ ability to design user interfaces that are both useful and usable. These patterns are discussed at the end of the tutorial rather than before the exercise so that the participants can focus on the technique itself during the exercise rather than attempt to apply specific patterns to the problem at hand.
- 5 min Introduction and opening
- 20 min Presentation of the GUI development method in use at Reaktor
- 10 min Setting up pairs and introducing the hands-on exercise
- 20 min Pair work: developing a UI design through simulation
- 10 min Review of voluntary pairs’ prototypes and reflection on the iterative process
- 20 min Introduction to essential UI design patterns
- 5 min Wrap-up and closing
- Understanding of how the GUI development method used at Reaktor.
- First hand experience with designing a user interface iteratively.
- Knowledge of essential user interface design patterns.