This thesis presents the design and development of a web-based platform intended to streamline the public sector funding process for startups by employing a matching algorithm. The platform was developed as part of a Bachelor's program in Computer Engineering and aims to address the inefficiencies and complexities currently impeding startup access to vital funding sources. Utilizing the MERN technology stack (MongoDB, Express.js, React, and Node.js), the project integrates web-based technologies to enhance user experience and ensure robust security measures aligning with GDPR standards. The methodology adopted includes agile development practices to facilitate iterative testing and improvements. The system's use of data from public funding webpages, combined with API integration and web scraping techniques, ensures a rich database of funding opportunities tailored to startups' diverse needs. This thesis serves as a practical solution for startups striving to navigate the complex landscape of public sector funding. / Den här uppsatsen presenterar designen och utvecklingen av en webbaserad plattform avsedd att effektivisera processen för offentlig finansiering till startups genom att använda en matchningsalgoritm. Plattformen, som utvecklats är en del av ett högskoleingenjörsprogram inom datateknik och syftar till att adressera de ineffektiviteter och komplexiteter som för närvarande hindrar startups från att få tillgång till nödvändiga finansieringskällor. Genom att använda MERN-teknikstacken (MongoDB, Express.js, React och Node.js) integrerar projektet webbteknologier för att förbättra användarupplevelsen och säkerställa robusta säkerhetsåtgärder i linje med GDPR-standarder. Den antagna metoden inkluderar agila utvecklingspraxis för att underlätta iterativ testning och förbättringar. Systemets användning av data från offentliga finansieringswebbplatser, kombinerat med API-integration och webbskrapningstekniker, säkerställer en rik databas med finansieringsmöjligheter anpassade till startups mångfaldiga behov. Denna avhandling fungerar som en praktisk lösning för startups som strävar efter att navigera i det komplexa landskapet för offentlig sektorfinansiering.

In hope of lessening the inequal division between the amount of women and men studying and working in technical fields a project to create an inspirational platform has been initiated by the organisation Pepp. By the end of the first stage of the project a webpage has been created with frontend programming. This webpage contains several imaginary person portraits of imaginary individuals studying or working in technical fields. JavaScript filter functions have been created in order to filter between these individuals. All the necessary data for the portraits are collected in a database in form of an array in JavaScript. User tests were conducted where seven separate subjects were allowed to test the finished person portrait webpage. In the future the website will be improved and expanded with several webpages. Portraits of real individuals will also be collected and replace the imaginary individuals on the webpage.

Cette recherche menée au sein du pôle de recherche et développement de la société Perfect Memory s'intéresse à l'accompagnement de la mémoire familiale via un dispositif technique, interrogé par le prisme des sciences de l'information et de la communication. Elle propose la construction d'une approche d'éditorialisation du document numérique permettant à chacun de s'approprier son patrimoine culturel au travers de l'utilisation du dispositif technique co-construit, l'application Web Famille TM. L'interrogation du milieu socio-économique de la préservation et la valorisation du patrimoine culturel du particulier, auquel Perfect Memory appartient, nous amène à nous interroger sur les enjeux d'un rapprochement entre les notions de « numérique » et de « mémoire ». Un cadre théorique est ainsi construit, le document numérique est appréhendé comme support d'un exercice de la mémoire, permis par la médiation du dispositif technique. L'éditorialisation, en tant qu'ensemble d'opérations réalisées sur le document numérique par l'intermédiaire du dispositif technique, est placée au cœur de notre problématique axée sur les modalités d'accompagnement des pratiques mémorielles via le service Famille TM. La construction de notre approche d'éditorialisation est séparée en deux moments. Dans un premier temps, un corpus de documents numériques - productions familiales préservées par différentes institutions patrimoniales - est interrogé par une méthodologie sémiotique afin d'extraire les éléments saillants invariants à leur interprétation, que nous rassemblons sous l'appellation de marqueurs de mémoire. Dans un second temps, les catégories de marqueurs construits sont transcrites en recommandations éditoriales et ergonomiques destinées au dispositif technique Famille TM. Articulé jusqu'ici autour d'un axe unique - la documentarisation de l'archive -, le dispositif est enrichi de deux nouveaux modes - cinématographique et privé -, constituant autant de points d'entrée supplémentaires dans le document versé par l'utilisateur sur le service. L'approche d'éditorialisation du document est ainsi décomposée en trois modes, comportant chacun différents scénarii, articulation de fonctionnalités et d'une expérience utilisateur spécifiques, construits pour le service Famille TM. / This research project was made at the R&D department at Perfect Memory and focus on how to support family memory via a technological artifact. We question the artifact through the prism of information and communication sciences. The project offers to build a new approach, that of the editorialization of digital documents, enabling each user to rediscover their cultural heritage. This can be done by means of Famille TM, a co-built Web app. Following a study of the cultural heritage market as applied to private individuals, to whom Perfect Memory belongs, we proceed to a cross analysis of two concepts : "Digital" and "Memory". Starting from these, we built a theoretical framework in which we consider digital documents as a base for memory training. The technological artifact allows such training through a mediation process. Editorialization, as a set of processes made on the digital document through a technological artifact, appears as central to our concern: to design ways to support memory habits through Famille TM. We divide the construction of an editorialization approach into two steps. First, we build a corpus of digital documents - home movies - from various cultural heritage organizations. Then we interrogate the corpus through a semiotic methodology in order to gather salient and invariant elements in each interpretation. We name them memory markers. In a second step, we transcribe the markers categorization into editorial and ergonomic recommendations for Famille TM. Until today, the technological artifact consisted in one single mode: the documentation of archives. We introduce two extra modes: the cinematographic experience and the private experience. Each mode provides the user with an original entry point into documents uploaded on the app. To summarize our editorialization approach, we implement three modes into Famille TM and for each of them we design several scenarios made up of specific features and user experiences.

