Sketching Interactive Systems with Sketchify

Željko Obrenović

► To cite this version:

Željko Obrenović. Sketching Interactive Systems with Sketchify. 13th International Conference on Human-Computer Interaction (INTERACT), Sep 2011, Lisbon, Portugal. pp.710-711, 10.1007/978-3-642-23768-3_127. hal-01596894

HAL Id: hal-01596894

https://inria.hal.science/hal-01596894

Submitted on 28 Sep 2017

HAL is a multi-disciplinary open access
archive for the deposit and dissemination of sci-
entific research documents, whether they are pub-
lished or not. The documents may come from
teaching and research institutions in France or
abroad, or from public or private research centers.

L'archive ouverte pluridisciplinaire HAL, est
destinée au dépôt et à la diffusion de documents
scientifiques de niveau recherche, publiés ou non,
émanant des établissements d'enseignement et de
recherche français ou étrangers, des laboratoires
publics ou privés.

<figure><img src="image_1.png" /></figure>

Distributed under a Creative Commons Attribution 4.0 International License
# Sketching Interactive Systems with Sketchify

Željko Obrenović¹

¹User Centered Engineering Group, Department of Industrial Design
Eindhoven Technical University (TU/e)

Tel: +31 40 247 5245

z.obrenovic@tue.nl

http://www.idemployee.id.tue.nl/z.obrenovic/

**Abstract.** Sketching is at the heart of design and creativity, an omnipresent element of any disciplined activity of design. In this tutorial we will summarize many of the existing studies of sketching, and emphasize its role in supporting creativity. We will look at how sketching aids in reflection and conversation, and supports designers' memory and cognition. We will discuss the relation of sketching to prototyping and engineering, and present Sketchify, a software tools for sketching beyond paper and pencil. We will cover various techniques that can be used to extend sketching to other forms than simple creation of a pencil trace on paper.

**Keywords:** sketching, design of interactive systems, creativity.

## 1 Motivation

Sketching is at the heart of design and creativity. Many studies of design practice, such as more recent contributions from Buxton [Buxton 2007], Krippendorff [Krippendorff 2006], and Moggridge [Moggridge 2007], have called attention to sketching as an omnipresent element of any disciplined activity of design.

In this tutorial we will summarize many of the existing studies of sketching, and emphasize its role in supporting creativity. We will look at how sketching aids in reflection and conversation, and supports the designers' memory and cognition. We will discuss the relation of sketching to prototyping and engineering, and present some software tools for sketching.

We will address the need for extending sketching to other forms than simple plain paper. This need is especially evident in the domain of interaction design, where designers also need means to deal with attributes of the overall user experience, such as time, phrasing, and feel. While disciplines such as graphical design and architecture have a rich practice of sketching and courses that students can take in order to improve their sketching skills, interaction designers cannot efficiently employ existing sketching techniques while designing new classes of user interfaces. We will present some novel ideas and approaches that that try to go beyond these limitations and redefine sketching as a creativity support tool that can be supported through various media.
## 2 Topics Covered

### Part 1: Sketching, Creativity and Interaction Design

* What is Sketching?

* Sketching as a Medium for Reflection and Conversation

* Cognitive Psychology Viewpoint: Sketching as an Extension of Designer Memory and Cognition

* Towards Abstract Attributes of Sketching

* Sketching vs. Prototyping and Engineering

### Part 2: Sketchify: Techniques for Sketching Beyond Paper and Pencil

* Visual effects: animation (flipbook, properties), page transitions (screen prototyping)

* Simplified programming: events, timers, macros, scripts

* Working with I/O services: Web cameras, sensors, Wii remote, Web services, Arduino...

* Hacking techniques: screen capturing, screen poking, screen scraping

* Connecting to external devices: iPhone example

## References

1. Obrenović Z., Martens J.B. (2011), "Sketching Interactive Systems with Sketchify", ACM Trans. on CHI, Vol. 18, No. 1, March 2011.

2. Bill Buxton (2007), Sketching User Experiences: Getting the Design Right and the Right Design, Morgan Kaufmann

3. Moggridge, B. (2007). Designing interactions. Cambridge, MA: MIT Press.

4. Krippendorff, K. (2006). The semantic turn: A new foundation for design. Boca Raton: Taylor & Francis.