Prototypage interactif d'interactions : des prototypes jetables au prototypage recyclable

Interactive Prototyping of Interactions : from Throwaway Prototypes to Takeaway Prototyping

• Auteur / Autrice : Germán Leiva
• Direction : Michel Beaudouin-Lafon
• Type : Thèse de doctorat
• Discipline(s) : Informatique
• Date : Soutenance le 12/12/2018
• Etablissement(s) : Université Paris-Saclay (ComUE)
• Ecole(s) doctorale(s) : École doctorale Sciences et technologies de l'information et de la communication (Orsay, Essonne ; 2015-....)
• Partenaire(s) de recherche : Laboratoire : Laboratoire de recherche en informatique (Orsay, Essonne ; 1998-2020)
• Partenaire(s) de recherche : établissement opérateur d'inscription : Université Paris-Sud (1970-2019)
• Jury : Président / Présidente : Jean-Daniel Fekete
• Jury : Examinateurs / Examinatrices : Michel Beaudouin-Lafon, Jean-Daniel Fekete, Björn Hartmann, Nicolai Marquardt, Fanny Chevalier, Jan Borchers
• Jury : Rapporteurs / Rapporteuses : Björn Hartmann, Nicolai Marquardt

Mots clés

Mots clés contrôlés

Design interactif

Compression vidéo

Systèmes informatiques

Prototypage rapide

Interaction humain-machine

Mots clés libres

Interaction homme-ordinateur

Design interactif

Prototypage rapide

Systèmes informatiques

Vidéo

Human-computer interaction

Interaction design

Rapid prototyping

Computer systems

Vidéo

Résumé

Le prototypage est une étape essentielle du processus de design. Pendant les premières phases du processus de conception, les designers utilisent le prototypage rapide pour explorer diverses idées. Les outils et techniques actuels de prototypage se concentrent en particulier sur des représentations papier et donc destinées à être jetées. Or, alors que ces prototypes jetables peuvent être créés rapidement, ils se prêtent mal au processus d'itération. Je propose donc de créer des outils de prototypage rapide qui puissent efficacement supporter la création d'artéfacts à la fois jetables et réutilisables pour esquisser de nouvelles interactions dans les premières phases du processus de design. La première partie porte sur le prototypage vidéo. Les designers font face à deux écueils majeurs à l'utilisation de la vidéo en design d'interaction: le temps nécessaire pour filmer et celui nécessaire pour éditer. J’ai développé VideoClipper pour aider le processus de création de vidéo. Cet outil intègre une méthode de design itérative qui encourage la planification et permet une vraie flexibilité pendant la création de prototypes. Je présente les résultats d'une étude utilisateur informelle de trois semaines avec des étudiants en design d'interaction. Les résultats suggèrent que les participants passent moins de temps à capturer et éditer avec VideoClipper qu'avec les autres outils vidéos. En revanche, ils trouvent parfois difficile de créer des stop-motions pour représenter des interactions continues et de re-filmer de nouveaux segments lorsque le design évolue. J'ai ensuite crée Montage, un outil de prototypage vidéo qui permet aux designers de progressivement augmenter leurs prototypes papier avec des maquettes numériques pour faciliter la création, la réutilisation et l'exploration d'interactions dynamiques. Montage utilise l'incrustation vidéo pour découpler l'interface du prototype de son contexte d'utilisation, permettant aux designers de les réutiliser ou de les modifier indépendamment. Je décris comment Montage améliore le prototypage vidéo en combinant la vidéo avec des maquettes numériques animées et encourage l'exploration d'autres contextes d'utilisation tout en permettant le prototypage de styles d'interaction différents. La deuxième partie porte sur l’implémentation de prototypes interactifs. Les designers et développeurs professionnels ont souvent du mal à effectuer la transition de la représentation du design à son implémentation concrète. Avec N. Maudet, j'ai mené trois études sur la conception et l'implémentation d'interactions non-conventionnelles pour comprendre l'écart entre les processus, les outils et les représentations des designers et des développeurs. Nous avons découvert que les pratiques actuelles entraînent des redondances entre le travail des designers et celui des développeurs et des divergences entre le design et son implémentation. Nous identifions trois types de problèmes: l'omission de détails critiques, l'ignorance des cas extrêmes et la non prise en compte des limitations techniques. Je propose quatre principes de design pour créer des outils qui limitent ces problèmes. Ces principes sont utilisés pour créer Enact, un environnement interactif de prototypage d'interactions tactiles. Les résultats de deux études suggèrent que Enact aide les participants à détecter plus de cas extrêmes, augmente la participation des designers et offre de nouvelles possibilités de co-création. Ces trois outils de prototypage reposent sur les mêmes principes théoriques sous-jacent: réification, polymorphisme, réutilisation et substrats d'information. De même, les outils présentés mettent en œuvre une approche du prototypage que je nomme “Takeaway Prototyping” ou prototypage recyclable. Par contraste avec les prototypes jetables, les outils pour le prototypage recyclable permettent le design par énaction et réifient des artefacts de conception pour matérialiser la progression du design.