Benutzungsschnittstellen (UIs) dienen in der Domäne der industriellen Automatisierungstechnik der Bedienung und Beobachtung technischer Prozesse. Das sogenannte Model-based User Interface Development (MBUID) stellt ein vielversprechendes Konzept zur automatischen Erzeugung solcher UIs dar. Allerdings erfordert die Umsetzung dieses Konzeptes für einen spezifischen Anwendungsfall jeweils die Entwicklung einer oder mehrerer Modell-zu-Modell-Transformationen (M2M). Hierbei handelt es sich unter Verwendung aktueller Ansätze für Transformations-Frameworks um einen aufwändigen, fehleranfälligen und daher kostenintensiven Prozess. Dies gilt vor allem für Entwickler ohne tiefgreifendes Wissen über modellbasierte Technologien und kann unter Umständen sogar die durch die MBUID propagierten Vorteile aufwiegen. Zur Erleichterung des Prozesses der Entwicklung von Modelltransformationen schlägt diese Arbeit eine spezielle Methodik sowie deren prototypische Implementierung in Form des PAMTraM-Frameworks vor. Die Methodik greift dabei die speziellen Rahmenbedingungen bei der UI-Entwicklung in der Domäne der industriellen Automatisierungstechnik auf und basiert auf drei Hauptkonzepten: Die Basis stellt die Konfiguration von M2M-Transformationen in mehrdeutigen, bedingten Abbildungsmodellen dar. Diese Abbildungsmodelle beschreiben dabei lediglich Zuordnungen zwischen Elementen der Quell- und Ziel-UI-Beschreibungssprache einer durchzuführenden Transformation. Im Gegensatz zu existierenden Ansätzen erlaubt die entwickelte Methodik die explizite Berücksichtigung mehrdeutiger Abbildungen, die in der Domäne der UI-Entwicklung häufig auftreten. Darüber hinaus können explizite Kontextbedingungen formuliert werden, die die Notwendigkeit der Anpassung bzw. Neu-Erstellung eines Abbildungsmodells bei Vorliegen eines geänderten Nutzungskontextes (z.B. einer neuen Hardware-Plattform) verhindern. Konkrete Transformationen für ein oder mehrere Quell- und Kontextmodelle können anschließend auf Basis eines konfigurierten Abbildungsmodells durchgeführt werden. Hierzu wird ein spezieller generischer Transformations-Algorithmus vorgestellt. Dieser ist in der Lage, basierend auf einer selbstständigen Analyse der Ziel-UI-Beschreibungssprache auch unvollständige Abbildungsmodelle auszuführen. Hierdurch muss der Entwickler eines Abbildungsmodells weniger Informationen in dieses integrieren. Allerdings führt dieses Vorgehen auch dazu, dass im Rahmen der Durchführung einer Transformation an verschiedenen Stellen Mehrdeutigkeiten auftreten können. Zur Auflösung dieser Mehrdeutigkeiten stellt diese Arbeit unterschiedliche Strategien wie z.B. die Konsultation des Nutzers vor. Das dritte Hauptkonzept wird durch zwei Ansätze für sog. Higher-Order Transformations gebildet. Diese ermöglichen die teilweise semi-automatische Erstellung bzw. Vervollständigung von Abbildungsmodellen u.a. im Rahmen iterativer Entwicklungsprozesse. Dadurch wird die Entwicklung von Abbildungsmodellen weiter vereinfacht und die während einer Transformation auftretenden Mehrdeutigkeiten können schrittweise soweit notwendig reduziert werden. Ein Nachweis über die Funktionalität der entwickelten Methodik sowie deren prototypischer Implementierung erfolgt zum einen anhand repräsentativer Fallstudien aus der betrachteten Domäne und zum anderen auf Basis einer Analyse hinsichtlich allgemeiner Kriterien zur Bewertung von Transformations-Frameworks. Eine abschließende Bewertung zeigt, dass die entwickelte Methodik die speziellen Anforderungen in Bezug auf die UI-Entwicklung in der Domäne der industriellen Automatisierungstechnik erfüllt und zur Vereinfachung der Entwicklung von Modelltransformationen geeignet ist. / User Interfaces (UIs) in the domain of industrial automation serve the operation and monitoring of technical processes. The Model-based User Interface Development (MBUID) represents a promising concept for the automatic generation of such UIs. However, the realization of this concept for a specific use case requires the development of one or multiple model-to-model (M2M) transformations. Using existing transformation frameworks, this represents a complex, error-prone, and thus costly task. This applies especially to developers without deep knowledge of model-based technologies and can in some circumstances even cancel out the advantages promised by MBUID. In order to simplify the process of developing model transformations, this thesis proposes a specific methodology as well as its prototypic implementation by means of the PAMTraM framework. This methodology addresses the special underlying conditions of UI development in the domain of industrial automation and is based on three main concepts: The basis is formed by the configuration of M2M transformations in ambiguous, conditional mapping models. These only capture mappings between elements of the source and the target UI modeling language of a transformation. In contrast to existing approaches, the developed methodology explicitly takes into account the possibility for ambiguous mappings that are common in the domain of UI development. Furthermore, developers can specify explicit context conditions that prevent the necessity of a modification or redevelopment of a mapping model in case of a changed context of use (e.g. a new hardware platform). Individual transformations for one or multiple source and context models can be executed based on a configured mapping model. Therefore, a special generic transformation algorithm is presented. By autonomously analyzing the target UI modeling language, this algorithm is even capable of executing incomplete mapping models. As a result of this, the developer has to integrate less information in the mapping model. However, due to this approach, ambiguities may occur at various points during the course of a transformation. In order to be able to resolve these ambiguities, various strategies like the consultation of the user are presented in this thesis. The third main concept is formed by two approaches for higher-order transformations that allow the partial semi-automatic generation resp. completion of mapping models among others in the context of iterative development processes. This further simplifies the development of mapping models and allows for the step-wise reduction of occurring ambiguities as far as necessary. Representative case studies from the considered domain as well as an analysis with regard to general criteria for the assessment of transformation frameworks prove the functionality of the proposed methodology and its prototypical implementation. A concluding evaluation shows that the developed methodology satisfies the specific requirements concerning UI development in the domain of industrial automation and is suited to simplify the development of model transformations.

