Utveckling och presentation av nyheter i ERP system: Undersökning, design och utveckling av en nyhetskomponent på webben, genom Angular, TypeScript och SCSS.
2026 (Swedish)Independent thesis Basic level (university diploma), 10 credits / 15 HE credits
Student thesis
Abstract [sv]
Målet med detta examensarbete har varit att utveckla en moderniserad nyhetskomponent för Monitor ERP:s webbklient med fokus på att förbättra användbarhet, tydlighet och upplevd relevans. Bakgrunden till arbetet är företagets omställning från en Windows-applikation till en webblösning, vilket ställer högre krav på gränssnittsdesign och användarupplevelse. Som metod har semistrukturerade intervjuer med personal på Monitor ERP använts för att identifiera krav, samtidigt har en iterativ designprocess utövats vilket innefattande både lågupplösta wireframes och högupplösta prototyper i Figma. Användartester har visat att en tidningsliknande ikon föredragits framför den tidigare klocksymbolen, då den skapar en tydligare koppling till redaktionellt innehåll och minskar kognitiv belastning. Resultatet av arbetet är en tekniskt implementerad komponent i Angular och TypeScript som balanserar företagets behov av synlighet med användarens behov av att arbeta ostört. Detta har uppnåtts genom subtila notisindikationer och valbara visningspreferenser som ger användaren kontroll över flödet. Arbetet har även resulterat i en teknisk lösning med en specialanpassad parser och ett adapter-mönster som säkerställer robust datahantering och tillgänglighet enligt WCAG-standard.
Abstract [en]
The goal of this thesis project has been to develop a modernized news component for the Monitor ERP web client, with a focus on improving usability, clarity, and perceived relevance. The background of this work is the company's transition from a Windows application to a web-based solution, which places higher demands on interface design and user experience. The method employed involved semi-structured interviews with staff at Monitor ERP to identify requirements, alongside an iterative design process that included both low-fidelity wireframes and high-fidelity prototypes in Figma. User testing showed that a newspaper-like icon was preferred over the previous clock symbol, as it creates a clearer connection to editorial content and reduces cognitive load. The result of the work is a technically implemented component in Angular and TypeScript that balances the company's need for visibility with the user's need to work undisturbed. This has been achieved through subtle notification indicators and selectable display preferences that provide the user with control over the flow. The project has also resulted in a technical solution featuring a customized parser and an adapter pattern, ensuring robust data handling and accessibility in accordance with WCAG. standards.
Place, publisher, year, edition, pages
2026. , p. 56
Keywords [en]
Human-computer interaction, ERP systems, Angular, TypeScript, UX design, WCAG.
Keywords [sv]
Människa-dator-interaktion, ERP-system, Angular, TypeScript, UX design, WCAG.
National Category
Computer Engineering
Identifiers
URN: urn:nbn:se:miun:diva-57858Local ID: DT-V26-G2-033OAI: oai:DiVA.org:miun-57858DiVA, id: diva2:2079209
Subject / course
Computer Engineering DT1
Educational program
Web Development TWEUG 120 higher education credits
Supervisors
Examiners
2026-06-252026-06-252026-06-25Bibliographically approved