Affärssystem som inte har tydliga användargränssnitt tenderar att göra användarvänligheten sämre, vilket i sin tur kan leda till att delar av systemet inte nyttjas effektivt. Det kan därför vara lämpligt att ha en specifik och tydlig processbeskrivning för utveckling av system med hänsyn till användarvänlighet. I detta projekt undersöktes möjligheten att ta fram en processbeskrivning för IT-projekt vid framtagning av ett nytt gränssnitt i ett system. Mer konkret så är frågan som ska besvaras i denna rapport följande: ”Hur ska en utvecklingsmetod eller utvecklingsprocess för IT-system se ut för att tillvarata vetenskapliga, teoretiska och tekniska aspekter på Människa-Dator Interaktion (MDI)?” En fallstudie i detta projekt har utförts på företaget GMP-Systems AB. För att komma fram till ett resultat, och för att få svar på frågeställningen, så har en litteraturstudie på aspekter inom MDI utförts. Dessutom har en analys huruvida teknisk implementation av detta kan åstadkommas med hjälp av ramverk. Vidare har intervjuer genomförts, samt tester där användaren har fått interagera med systemet. Resultatet av feedbacken har sedan analyserats. Detta för att senare kunna bygga prototyper till systemet. I resultatdelen levereras en utvecklingsmetod och en processbeskrivning som är kopplad till den litteraturstudie och de erfarenheter som erhållits från projektets fallstudie. Till företaget GMP-Systems levereras en prototyp, en use-case model[1] med user-stories[2] samt ett sekvensdiagram[3]. [1] Use-Case Model är en beskrivning på åtgärder och handlingar som en användare kan utföra, och definierar interaktionen mellan rollerna i ett system för att utföra ett mål.[2] User-stories är ett verktyg inom systemutveckling för att kunna ta fram en beskrivning av önskad funktionalitet som ofta utgår utifrån ett användarperspektiv.[3] Ett sekvensdiagram visar metodanrop mellan objekt i en tidsbegränsad situation och vilken ordning. / Business systems lacking a clear interface and subsequently a diminished usability, can lead to limited usage or no usage of parts of the system. It may therefore be critical to have a process outlined for the development of such system and its interface to ensure that all parts of the system are used.   The objective of this case study was to investigate whether it is possible to develop a process description for IT projects at the initial stages of the development phase of a new interface in a system. More specifically, the question investigated in this report follows:  “How should a development method or development process for IT systems look to seize scientific, theoretical and technical aspects of Human Computer Interaction (HCI)?” A case study of the project was carried out at the company GMP-Systems AB. A literature-study on aspects of Human-Computer Interaction (HCI) was carried out to arrive at a result and answer the question. Further, an analysis was conducted to consider whether the technical implementation of such process can be accomplished by adopting frameworks. In addition, interviews were conducted with users that have interacted with the system, and an analysis was carried out on the feedback provided to develop prototypes for the system. A development method and process description linked to the literature and the experience gained from the projects case study is outlined in the result section. To the client, GMP-Systems, a prototype, a use-case model[1] with user-stories[2] and a sequential diagram[3] will be delivered.  Keywords: HCI, evaluation method, Angular JS, Knockout JS, React, Moqups, process description, development method. [1] Use-Case model is a description of actions that a user can perform and defines the interaction between the roles of a system to accomplish a goal[2] User stories are a tool in system development to provide a description of the desired functionality, often from an end user perspective.[3] A sequential diagram shows how objects operate with one another and in what order.

Generating web applications with correct structure and modern functionalities using a development platform is not widely known for students in academia around the world. Modern web development is moving further towards advancement where different functionalities adapted for web application development increase and become more central in today's market. Introducing modern concepts in web application development to the students in academia at an early stage is essential in order to provide better insight of how to suitably develop and maintain the structure of modern "Web Applications".  This thesis describes the work carried out to investigate how a web application can effectively be developed and structured by the undergraduate students in the course II1302 Projects and project methods at the Royal Institute of Technology (KTH) using a development platform.  The case study is conducted as a research method for this thesis. The research method revolved around experimentation with an example application to identify the possibilities of using a development platform in conjunction to improve the teaching of modern web application development early in education, and then apply the development platform in the course's future projects.  This thesis identifies pertinent fields of knowledge throughout the development of a web application using the development platform to learn about the relevant concepts and definitions of modern and future technologies used in web application development. The implementation of the web application covers the areas such as automation, deployment, and monitoring. These areas are utilized in the form of the following aspects: DevOps, CI/CD, integration cloud deployment, IoT simulated device, MVC design pattern architecture for both frontend and backend, programming frameworks, i.e., Angular JS frontend framework and Spring Boot backend framework. A description of how the application is managed and what technologies and resources are used is presented.  These aspects are used throughout the process of web application development. The requirements of using the development platform aim to be relevant to the students' studies at a sufficient difficulty level in course II1302. The students are expected to have an extended knowledge in basic web application development. / Att generera webbapplikationer med rätt struktur och moderna funktioner med hjälp av en utvecklingsplattform är inte allmänt känt för studenter inom akademin runt om i världen. Modern webbutveckling går vidare mot avancemang där olika funktioner anpassade för webbapplikationsutveckling ökar och blir mer centrala på dagens marknad. Att introducera moderna koncept inom webbapplikationsutveckling för studenter i akademin på ett tidigt stadium är viktigt för att ge bättre insikt om hur man på ett lämpligt sätt kan utveckla och behålla strukturen för moderna "Web Applications".  Denna avhandling beskriver arbetet med att undersöka hur en webbapplikation effektivt kan utvecklas och struktureras av studenterna i kursen II1302 Projekt och projektmetoder vid Royal Institute of Technology (KTH) med hjälp av en utvecklingsplattform.  Fallstudien genomförs som en forskningsmetod för denna avhandling. Forskningsmetoden kretsade kring experiment med en exempelapplikation för att identifiera möjligheterna att använda en utvecklingsplattform tillsammans för att förbättra undervisningen i modern webbapplikationsutveckling tidigt i utbildningen och sedan tillämpa utvecklingsplattformen i kursens framtida projekt.  Denna avhandling identifierar relevanta kunskapsområden genom utvecklingen av en webbapplikation med hjälp av utvecklingsplattformen för att lära sig relevanta begrepp och definitioner av modern och framtida teknik som används i webbapplikationsutveckling. Implementeringen av webbapplikationen täcker områden som automatisering, distribution och övervakning. Dessa områden används i form av följande aspekter: DevOps, CI/CD, integration av moln, IoT -simulerad enhet, MVC -designmönsterarkitektur för både frontend och backend, programmeringsramar, dvs Angular JS frontend framework och Spring Boot backend framework. En beskrivning av hur applikationen hanteras och vilken teknik och resurser som används presenteras.  Dessa aspekter används under hela processen för webbapplikationsutveckling. Kraven för att använda utvecklingsplattformen syftar till att vara relevanta för studenternas studier med tillräcklig svårighetsgrad i kurs II1302. Studenterna förväntas ha en utökad kunskap inom grundläggande webbapplikationsutveckling.