Purpose – The purpose of this report is to find out which frameworks and methods are most popular and most widely used, as well as web developers' views on the hamburgermenu. Method – In order to answer the questions in our report we used the methods quantitative statistical processing, quantitative analysis of data collected via survey and qualitative interviews with web developers. The study was conducted to find out which frameworks and methods are most popular and used most, as well as how web developers look at the hamburgermenu. This was done by analyzing the popularity and usage of different frameworks as well as interviewing web developers who work with it daily. Findings – The results of the report are based on the data collected through the processing of the statistics, the analysis of the survey, and the interviews performed. The result shows which frameworks are most popular and those that are most used. The following list shows the ranking: Most popular: Bootstrap Semantic UI Materialize Material Design Lite Foundation Most used: Bootstrap Foundation Materialize Material Design Lite Semantic UI The results of the interviews showed that most of the web developers interviewed used a framework when they created a website, either an existing or one of their own. It was also a practice to use the same framework in the company, although the way it was used was different from developer to developer. All developers had a mobile-first thought in mind, although it was not always a priority. It was also found in the study that everyone had a basic idea behind the choice of framework, but only one who had performed a study on which one would suit them best. All web developers interviewed thought that the hamburger menu was boring and bad from a user experience perspective. But everyone also agreed that because it is so widely used and has been for a couple of years, users have learned what it means and therefore fulfills its purpose. Implications – The use of the results is primarily linked to individuals or companies that work with web development, but can also be used by private individuals. For the report's primary target group, the results will give an increased understanding of the most used framework and an increased understanding of why these are used. Private individuals can use the result in the same way. Limitations – The limitations we receive in this study are that we cannot make any conclusions about companies and web developers in other parts of the country using the same framework or methods as the local ones we interviewed. Nor can we make any conclusions about why Bootstrap is the most popular and most widely used framework. We can only speculate why with the empirical we gathered through the interviews. A major limitation is also the lack of interviews when we only got answers from 6 of the 10 companies we contacted, of whom 4 would like to participate in the interview. More general conclusions could have been drawn if more companies had been interviewed. Keywords – Framework, Web Development, Responsive Web Design, Interaction Design, User Experience, Bootstrap, Foundation, Materialize, Material Design Lite, Semantic UI / Syfte – Syftet med denna rapport är att ta reda på vilka ramverk och metoder som är populärast och mest använda, samt webbutvecklares syn på hamburgermenyn. Metod – För att besvara frågeställningarna används metoderna kvantitativ bearbetning av statistik, kvantitativ analys av data insamlad via survey samt kvalitativa intervjuer med webbutvecklare. Studien genomfördes för att ta reda på vilka ramverk och metoder som är populärast och används mest, samt hur webbutvecklare ser på hamburgermenyn. Detta gjordes genom att analysera olika ramverks popularitet och användande samt att intervjua webbutvecklare som arbetar med det dagligen. Resultat – Rapportens resultat är baserat på den data som samlats in genom bearbetningen av statistiken, analysen av survey, samt de intervjuer som utfördes. Resultatet visar vilka ramverk som är populärast samt vilka som används mest. Följande lista visar rangordningen: Populärast: Bootstrap Semantic UI Materialize Material Design Lite Foundation Mest använt: Bootstrap Foundation Materialize Material Design Lite Semantic UI Resultatet av intervjuerna visade att majoriteten av de webbutvecklare som intervjuades använde ett ramverk när de skapade en hemsida, antingen ett existerande eller ett eget skapat. Det var också praxis att använda samma ramverk i företaget, även om sättet man arbetade med det kunde skilja sig från utvecklare till utvecklare. Samtliga utvecklare hade ett mobile-first tänk i åtanke, även om det inte alltid prioriterades. Det framgick även i studien att samtliga hade en grundtanke bakom valet av ramverk, men det var endast en som faktiskt hade utfört en undersökning om vilket som skulle passa dem bäst. Samtliga webbutvecklare som intervjuades tyckte att hamburgermenyn var tråkig och dålig ur ett användarupplevelseperspektiv. Men samtliga tyckte även att eftersom den används så brett och har gjort i ett par år så har användare lärt sig vad den innebär och fyller därför sitt syfte. Implikationer – Resultatets användningsområden är främst kopplade till personer eller företag som arbetar med webbutveckling men kommer även att kunna användas av privatpersoner. För rapportens primära målgrupp kommer resultatet att ge en ökad förståelse för vilka ramverk som används mest samt en ökad förståelse för varför dessa används. Privatpersoner kan använda resultatet på samma sätt. Begränsningar – Begränsningarna som vi får i denna studie är att vi inte kan dra några slutsatser om företag och webbutvecklare i andra delar av landet använder sig av samma ramverk eller metoder som de lokala vi intervjuat. Vi kan heller inte dra några slutsatser om varför Bootstrap är det mest populära och mest använda ramverket. Vi kan endast spekulera om varför med hjälp av den empiri vi samlat in via intervjuerna. En stor begränsning är även bristen av intervjuer då vi endast fick kontakt med 6 av de 10 företag som vi kontaktade, varav 4 stycken ville ställa upp på att delta i intervju. Fler generella slutsatser hade kunnat dras om fler företag hade ställt upp på intervjuer. Nyckelord – Ramverk, Webbutveckling, Responsiv webbdesign, Interaktionsdesign, Användarupplevelse, Bootstrap, Foundation, Materialize, Material Design Lite, Semantic UI

