User interface patterns in recommendation-empowered content intensive multimedia applications

Design Patterns (DPs) are acknowledged as powerful conceptual tools to improve design quality and to reduce time and cost of the development process by effect of the reuse of “good” design solutions. In many fields (e.g., software engineering, web engineering, interface design) patterns are widely used by practitioners and are also investigated from a research perspective. Still, they have been seldom explored in the arena of Recommender Systems (RSs). RSs provide suggestions (“recommendations”) for items that are likely to be appropriate for the user profile, and are increasingly adopted in content-intensive multimedia applications to complement traditional forms of search in large information spaces. This paper explores RSs through the lens of User Interface (UI) Design Patterns. We have performed a systematic analysis of 54 recommendation-empowered content-intensive multimedia applications, in order to: (i) discover the occurrences of existing domain independent UI patterns; (ii) identify frequently adopted UI solutions that are not modelled by existing patterns, and define a set of new UI patterns, some of which are specific of the interfaces for recommendation features while others can be useful also in a broader context. The results of our inspection have been discussed with and evaluated by a team of experts, leading to a consolidated set of 14 new patterns that are reported in the paper. Reusing pattern-based design solutions instead of building new solutions from scratch enables novice and expert designers to build good UIs for Recommendation-empowered content intensive multimedia applications more effectively, and ultimately can improve the UX experience in this class of systems. From a broader perspective, our work can stimulate future research bridging Recommender Systems, Web Engineering and Interface Design by means of Design Patterns, and highlights new research directions also discussed in the paper

GenomIUm: Un Método Basado en Patrones para el Diseño de Interfaces de Usuario de Acceso a Datos Genómicos

