TY - BOOK A1 - Freund, Rieke A1 - Rätsch, Jan Philip A1 - Hradilak, Franziska A1 - Vidic, Benedikt A1 - Heß, Oliver A1 - Lißner, Nils A1 - Wölert, Hendrik A1 - Lincke, Jens A1 - Beckmann, Tom A1 - Hirschfeld, Robert T1 - Implementing a crowd-sourced picture archive for Bad Harzburg N2 - Pictures are a medium that helps make the past tangible and preserve memories. Without context, they are not able to do so. Pictures are brought to life by their associated stories. However, the older pictures become, the fewer contemporary witnesses can tell these stories. Especially for large, analog picture archives, knowledge and memories are spread over many people. This creates several challenges: First, the pictures must be digitized to save them from decaying and make them available to the public. Since a simple listing of all the pictures is confusing, the pictures should be structured accessibly. Second, known information that makes the stories vivid needs to be added to the pictures. Users should get the opportunity to contribute their knowledge and memories. To make this usable for all interested parties, even for older, less technophile generations, the interface should be intuitive and error-tolerant. The resulting requirements are not covered in their entirety by any existing software solution without losing the intuitive interface or the scalability of the system. Therefore, we have developed our digital picture archive within the scope of a bachelor project in cooperation with the Bad Harzburg-Stiftung. For the implementation of this web application, we use the UI framework React in the frontend, which communicates via a GraphQL interface with the Content Management System Strapi in the backend. The use of this system enables our project partner to create an efficient process from scanning analog pictures to presenting them to visitors in an organized and annotated way. To customize the solution for both picture delivery and information contribution for our target group, we designed prototypes and evaluated them with people from Bad Harzburg. This helped us gain valuable insights into our system’s usability and future challenges as well as requirements. Our web application is already being used daily by our project partner. During the project, we still came up with numerous ideas for additional features to further support the exchange of knowledge. N2 - Bilder können dabei helfen, die Vergangenheit greifbar zu machen und Erinnerungen zu bewahren, doch alleinstehende Bilder ohne Kontext erreichen das nur schwer. Der große Wert besteht in den Geschichten, die mit den Bildern verbunden sind. Je älter die Bilder jedoch werden, desto weniger Zeitzeugen können von diesen Geschichten berichten. Besonders für große analoge Bildarchive, bei denen sich das Wissen und die Erinnerungen auf viele Personen verteilen, entstehen dadurch verschiedene Herausforderungen: Zunächst müssen die Bilder digitalisiert werden, um sie vor dem Zerfall zu schützen und um sie der Öffentlichkeit zugänglich machen zu können. Da eine einfache Aufreihung aller Bilder unübersichtlich ist, sollten die Bilder in eine zugängliche Struktur gebracht werden. Des Weiteren müssen zu den Bildern bekannte Informationen, aus denen ihre Geschichten erfahrbar werden, hinzugefügt werden. Nutzende sollen die Möglichkeit haben, eigenes Wissen und Erinnerungen beizutragen. Um dies für alle Interessierten, auch für ältere, evtl. wenig technikaffine Personen, nutzbar zu machen, sollte die Oberfläche eine intuitive und fehlertolerante Nutzung ermöglichen. Die sich daraus ergebenden Anforderungen werden von keiner existierenden Softwarelösung im Gesamten abgedeckt, ohne die intuitive Oberfläche oder die Skalierbarkeit des Systems zu verlieren. Daher haben wir im Rahmen eines Bachelorprojekts in Zusammenarbeit mit der Bad Harzburg-Stiftung ein eigenes digitales Bildarchiv entwickelt. Für die Umsetzung dieser Webapplikation nutzen wir das UI-Framework React im Frontend, welches über eine GraphQL-Schnittstelle mit dem Content Management System Strapi im Backend kommuniziert. Die Nutzung dieses Systems ermöglicht unserem Projektpartner einen effizienten Prozess vom Scannen der analogen Bilder bis zum geordneten und annotierten Darstellen für Besuchende. Um die Lösung sowohl für das Bereitstellen der Bilder als auch für das Beitragen von Informationen auf unsere Zielgruppe zuzuschneiden, haben wir Prototypen entworfen und mit Menschen aus Bad Harzburg getestet, um ihre Eindrücke auszuwerten. Mit diesen konnten wir wertvolle Erkenntnisse über die Nutzbarkeit und noch offene Herausforderungen und Anforderungen gewinnen. Unsere Webanwendung ist bei unserem Projektpartner bereits im täglichen Einsatz. Trotzdem haben wir während des Projekts noch zahlreiche Ideen für zusätzliche Funktionen erarbeitet, um den Wissensaustausch weiter zu fördern. T3 - Technische Berichte des Hasso-Plattner-Instituts für Digital Engineering an der Universität Potsdam - 149 KW - digital picture archive KW - analog-to-digital conversion KW - user-generated content KW - intuitive interfaces KW - digitales Bildarchiv KW - Analog-zu-Digital-Konvertierung KW - benutzergenerierte Inhalte KW - intuitive Benutzeroberflächen Y1 - 2022 U6 - http://nbn-resolving.de/urn/resolver.pl?urn:nbn:de:kobv:517-opus4-560291 SN - 978-3-86956-545-3 SN - 1613-5652 SN - 2191-1665 IS - 149 PB - Universitätsverlag Potsdam CY - Potsdam ER - TY - BOOK A1 - Klinke, Paula A1 - Verhoeven, Silvan A1 - Roth, Felix A1 - Hagemann, Linus A1 - Alnawa, Tarik A1 - Lincke, Jens A1 - Rein, Patrick A1 - Hirschfeld, Robert T1 - Tool support for collaborative creation of interactive storytelling media N2 - Scrollytellings are an innovative form of web content. Combining the benefits of books, images, movies, and video games, they are a tool to tell compelling stories and provide excellent learning opportunities. Due to their multi-modality, creating high-quality scrollytellings is not an easy task. Different professions, such as content designers, graphics designers, and developers, need to collaborate to get the best out of the possibilities the scrollytelling format provides. Collaboration unlocks great potential. However, content designers cannot create scrollytellings directly and always need to consult with developers to implement their vision. This can result in misunderstandings. Often, the resulting scrollytelling will not match the designer’s vision sufficiently, causing unnecessary iterations. Our project partner Typeshift specializes in the creation of individualized scrollytellings for their clients. Examined existing solutions for authoring interactive content are not optimally suited for creating highly customized scrollytellings while still being able to manipulate all their elements programmatically. Based on their experience and expertise, we developed an editor to author scrollytellings in the lively.next live-programming environment. In this environment, a graphical user interface for content design is combined with powerful possibilities for programming behavior with the morphic system. The editor allows content designers to take on large parts of the creation process of scrollytellings on their own, such as creating the visible elements, animating content, and fine-tuning the scrollytelling. Hence, developers can focus on interactive elements such as simulations and games. Together with Typeshift, we evaluated the tool by recreating an existing scrollytelling and identified possible future enhancements. Our editor streamlines the creation process of scrollytellings. Content designers and developers can now both work on the same scrollytelling. Due to the editor inside of the lively.next environment, they can both work with a set of tools familiar to them and their traits. Thus, we mitigate unnecessary iterations and misunderstandings by enabling content designers to realize large parts of their vision of a scrollytelling on their own. Developers can add advanced and individual behavior. Thus, developers and content designers benefit from a clearer distribution of tasks while keeping the benefits of collaboration. N2 - Scrollytellings sind innovative Webinhalte. Indem sie die Vorteile von Büchern, Bildern, Filmen und Videospielen vereinen, sind sie ein Werkzeug um Geschichten fesselnd zu erzählen und Lehrinhalte besonders effektiv zu vermitteln. Die Erstellung von Scrollytellings ist aufgrund ihrer Multimodalität keine einfache Aufgabe. Verschiedene Berufszweige wie Content-Designer:innen, Grafikdesigner:innen und Entwickler:innen müssen zusammenarbeiten, um das volle Potential des Scrollytelingformats auszuschöpfen. Jedoch können ContentDesigner:innen Scrollytellings nicht direkt selbst erstellen, sondern müssen ihre Vision stets gemeinsam mit Entwickler:innen umsetzen. Dabei können unnötige Iterationen über das Scrollytelling auftreten, wenn dieses den Visionen der Content-Designer:innen noch nicht entspricht. Außerdem können Missverständnisse entstehen. Unser Projektpartner Typeshift hat sich auf die Erstellung von, für seine Kund:innen individualisierten, Scrollytellings spezialisiert. Aufbauend auf Typeshifts Erfahrungen und Expertise haben wir einen Editor entwickelt, um Scrollytellings in der Live-Programmierumgebung lively.next zu erstellen. In lively.next wird eine graphische Oberfläche für die Erstellung von Inhalten mit weitreichenden Möglichkeiten zur Programmierung von Verhalten durch das Morphic-System kombiniert. Der Editor erlaubt es Content-Designer:innen eigenständig große Teile des Erstellungsprozesses von Scrollytellings durchzuführen, zum Beispiel das Erzeugen visueller Elemente, deren Animation sowie die Feinjustierung des gesamten Scrollytellings. So können Entwickler:innen sich auf die Erstellung von komplexen interaktiven Elementen, wie Simulationen oder Spiele, konzentrieren. Zusammen mit Typeshift haben wir die Nutzbarkeit unseres Editors durch die Nachbildung eines bereits existierenden Scrollytellings evaluiert und mögliche Verbesserungen identifiziert. Unser Editor vereinfacht den Erstellungsprozess von Scrollytellings. Content Designer:innen und Entwickler:innen können jetzt beide an demselben Scrollytelling arbeiten. Durch den Editor, der in lively.next integriert ist, können beide Parteien mit den ihnen bekannten und vertrauten Werkzeugen arbeiten. Durch den Editor verringern wir unnötige Iterationen und Missverständnisse und erlauben Content-Designer:innen große Teile ihrer Vision eines Scrollytellings eigenständig umzusetzen. Entwickler:innen können zusätzliches, individuelles Verhalten hinzufügen. So profitieren Entwickler:innen und Content-Designer:innen von einer besseren Aufgabenteilung, während die Vorteile von Zusammenarbeit bestehen bleiben. T3 - Technische Berichte des Hasso-Plattner-Instituts für Digital Engineering an der Universität Potsdam - 141 KW - scrollytelling KW - interactive media KW - web-based development KW - Lively Kernel KW - Scrollytelling KW - interaktive Medien KW - webbasierte Entwicklung KW - Lively Kernel Y1 - 2022 U6 - http://nbn-resolving.de/urn/resolver.pl?urn:nbn:de:kobv:517-opus4-518570 SN - 978-3-86956-521-7 SN - 1613-5652 SN - 2191-1665 IS - 141 PB - Universitätsverlag Potsdam CY - Potsdam ER -