Benutzungsschnittstellen (UIs) dienen in der Domäne der industriellen Automatisierungstechnik der Bedienung und Beobachtung technischer Prozesse. Das sogenannte Model-based User Interface Development (MBUID) stellt ein vielversprechendes Konzept zur automatischen Erzeugung solcher UIs dar. Allerdings erfordert die Umsetzung dieses Konzeptes für einen spezifischen Anwendungsfall jeweils die Entwicklung einer oder mehrerer Modell-zu-Modell-Transformationen (M2M). Hierbei handelt es sich unter Verwendung aktueller Ansätze für Transformations-Frameworks um einen aufwändigen, fehleranfälligen und daher kostenintensiven Prozess. Dies gilt vor allem für Entwickler ohne tiefgreifendes Wissen über modellbasierte Technologien und kann unter Umständen sogar die durch die MBUID propagierten Vorteile aufwiegen. Zur Erleichterung des Prozesses der Entwicklung von Modelltransformationen schlägt diese Arbeit eine spezielle Methodik sowie deren prototypische Implementierung in Form des PAMTraM-Frameworks vor. Die Methodik greift dabei die speziellen Rahmenbedingungen bei der UI-Entwicklung in der Domäne der industriellen Automatisierungstechnik auf und basiert auf drei Hauptkonzepten: Die Basis stellt die Konfiguration von M2M-Transformationen in mehrdeutigen, bedingten Abbildungsmodellen dar. Diese Abbildungsmodelle beschreiben dabei lediglich Zuordnungen zwischen Elementen der Quell- und Ziel-UI-Beschreibungssprache einer durchzuführenden Transformation. Im Gegensatz zu existierenden Ansätzen erlaubt die entwickelte Methodik die explizite Berücksichtigung mehrdeutiger Abbildungen, die in der Domäne der UI-Entwicklung häufig auftreten. Darüber hinaus können explizite Kontextbedingungen formuliert werden, die die Notwendigkeit der Anpassung bzw. Neu-Erstellung eines Abbildungsmodells bei Vorliegen eines geänderten Nutzungskontextes (z.B. einer neuen Hardware-Plattform) verhindern. Konkrete Transformationen für ein oder mehrere Quell- und Kontextmodelle können anschließend auf Basis eines konfigurierten Abbildungsmodells durchgeführt werden. Hierzu wird ein spezieller generischer Transformations-Algorithmus vorgestellt. Dieser ist in der Lage, basierend auf einer selbstständigen Analyse der Ziel-UI-Beschreibungssprache auch unvollständige Abbildungsmodelle auszuführen. Hierdurch muss der Entwickler eines Abbildungsmodells weniger Informationen in dieses integrieren. Allerdings führt dieses Vorgehen auch dazu, dass im Rahmen der Durchführung einer Transformation an verschiedenen Stellen Mehrdeutigkeiten auftreten können. Zur Auflösung dieser Mehrdeutigkeiten stellt diese Arbeit unterschiedliche Strategien wie z.B. die Konsultation des Nutzers vor. Das dritte Hauptkonzept wird durch zwei Ansätze für sog. Higher-Order Transformations gebildet. Diese ermöglichen die teilweise semi-automatische Erstellung bzw. Vervollständigung von Abbildungsmodellen u.a. im Rahmen iterativer Entwicklungsprozesse. Dadurch wird die Entwicklung von Abbildungsmodellen weiter vereinfacht und die während einer Transformation auftretenden Mehrdeutigkeiten können schrittweise soweit notwendig reduziert werden. Ein Nachweis über die Funktionalität der entwickelten Methodik sowie deren prototypischer Implementierung erfolgt zum einen anhand repräsentativer Fallstudien aus der betrachteten Domäne und zum anderen auf Basis einer Analyse hinsichtlich allgemeiner Kriterien zur Bewertung von Transformations-Frameworks. Eine abschließende Bewertung zeigt, dass die entwickelte Methodik die speziellen Anforderungen in Bezug auf die UI-Entwicklung in der Domäne der industriellen Automatisierungstechnik erfüllt und zur Vereinfachung der Entwicklung von Modelltransformationen geeignet ist. / User Interfaces (UIs) in the domain of industrial automation serve the operation and monitoring of technical processes. The Model-based User Interface Development (MBUID) represents a promising concept for the automatic generation of such UIs. However, the realization of this concept for a specific use case requires the development of one or multiple model-to-model (M2M) transformations. Using existing transformation frameworks, this represents a complex, error-prone, and thus costly task. This applies especially to developers without deep knowledge of model-based technologies and can in some circumstances even cancel out the advantages promised by MBUID. In order to simplify the process of developing model transformations, this thesis proposes a specific methodology as well as its prototypic implementation by means of the PAMTraM framework. This methodology addresses the special underlying conditions of UI development in the domain of industrial automation and is based on three main concepts: The basis is formed by the configuration of M2M transformations in ambiguous, conditional mapping models. These only capture mappings between elements of the source and the target UI modeling language of a transformation. In contrast to existing approaches, the developed methodology explicitly takes into account the possibility for ambiguous mappings that are common in the domain of UI development. Furthermore, developers can specify explicit context conditions that prevent the necessity of a modification or redevelopment of a mapping model in case of a changed context of use (e.g. a new hardware platform). Individual transformations for one or multiple source and context models can be executed based on a configured mapping model. Therefore, a special generic transformation algorithm is presented. By autonomously analyzing the target UI modeling language, this algorithm is even capable of executing incomplete mapping models. As a result of this, the developer has to integrate less information in the mapping model. However, due to this approach, ambiguities may occur at various points during the course of a transformation. In order to be able to resolve these ambiguities, various strategies like the consultation of the user are presented in this thesis. The third main concept is formed by two approaches for higher-order transformations that allow the partial semi-automatic generation resp. completion of mapping models among others in the context of iterative development processes. This further simplifies the development of mapping models and allows for the step-wise reduction of occurring ambiguities as far as necessary. Representative case studies from the considered domain as well as an analysis with regard to general criteria for the assessment of transformation frameworks prove the functionality of the proposed methodology and its prototypical implementation. A concluding evaluation shows that the developed methodology satisfies the specific requirements concerning UI development in the domain of industrial automation and is suited to simplify the development of model transformations.