[ES] La explosión de datos genómicos derivada de la secuenciación del ADN ha motivado el desarrollo de herramientas software que, a más de proveer la capacidad de almacenamiento y rendimiento para procesar los datos genómicos, incorporen interfaces de usuario que permitan a los investigadores (genetistas, analistas de bioinformática, médicos, biólogos) acceder a los datos genómicos almacenados y obtener conocimiento de ellos. La facilidad con la que los investigadores acceden a los datos genómicos depende en cierta medida de la facilidad con la que la interfaz de usuario (IU) puede ser usada. Es por eso por lo que, diseñar IUs intuitivas, eficaces y fáciles de usar es en un requisito indispensable para desarrolladores y diseñadores de IUs inmersos en proyectos de software en este dominio. El "diseño conceptual" de la IU es un artefacto principal de la etapa de diseño del proceso de desarrollo de la IU, en el cual desarrolladores y diseñadores plasman las decisiones de diseño para obtener IUs intuitivas, efectivas y fáciles de usar. En el dominio genómico, producir el diseño conceptual no es trivial. Las pocas o inexistentes guías y soluciones de diseño para abordar las necesidades de interacción del dominio genómico hacen del diseño conceptual una tarea desafiante para desarrolladores y diseñadores, novatos o expertos. Con el fin de contribuir en el desarrollo de IUs que faciliten el acceso a los datos genómicos, diseñamos el método GenomIUm para cubrir el diseño conceptual de la IU. Para esto, GenomIUm, basado en el enfoque de diseño dirigido por patrones, define un proceso para diseñar el concepto de la IU y un catálogo de patrones de diseño que soporta a cada etapa del proceso. Así, GenomIUm guía al desarrollador de software en el diseño del concepto de la IU. Esta investigación está guiada por la metodología Design Science promulgada por Roel Wieringa. Su enfoque en proyectos de investigación en Ingeniería de Software y Sistemas de Información hace de Design Science una metodología idónea para nuestra investigación. La metodología provee el marco de trabajo, los métodos de investigación y directrices para llevar a cabo la investigación y su aplicación asegura el rigor y validez científica de nuestros resultados. Para facilidad del lector, el presente documento de Tesis está organizado siguiendo la estructura de la metodología: inicia con la investigación del problema, sigue con el diseño de la solución propuesta para solucionar el problema y termina con la validación de la solución propuesta. Para validar que GenomIUm cumple con los requisitos para los que fue diseñado, hemos ejecutado dos experimentos, uno por cada componente del método: los patrones y el proceso de diseño. El primer experimento evalúa el impacto producido por los patrones en la usabilidad de las IUs. El segundo experimento evalúa la percepción de desarrolladores de IUs respecto al uso del proceso de diseño. Adicionalmente, para ilustrar el uso de GenomIUm, describimos nuestra experiencia aplicando GenomIUm en un ambiente real. Como proyectos futuros, planteamos i) enriquecer el catálogo de patrones con nuevos patrones identificados en IUs de aplicaciones emergentes en el dominio genómico y ii) aplicar GenomIUm en diversos casos de estudio con el fin de generalizar los efectos positivos reportados en esta Tesis.[CA] L'Explosió de dades genòmiques derivada de la seqüenciació de l'ADN ha motivat el desenvolupament de ferramentes de programari que a més a més de proporcionar la capacitat d'emmagatzemament i rendiment per processar les dades genòmiques, incorporen interfícies d'usuari que permeten als investigadors (genetistes, analistes de bioinformàtica, metges, biòlegs) accedir a les dades genòmiques emmagatzemats i obtindré coneixement d'ells. La facilitat en la que els investigadors accedeixen a les dades genòmiques depèn de la facilitat en la que la IU puga ser utilitzada. Es per això pel que dissenyar IUs intuïtives, eficaces i senzilles d'utilitzar es converteix en un requisit indispensable per desenvolupadors i dissenyadors d'IUs immersos en projectes de programari en aquest domini. El "disseny conceptual" de la IU és un artefacte principal de l'etapa de disseny del procés de desenvolupament de la IU, en el qual desenvolupadors i dissenyadors plasmen les decisions de disseny per a obtindré una UI intuïtiva, efectiva i fàcil d'utilitzar. En el domini genòmic, produir el disseny conceptual no és trivial. Les poques o inexistents guies i solucions de disseny per abordar les necessitats d'interacció del domini genòmic fan del disseny conceptual una tasca desafiadora per als desenvolupadors i dissenyadors, novells o experts. Amb el fi de contribuir en el desenvolupament de IUs que faciliten l'accés a les dades genòmiques, nosaltres hem dissenyat el mètode GenomIUm per cobrir el disseny conceptual de la IU. Així, GenomIU, basat en l'enfocament de disseny dirigit per patrons, defineix un procés per a dissenyar el concepte de la IU i un catàleg de patrons de disseny que suporta a cadascuna de les etapes del procés. Així, GenomIUm guia al desenvolupador de programari en el disseny del concepte de la IU. Aquesta investigació està guiada per la metodologia Design Science promulgada per Roel Wieringa. La seua aplicació en projectes d'investigació en Enginyeria de Programari i Sistemes d'informació fa de Design Science una metodologia idònia per la nostra investigació. La metodologia proveeix el marc de treball, els mètodes d'investigació i directrius per portar a terme la investigació i la seua aplicació assegura el rigor i validesa científica dels nostres resultats. Per facilitar la lectura, el present document de tesi està organitzat seguint l'estructura de la metodologia: inicia amb la investigació del problema, segueix en el disseny de la solució proposta per solucionar el problema i termina amb la validació de la solució proposta. Per validar que GenomIUm compleix amb els requisits pels que va ser dissenyat, hem executat dos experiments, un per cada component del mètode: els patrons i el procés de disseny. El primer experiment avalua l'impacte produït pels patrons en la usabilitat de les IUs. El segon experiment avalua la percepció dels desenvolupadors de IUs respecte al ús del procés de disseny. Addicionalment, per il·lustrar l'ús de GenomIUm, descrivim nostra experiència aplicant GenomIUm en un ambient real. Com projectes futurs, plantegem i) enriquir el catàleg de patrons amb nous patrons identificats en IUs d'aplicacions genòmic emergents i ii) aplicar GenomUIm en diversos casos d'estudi per generalitzar els efectes positius reportats en aquesta tesi.[EN] The explosion of genomic data derived from DNA sequencing has motivated the development of software tools that, in addition to providing the storage and performance to process genomic data, incorporate user interfaces that allow researchers (i.e., geneticists, analysts of bioinformatics, doctors, biologists) access to the stored genomic data and get knowledge of them. The ease with which researchers access genomic data depends to some extent on the ease with which the user interface (UI) can be used. That is why, designing intuitive, effective and easy-to-use UIs becomes an indispensable requirement for developers and designers who are involved in software projects in this domain. The "conceptual design" of the UI is a main design artifact of the UI development process, in which developers and designers capture the design decisions to obtain intuitive, effective and easy-to-use UIs. In the genomic domain, producing the conceptual design is not trivial. The few or nonexistent guides and design solutions to address the interaction needs in the genomic domain make the conceptual design a challenging task for developers and designers, novice or experts. In order to contribute to the development of UIs that facilitate access to genomic data, we design the GenomIUm method to cover the conceptual design of the UI. To do that, GenomIUm, based on the Pattern-Oriented Design approach, defines a process to design the UI concept and a catalog of design patterns that supports each stage of the process. Thus, GenomIUm guides the software developer in the design of the UI concept. This research is guided by the Design Science methodology enacted by Roel Wieringa. Its focus on Software Engineering and Information Systems research projects makes Design Science an ideal methodology for our research. The methodology provides the methodological framework, research methods, and guidelines for carrying out our research. The application of Design Science ensures the rigor and scientific validity of our results. For the convenience of the reader, this thesis document is organized according to the methodology structure. First, we describe the problem investigation. Then, we describe the design of the proposed solution to the problem. Finally, we describe the validation of the proposed solution. To validate that GenomIUm meets the requirements for which it was designed, we executed two experiments, one for each GenomIUm component: the patterns and the design process. The first experiment evaluates the impact produced by the patterns on the usability of the UIs. The second experiment assesses the perception of UI developers regarding the use of the design process. Additionally, to illustrate the use of GenomIUm, we describe our experience applying GenomIUm in a real environment. As future projects, we propose i) to enrich the catalog of patterns with new patterns identified in UIs of emerging applications in the genomic domain and ii) apply GenomIUm in various case studies in order to generalize the positive effects reported in this thesis.A la SENESCYT y Escuela Politécnica Nacional por la oportunidad y apoyo económico para cumplir este objetivo.Íñiguez Jarrín, CE. (2019). GenomIUm: Un Método Basado en Patrones para el Diseño de Interfaces de Usuario de Acceso a Datos Genómicos [Tesis doctoral no publicada]. Universitat Politècnica de València. https://doi.org/10.4995/Thesis/10251/13581

