Sketching interactive systems with sketchify

Recent discussions in the interaction design community have called attention to sketching as an omnipresent element of any disciplined activity of design, and have pointed out that sketching should be extended beyond the simple creation of a pencil trace on paper. More specifically, the need to deal with all attributes of a user experience, especially the timing, phrasing, and feel of the interaction, has been identified. In this article, we propose extending the concept of sketching with a pencil on paper to the more generic concept of fluent exploration of interactive materials. We define interactive materials as any piece of software or hardware that represents or simulates a part of the interactive user experience, such as input from sensors, output in the form of sound, video, or image, or interaction with Web services or specialized programs. We have implemented the proposed concept within Sketchify, a tool for sketching user interfaces. Sketchify gives designers the freedom to manipulate interactive materials by combining elements of traditional freehand sketching with functional extensions and end-user programming tools, such as spreadsheets and scripting. We have evaluated Sketchify in the education of interaction designers, identifying both successful aspects and aspects that need further improvements.

[1]  Brad A. Myers,et al.  Past, Present and Future of User Interface Software Tools , 2000, TCHI.

[2]  J. F. Kelley,et al.  An iterative design methodology for user-friendly natural language office information applications , 1984, TOIS.

[3]  Dragan Gasevic,et al.  End-User Service Computing: Spreadsheets as a Service Composition Tool , 2008, IEEE Transactions on Services Computing.

[4]  Ronald M. Baecker,et al.  INTERACTIVE COMPUTER-MEDIATED ANIMATION , 1969 .

[5]  Yang Li,et al.  Activity-based prototyping of ubicomp applications for long-lived, everyday human activities , 2008, CHI.

[6]  Brian Wyvill,et al.  ShapeShop: sketch-based solid modeling with BlobTrees , 2006, SBM.

[7]  Michael Boyle,et al.  Customizable physical interfaces for interacting with conventional applications , 2002, UIST '02.

[8]  T.F. Stahovich The Engineering Sketch , 1998, IEEE Intelligent Systems and their Applications.

[9]  Yang Li,et al.  Topiary: a tool for prototyping location-enhanced applications , 2004, UIST '04.

[10]  Brian P. Bailey,et al.  DEMAIS: designing multimedia applications with interactive storyboards , 2001, MULTIMEDIA '01.

[11]  Bill Buxton,et al.  Sketching User Experiences: Getting the Design Right and the Right Design , 2007 .

[12]  David Gelernter,et al.  Generative communication in Linda , 1985, TOPL.

[13]  A. Lancaster,et al.  Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces , 2004, IEEE Transactions on Professional Communication.

[14]  Jim Waldo,et al.  The Jini Specification , 1999 .

[15]  Michiel van de Panne,et al.  Motion doodles: an interface for sketching character motion , 2004, SIGGRAPH Courses.

[16]  Saul Greenberg,et al.  Phidgets: easy development of physical interfaces through physical widgets , 2001, UIST '01.

[17]  Brian Wyvill,et al.  ShapeShop: sketch-based solid modeling with BlobTrees , 2006, SIGGRAPH Courses.

[18]  James A. Landay,et al.  SILK: sketching interfaces like krazy , 1996, CHI Conference Companion.

[19]  Ben Shneiderman,et al.  Creativity support tools: accelerating discovery and innovation , 2007, CACM.

[20]  T. Keinonen,et al.  Three-in-One User. Study for Focused Collaboration , 2008 .

[21]  Darren Leigh,et al.  The calder toolkit: wired and wireless components for rapidly prototyping interactive devices , 2004, DIS '04.

[22]  Ken Arnold,et al.  JavaSpaces¿ Principles, Patterns, and Practice , 1999 .

[23]  Ivan E. Sutherland,et al.  Sketchpad a Man-Machine Graphical Communication System , 1899, Outstanding Dissertations in the Computer Sciences.

[24]  Judith Hills,et al.  The semantic turn: A new foundation for design , 2008 .

[25]  Zeljko Obrenovic Sketching Interactive Systems with Sketchify , 2011, INTERACT.

[26]  PeringCeline Interaction design prototyping of communicator devices , 2002 .

[27]  Armando Fox,et al.  The Interactive Workspaces Project: Experiences with Ubiquitous Computing Rooms , 2002, IEEE Pervasive Comput..

[28]  Marc Rettig,et al.  Prototyping for tiny fingers , 1994, CACM.

[29]  Gregory D. Abowd,et al.  The Conference Assistant: combining context-awareness with wearable computing , 1999, Digest of Papers. Third International Symposium on Wearable Computers.

[30]  K. Krippendorff The Semantic Turn: A New Foundation For Design , 2005 .