Den teknik som används i vart moderna samhalle utvecklas konstant och likaså kraven for att användargranssnitten är effektiva och användarupplevelsen god. Ett användargränssnitt bestämmer på vilket sätt en användare interagerar med ett system eller en mjukvara, och användarupplevelsen definierar hur användaren upplever denna interaktion. Dessa benämns även som User Interface (UI) och User Experience (UX). Studiens syfte var att analysera den existerande implementationen av ett systems anvandargränssnitt, för att sedan föreslå förbättringar inom dess UI och UX. Förbättringsförslagen baserades på existerande forskning kring interaktion mellan användare och datorbaserade verktyg. I studien har kvantitativa och kvalitativa metoder tillämpats för att besvara studiens två forskningsfrågor. Den första forskningsfrågan ”Vilka brister finns i den grafiska designen ur användarens perspektiv för den befintliga plattformen?” besvarades genom observationer och personliga intervjuer. Den andra forskningsfrågan ”Hur kan en förbättrad grafisk design se ut för den befintliga plattformen?” besvarades genom att ta fram en förbättrad utformning av den grafiska designen. Detta gjordes i form av en mockup som baserades på Normans design principer, Ware gestaltlagar och ISO-standard. Avgränsningen som gjordes var att analysera ett specifikt business support system och ett antal arbetsuppgifter som är vanliga inom kundtjanst. Resultatet från observationen visade att majoriteten av testanvändarna hade svårigheter med att utföra uppgiften som berörde framfor allt komponenten ”adress” inom den utsatta tidsramen. Detta var även nagot som påtalades av respondenterna under intervjuerna. En av orsakerna till svårigheterna kunde kopplas till utformningen av den grafiska designen för den specifika funktionen. Detta var en av de förbattringar som sedan gjordes i förslagen av en ny design som presenterades i analysen. Med grund i observationerna och intervjuerna har studien visat vikten av ett användarvanligt anvädargranssnitt och god användarupplevelse. Men även att det ar möjligt att tillämpa den existerande teorin på ett modernt systems grafiska design. / The technology used in our modern society is constantly evolving and so are the requirements for an efficient and user-friendly user interface and user experience. A user interface decides the way a user interacts with a system or software, and the user experience defines how the user experiences this interaction. These are also called User Interface (UI) and User Experience (UX). The purpose of the study was to analyze the existing implementation of a system's user interface and suggest improvements within its UI and UX based on existing research on interaction between users and computer-based tools. In the study, quantitative and qualitative methods have been applied to answer the study's two research questions. The first research question "What are the shortcomings of the graphic design from the user's perspective for the existing platform?" was answered through observations and personal interviews. The second research question "How can an improved graphic design look like for the existing platform?" was answered by developing an improved implementation of the graphic design. This was done in the form of mockup’s based on Norman’s design principles, Ware gestalt laws and ISO-standard. The delimitation that was made was to analyze a specific business support system and several tasks that are common within customer services. The results from the observation demonstrated that most of the test users had especially difficult to perform the task which concerned the component “address” within the set time frame, and this was also something that was raised by the respondents during the interviews. One of the reasons for the difficulties could be linked to the graphic design for the specific function. This was one of the improvements that was later made in the new design proposal that was presented in the analysis. Based on the observations and interviews, the study has shown the importance of a user-friendly user interface and user experience, and that it is possible to apply the existing theory to a modern system's graphic design.