Prototyping is essential in any design process. During the early stages, designers rely on rapid prototyping to explore ideas. Current rapid prototyping tools and techniques focus on paper representations and their disposability. However, while these throwaway prototypes are quick to create they are difficult to iterate over. I argue that rapid prototyping tools can effectively support reusable as well as throwaway artifacts for sketching interaction in early-stage design. First, I investigate tools in the context of video prototyping. Designers experience two main barriers to use video in interaction design: the time to capture and edit the video artifacts. To aid during the capturing-phase of video prototyping I created VideoClipper. This tool embodies an integrated iterative design method that rewards discipline but permits flexibility for video prototyping. The tool provides a storyboard-style overview to organize multiple videos in story Lines. VideoClipper offers editable and reusable TitleCards, video capture for steady-state and rough stop-motion filming and the ability to recombine videos in new ways for redesign. I present informal user studies with interaction design students using VideoClipper in three design courses. Results suggest that participants spend less time capturing and editing in VideoClipper than with other video tools. However, many designers find tedious to create stop-motion videos for continuous interactions and to re-shoot clips as the design evolves. Participants continuously try to reduce re-shooting by reusing backgrounds or mixing different levels of fidelity. Inspired by this behavior, I created Montage, a prototyping tool for video prototyping that lets designers progressively augment paper prototypes with digital sketches, facilitating the creation, reuse and exploration of dynamic interactions. Montage uses chroma keying to decouple the prototyped interface from its context of use, letting designers reuse or change them independently. I describe how Montage enhances video prototyping by combining video with digital animated sketches, encourages the exploration of different contexts of use, and supports prototyping of different interaction styles. Second, I investigate how early designs start being implemented into interactive prototypes. Professional designers and developers often struggle when transitioning from the illustration of the design to the actual implementation of the system. In collaboration with Nolwenn Maudet, I conducted three studies that focused on the design and implementation of custom interactions to understand the mismatches between designers' and developers' processes, tools and representations. We find that current practices induce unnecessary rework and cause discrepancies between design and implementation and we identify three recurring types of breakdowns: omitting critical details, ignoring edge cases, and disregarding technical limitations. I propose four design principles to create tools that mitigate these problems: Provide multiple viewpoints, maintain a single source of truth, reveal the invisible and support design by enaction. We apply these principles to create Enact, an interactive live environment for prototyping touch-based interactions. We introduce two studies to assess Enact and to compare designer-developer collaboration with Enact versus current tools. Results suggest that Enact helps participants detect more edge cases, increases designers' participation and provides new opportunities for co-creation. These three prototyping tools rely on the same underlying theoretical principles: reification, polymorphism, reuse, and information substrates. Also, the presented tools outline a new prototyping approach that I call "Takeaway Prototyping". In contrast to throwaway prototypes, instead of emphasizing disposability, tools for "Takeaway Prototyping" support design by enaction and reify design artifacts to materialize the lessons learned.