Interaction Design Patterns und CSCL-Scripts für Videolernumgebungen

In den letzten Jahren haben Lernvideos im Bereich des informellen und formellen Lernens an Bedeutung gewonnen. Inwieweit Lernende bei der Nutzung von Videos unterstützt werden und Lehrende didaktische Szenarien umsetzen können, hängt jedoch von der eingesetzten Videolernumgebung ab. Es ist Anliegen der vorliegende Arbeit, Prinzipien des User Interface Designs sowie Komponenten und Mechanismen videobasierter Lehr-Lern-Szenarien in Bezug auf Videolernumgebungen zu identifizieren, zu beschreiben und technisch zu realisieren. Das Ziel besteht darin, Gestaltungsprinzipien in Form von Interaction Design Patterns zu erarbeiten und computergestützte videobasierte Lehr-Lern-Szenarien mit Hilfe von CSCL-Scripts durch eine geeignete Spezifikation und Formalisierung zu realisieren. Für die Erarbeitung der Interaction Design Patterns wurden 121 Videolernumgebungen hinsichtlich 50 Kategorien in einer Inhaltsanalyse empirisch untersucht und dokumentiert. Unter Berücksichtigung ähnlicher Patterns aus thematisch verwandten Pattern Languages und den Erfahrungen aus der Implementierung und dem Einsatz von Videolernumgebungen entstanden 45 Interaction Design Patterns für verbreitete Lösungen für wiederkehrende Probleme bei der Gestaltung und Entwicklung von Videolernumgebungen. Diese Patterns wurden auf Pattern Konferenzen diskutiert und im Anschluss evaluiert sowie bei der Konzeption, Entwicklung und Bewertung mehrerer Videolernumgebungen angewendet. Zudem wurde das Software Framework VI-TWO vorgestellt, mit dem sich fast alle Patterns auf einfache Weise in Web-Anwendungen realisieren lassen. Zur Spezifikation videobasierter CSCL-Scripts wurden existierende videobasierte und nicht videobasierte Scripts analysiert. Im Ergebnis unterschieden sich videobasierte CSCL-Scripts von allgemeinen CSCL-Scripts vor allem hinsichtlich der mit dem Video verknüpften oder darin verankerten Aufgaben und Aktivitäten. Videos werden dabei nicht als monolithische Einheiten, sondern als zeitkontinuierliche Medien betrachtet, in denen weitere Informationen zeitgenau verankert und Lernaktivitäten stattfinden können. Außerdem ließen sich drei Typen videobasierter CSCL-Scripts identifizieren: (1) Scripts zur Analyse und Diskussion von Videoinhalten, (2) Peer Annotation Scripts einschließlich dem Peer Assessment und (3) Jigsaw-Scripts, die das problembasierte Lernen mit Hilfe von Videos ermöglichen. Unabhängig davon variiert die Komplexität der Scripts auf drei Stufen: (1) sofern voneinander abgegrenzte zeitliche Phasen von Lernaktivitäten bestehen, (2) wenn darüber hinaus die Teilnehmer innerhalb von Gruppen Aufgaben bearbeiten (intra-group) und (3) falls außerdem Aufgaben auch gruppenübergreifend bearbeitet werden (inter-group). Auf Grundlage der Spezifikation konnte ein Datenmodell und ein Modell für die nutzerseitige Modellierung von Scripts verschiedener Komplexitätsstufen sowie Typen entwickelt und in dem CSCL-System VI-LAB realisiert werden. Diese Arbeit leistet in zweifacher Hinsicht einen Beitrag zur Forschung im Bereich E-Learning. Zum einen beschreiben die Interaction Design Patterns wiederkehrende User Interface Lösungen und stellen somit ein Hilfsmittel für Designer, Software Entwickler und Lehrende bei der Gestaltung und Implementierung von Videolernumgebungen dar. Zum anderen wurden durch die Spezifikation und softwareseitige Umsetzung videobasierter CSCL-Scripts Voraussetzungen geschaffen, die den praktischen Einsatz und die weitere Untersuchung des kollaborativen Lernens mit Videos ermöglichen.:1 Einführung 19 1.1 Motivation 19 1.2 Herausforderungen und Forschungsfragen 20 1.2.1 Interaction Design Patterns 20 1.2.2 Videobasierte CSCL-Scripts 22 1.3 Kapitelübersicht und Forschungsmethoden 25 1.3.1 Kapitelübersicht 25 1.3.2 Forschungsmethoden je Kapitel 27 2 Lernen mit Videos 29 2.1 Terminologie, Einsatzfelder und Potentiale von Lernvideos 30 2.1.1 Begriffsbestimmung 30 2.1.2 Einsatzfelder und Szenarien für das Lernen mit Videos 32 2.1.3 Potentiale des Medium Video 34 2.2 Videos im Kontext kognitiver Lerntheorien 36 2.2.1 Theorie der kognitiven Last 36 2.2.2 Kognitive Theorie des Lernens mit Multimedia 38 2.3 Interaktivität audiovisueller Lernmedien 44 2.4 Lernformen 48 2.4.1 Rezeptives Lernen 49 2.4.2 Selbstgesteuertes Lernen 50 2.4.3 Kollaboratives Lernen 52 2.5 Zusammenfassung 56 3 Videolernumgebungen und Hypervideos 59 3.1 Terminologie und Modelle 60 3.1.1 Videolernumgebung 60 3.1.2 Terminologie: Video, Hypervideo und interaktives Video 62 3.1.3 Spezifikationen für Hypervideo-Dokumente 65 3.1.4 Modelle des zeitlichen Layouts 66 3.2 Human Video Interface 69 3.2.1 Gestaltungsraum von Hypervideos 70 3.2.2 Usability-Herausforderungen von Human Video Interfaces 74 3.3 Technische Herausforderungen 76 3.3.1 Download und Cache-Management / Echte Nicht-Linearität 77 3.3.2 Synchronisierung von Video und Annotationen 78 3.3.3 Adressierung und Abruf von Medienfragmenten 78 3.3.4 Deklarative Ansätze der Repräsentation von Multimedia 80 3.4 Produktion und Integration in Lernumgebungen 81 3.4.1 Produktion: Vorgehensweisen und Paradigmen 82 3.4.2 Integration in Lernumgebungen und Zusammenspiel mit Diensten im WWW 85 3.5 Zusammenfassung 87 4 Interaction Design Patterns für Videolernumgebungen 91 4.1 Einführung in Design Patterns 92 4.1.1 Design Patterns 95 4.1.2 Mustersprache 101 4.1.3 Verwandte Ansätze im Interaction Design 104 4.1.4 Verwandte Pattern Languages 106 4.2 Systematische Elaboration von Design Patterns 109 4.2.1 Stand der Forschung bzgldem Pattern Mining 110 4.2.2 Inhaltsanalyse von Videolernumgebungen 112 4.2.3 Analyse und Integration ähnlicher Muster bzwMustersprachen 128 4.2.4 Verfassen sowie Revision und Evaluation der Muster 130 4.2.5 Konstruktion der Pattern Language 135 4.3 Pattern Language für Videolernumgebungen 140 4.3.1 Struktur der Pattern Language 140 4.3.2 Angrenzende Mustersprachen 144 4.3.3 Repräsentation in einer Wissensbasis 145 4.3.4 Anwendungs- und Einsatzszenarien 148 4.3.5 Exemplarische Interaction Design Patterns 151 4.4 Zusammenfassung 168 5 Videobasierte CSCL-Scripts 171 5.1 Einführung 172 5.1.1 Hintergrund zu Scripts und CSCL-Scripts 172 5.1.2 Definition videobasierter CSCL-Scripts 175 5.1.3 Mehrwert und Potentiale 177 5.1.4 Typisierung videobasierter CSCL-Scripts 178 5.2 Spezifikation videobasierter CSCL-Scripts 184 5.2.1 Script-Komponenten 185 5.2.2 Script-Mechanismen 194 5.3 Modellierung von CSCL-Scripts 197 5.3.1 Komplexitätslevel 200 5.3.2 Verwandte Systeme und Ansätze zur Modellierung von Scripts 201 5.3.3 Konzept für eine formale Repräsentation 206 5.3.4 Konzept zur Modellierung im User Interface 209 5.4 Zusammenfassung 212 6 Realisierung von Patterns und Scripts 215 6.1 VI-TWO: JavaScript Framework für interaktive Videos 216 6.1.1 Anforderungen 217 6.1.2 Verwandte Arbeiten 219 6.1.3 Architektur von VI-TWO 222 6.1.4 Videoplayer 224 6.1.5 Videoannotationen 225 6.1.6 Makrointeraktivität in Kollektionen von Videos 229 6.1.7 Autorenwerkzeuge 232 6.2 VI-LAB: CSCL-System für videobasierte CSCL-Scripts 235 6.2.1 Anforderungen 236 6.2.2 Architektur von VI-LAB 238 6.2.3 Modellierung videobasierter CSCL-Scripts 241 6.2.4 Monitoring 244 6.3 Anwendungsbeispiele für VI-TWO und VI-LAB 246 6.3.1 Vi-Wiki 246 6.3.2 IWRM education 247 6.3.3 VI-LAB (Version 1) auf Basis von Wordpress 247 6.3.4 VI-LAB (Version 2) auf Basis von node.js 248 6.3.5 Theresienstadt explained 249 6.4 Zusammenfassung 252 7 Schlussbetrachtung 255 7.1 Beitrag der Arbeit zur Forschung 255 7.2 Kritische Würdigung 256 7.3 Ausblick 25