Neue Organisationsformen, wie evolutionäre Organisationen, bilden in vielen Kooperationsszenarien sozio-technische Konstrukte mit modernen CSCW Anwendungen aus. Daher erfordern Veränderungen dieser sozialen Systeme eine kontinuierliche Anpassung der technischen Tools an die neuen sozialen Konfigurationen. Diese Dissertation ist als Design Science Research (DSR) Projekt konzipiert und addressiert die folgende Forschungsfrage (RQ): “Wie können soziotechnische, evolutionäre Organisationen die Herausforderungen der joint optimization und des organizational choice während ihrer autopoietischen Veränderungsprozesse addressieren?” Die Fallstudie Viva con Agua de St. Pauli e.V. wurde mittels qualitativer und ethnographischer Methoden im Rahmen der entsprechenden DSR Zyklen untersucht. Das Forschungsprojekt fokussiert die Entwicklung von Artefakten indem sowohl eine technische, als auch eine soziale Perspektive eingenommen wird. Aus der technische Perspektive wird die RQ durch eine Microservice-Plattform adressiert. Die Architektur dient der Verteilung von Verantwortlichkeit für die Software in einem heterogenen Netzwerk von Entwickler:innen. Dabei müssen diverse neue Herausforderungen beachtet werden, wie etwa die Verteilung des User Interface. Durch die Betrachtung der RQ aus der sozialen Perspektive wird der USMU Workshop entwickelt. Dieses Artefakt dient der Verbindung der Charakteristika evolutionärer Organisationen mit agiler Software Entwicklung und mit Methoden des partizipativen Designs. Die Studien zeigen, dass beide Artefakte die RQ adressieren. Zudem konnte ich für beide Artefakte wertvolle Verbesserungsmöglichkeiten aufzeigen. Somit motivieren die Ergebnisse den nächsten Schritt des Projekts und die vorliegende Thesis wird Bestandteil des zyklischen Ablaufs eines DSR Projekts. / The emergence of new types of organizational structures, such as evolutionary-teal organizations, almost always leads to the development of socio-technical constructs when it comes to working in collaboration with modern CSCW applications. A consequence of this is that the social system’s autopoietic change processes create challenges that compel one to adjust the implementation of the technical tool to the social system’s new configuration. This thesis is structured according to the design science research (DSR) approach and focuses on the research question (RQ): “How can socio-technical evolutionary-teal organizations address the challenges of joint optimization and organizational choice during their autopoietic processes?” For this purpose, the case study Viva con Agua de St. Pauli e.V. is investigated using a qualitative ethnographical approach during the DSR cycles. Addressing the RQ, two artifacts are designed from a technical as well as a social perspective. While the technical perspective primarily investigates the adjustments of technology, the social perspective focuses on the management of change in socio-technical evolutionary-teal organizations. I propose a microservice platform as an artifact that addresses the RQ from a technical perspective. The microservice architecture aims at spreading the responsibility for the software through a heterogeneous ecosystem of developers. The newly designed USMU workshop is addressing the RQ from the social perspective. It strives to intertwine the characteristics of evolutionary-teal organizations with agile software development and participatory design methods. In my studies, I examine the fact that both artifacts can be used to address the RQ. Additionally, I was able to identify valuable improvements for both of my artifacts. Hence, the project follows the lifecycle of a DSR project by reasoning through the results presented here for its next iteration.