[31]  James A. Landay,et al.  K-sketch: a 'kinetic' sketch pad for novice animators , 2008, CHI.

[32]  Dragan Gasevic,et al.  Mashing Up Oil and Water: Combining Heterogeneous Services for Diverse Users , 2009, IEEE Internet Computing.

[33]  Ronald Baecker,et al.  Picture-driven animation , 1899, AFIPS '69 (Spring).

[34]  B. Shneiderman Promoting universal usability with multi-layer interface design , 2002, CUU '03.

[35]  Nan C. Shu,et al.  Visual Programming: Perspectives and Approaches , 1999, IBM Syst. J..

[36]  Erik Stolterman,et al.  The Nature of Design Practice and Implications for Interaction Design Research , 2008 .

[37]  Mark W. Newman,et al.  The designers' outpost: a tangible interface for collaborative web site , 2001, UIST '01.

[38]  Tek-Jin Nam,et al.  Integrating hardware and software: augmented reality based prototyping method for digital products , 2003, CHI Extended Abstracts.

[39]  Bonnie A. Nardi,et al.  A Small Matter of Programming: Perspectives on End User Computing , 1993 .

[40]  Scott R. Klemmer,et al.  Hacking, Mashing, Gluing: Understanding Opportunistic Design , 2008, IEEE Pervasive Computing.

[41]  Jay David Bolter,et al.  DART: a toolkit for rapid design exploration of augmented reality experiences , 2005, SIGGRAPH 2005.

[42]  Takeo Igarashi,et al.  Guest Editors' Introduction: Sketch-Based Interaction , 2007, IEEE Computer Graphics and Applications.

[43]  David Salesin,et al.  A sketching interface for articulated figure animation , 2006, SIGGRAPH 2006.

[44]  Satoshi Matsuoka,et al.  Teddy: A Sketching Interface for 3D Freeform Design , 1999, SIGGRAPH Courses.

[45]  Bill Moggridge,et al.  Designing interactions , 2006 .

[46]  John F. Hughes,et al.  SKETCH: An Interface for Sketching 3D Scenes , 1996, SIGGRAPH.

[47]  Blair MacIntyre,et al.  DART: a toolkit for rapid design exploration of augmented reality experiences , 2005, ACM Trans. Graph..

[48]  Mark W. Newman,et al.  DENIM: finding a tighter fit between tools and practice for Web site design , 2000, CHI.

[49]  Michael S. Bernstein,et al.  Reflective physical prototyping through integrated design, test, and analysis , 2006, UIST.

[50]  W. Keith Edwards,et al.  Putting computing in context: An infrastructure to support extensible context-enhanced collaborative applications , 2005, TCHI.

[51]  Geraldine Fitzpatrick,et al.  Augmenting the workaday world with Elvin , 1999, ECSCW.

[52]  Shi-Kuo Chang,et al.  Principles of Visual Programming Systems , 1989 .

[53]  Helen M. Grady Web site design: a case study in usability testing using paper prototypes , 2000, SIGDOC.

[54]  Ben Shneiderman,et al.  Design Principles for Tools to Support Creative Thinking , 2005 .

[55]  Scott E. Hudson,et al.  Forming interactivity: a tool for rapid prototyping of physical interactive products , 2002, DIS '02.

[56]  Frank Nielsen,et al.  A sketching interface for modeling the internal structures of 3D shapes , 2006, Smart Graphics.

[57]  Sheffield Hallam,et al.  Designerly Tools , 2012 .

[58]  Levent Burak Kara,et al.  Sketch-Based 3D-Shape Creation for Industrial Styling Design , 2007, IEEE Computer Graphics and Applications.

[59]  Harry Shum,et al.  Sketching reality: Realistic interpretation of architectural designs , 2008, TOGS.

[60]  Takeo Igarashi,et al.  Smooth meshes for sketch-based freeform modeling , 2003, I3D '03.

[61]  K. Gegenfurtner,et al.  Design Issues in Gaze Guidance Under review with ACM Transactions on Computer Human Interaction , 2009 .

[62]  Anoop K. Sinha,et al.  Suede: a Wizard of Oz prototyping tool for speech user interfaces , 2000, UIST '00.

[63]  Celine Pering Interaction design prototyping of communicator devices: towards meeting the hardware-software challenge , 2002, INTR.

[64]  H. M. Grady Web site design: a case study in usability testing using paper prototypes , 2000, 18th Annual Conference on Computer Documentation. ipcc sigdoc 2000. Technology and Teamwork. Proceedings. IEEE Professional Communication Society International Professional Communication Conference an.

[65]  Dragan Gasevic,et al.  Open Source Software: All You Do Is Put It Together , 2007, IEEE Software.

[66]  Carolyn Snyder,et al.  Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces , 2003 .