This thesis explores the implementation of a conversational user interface for Uppsala Municipality, aimed at optimising the balance between cost of usage and quality when using large language models for public services. The central issue addressed is the effective integration of large language models, such as OpenAI's GPT-4, to enhance municipal services without compromising user privacy and data security. The solution developed involves a prototype that utilises a model chooser and prompt tuner, allowing the interface to adapt the complexity of responses based on user input. This adaptive approach reduces costs while maintaining high response quality. The results indicate that the prototype not only manages costs effectively, but also adheres to standards of data privacy and security. Clear information on data use and transparency improved user trust and understanding. In addition, strategies were effectively implemented to handle sensitive and unexpected input, improving overall data security. Overall, the findings suggest that this approach to implementing conversational user interfaces in public services is viable, offering valuable insights into the cost-effective and secure integration of language models in the public sector. The success of the prototype highlights its potential to improve future municipal services, underscoring the importance of transparency and user engagement in public digital interfaces. / Den här masteruppsatsen undersöker implementeringen av ett konversationsgränssnitt för Uppsala kommun, med målet att optimera balansen mellan kostnad och kvalitet vid användning av stora språkmodeller för den offentliga sektorn. Den centrala frågan som besvaras är hur stora språkmodeller, såsom OpenAI:s GPT-4, kan integreras för att förbättra kommunala tjänster utan att kompromissa med användarnas integritet och datasäkerhet. Den utvecklade lösningen innefattar en prototyp som använder en modellväljare och promptjusterare, vilket gör det möjligt för gränssnittet att anpassa svarens komplexitet baserat på användarens meddelande. Detta tillvägagångssätt reducerar kostnaderna samtidigt som en hög svarskvalitet bibehålls. Resultaten visar att prototypen inte bara hanterar kostnaderna effektivt, utan också upprätthåller standarder för datasekretess och säkerhet. Tydlig information om dataanvändning och transparens förbättrade avsevärt användarnas förtroende och förståelse. Dessutom implementerades strategier effektivt för att hantera känslig och oväntad data, vilket förbättrade den övergripande datasäkerheten. Sammanfattningsvis tyder resultaten på att detta tillvägagångssätt för implementering av konversationsgränssnitt i offentliga tjänster är möjligt och erbjuder lärdomar om kostnadseffektiv och säker integration av språkmodeller i offentlig sektor. Prototypens framgång påvisar dess potential att förbättra framtida kommunala tjänster, men lyfter också vikten av transparens och användarengagemang i offentliga digitala gränssnitt.

<p>Cilj istraživanja realizovanih u ovom radu, bio je&nbsp;modelovanje i formalna prezentacija jednog pristupa&nbsp;rješenju problema generisanja izvršnih softverskih&nbsp;specifikacija informacionog sistema. Kreiranjem rečnika&nbsp;opšteg modela korisničkog interfejsa, omogućeno je&nbsp;definisanje parametara koji specificiraju vizuelni dizajn&nbsp;korisničkog interfejsa. Praktična upotreba ovakvog pristupa&nbsp;sastoji se u automatskom generisanju prototipova koji su vrlo&nbsp;bliski finalnoj implementaciji aplikativnih sistema nekog&nbsp;informacionog sistema, korišćenjem generatora&nbsp;implementiranog u okviru alata IIS*Case. Time je omogućeno&nbsp;da se, u vrlo kratkom roku, izgeneriše funkcionalan&nbsp;korisnički interfejs za prikaz i ažuriranje podataka.</p> / <p>The aim of the research presented in this work is a modeling and&nbsp;formal presentation of an approach to the problem of generating&nbsp;executable software specifications of an information system. A&nbsp;specification of common user interface models is provided by&nbsp;defining the appropriate repository definitions. Practical application&nbsp;of the approach is provided by the implementation of an&nbsp;application generator as a part of IIS*Case tool. It provides&nbsp;automated generation of the prototypes that are very close to the&nbsp;final implementation of the system applications. By this, it is&nbsp;possible to efficiently generate dynamic user interface for data&nbsp;presentation and database update operations.</p>