Mid Sweden University

miun.sePublications
Change search
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf
Hej AI - Nytt gränssnitt och utvärdering av stilverktyg: En praktisk jämförelse mellan Sass och Tailwind
Mid Sweden University, Faculty of Science, Technology and Media, Department of Computer and Electrical Engineering (2023-).
2025 (Swedish)Independent thesis Basic level (degree of Bachelor), 10 credits / 15 HE creditsStudent thesis
Abstract [sv]

Det här projektet gick ut på att förbättra användargränssnittet för Hej AI, en AI-chattjänst som underlättar för företag att enkelt integrera AI i sin verksamhet. Bakgrunden till projektet var att användare på plattformen visade ett behov av ett mobilanpassat gränssnitt med en design mer lik konkurrenternas. Utöver detta syftade projektet också till att jämföra olika metoder för att implementera gränssnittets stil, och därför valdes två populära verktyg: Sass och Tailwind. Det centrala målet med projektet var att bygga ett nytt gränssnitt som möter användarnas behov, samt att undersöka skillnaderna i att utveckla ett användargränssnitt med Sass jämfört med Tailwind i praktiken. Metoden gick ut på att designa och implementera ett nytt användargränssnitt med hjälp av båda verktygen. Jämförelsen baserades på faktorer som utvecklingstid, kodkvalitet, utvecklarupplevelse och skillnader i kodmängd. Resultatet visade att Sass-varianten tog längre tid att implementera och hade en större total kodmängd, men gav mer kontroll för utvecklaren och erbjöd en tydlig separation mellan stil och struktur, vilket underlättar underhåll i större projekt. Tailwind-varianten gick fortare att implementera och resulterade i en mindre kodmängd, men resulterade i en något rörigare struktur. Det är ett verktyg som fungerar bättre för att snabbt komma igång och bygga mindre prototyper. Slutsatsen är att inget av verktygen är perfekt, utan att valet beror på projektets specifika behov.

Abstract [en]

The aim of this project was to improve the user interface of Hej AI, an AI chat application that helps businesses easily integrate AI into their organization. The background of the project was that users on the platform expressed a need for a mobile-friendly user interface with a design more similar to the competitors. In addition, the project aimed to compare different methods for implementing the style of the user interface, which resulted in a comparison between two popular tools: Sass and Tailwind. The primary goal of the project was to build a new user interface that meets the users’ needs and to explore the practical differences between developing a user interface with Sass vs Tailwind. The method involved designing and implementing a new user interface using both tools. The comparison was based on factors such as development time, code quality, developer experience, and differences in code size. The results showed that the Sass version took longer to implement and had a larger overall codebase but offered more control for the developer and a clear separation between style and structure, which is a benefit for maintaining larger and more complex projects. The Tailwind version was quicker to implement and resulted in a smaller codebase but led to a somewhat messier structure. It is a tool that works better for quickly getting started and building smaller prototypes. The conclusion is that neither tool is perfect, and the choice depends on the specific needs of the project.

Place, publisher, year, edition, pages
2025. , p. 34
Keywords [en]
CSS, Sass, Tailwind, UI/UX
Keywords [sv]
CSS, Sass, Tailwind, UI/UX
National Category
Software Engineering
Identifiers
URN: urn:nbn:se:miun:diva-54810Local ID: DT-V25-G3-043OAI: oai:DiVA.org:miun-54810DiVA, id: diva2:1977051
Subject / course
Computer Engineering DT1
Educational program
Computer Science TDATG 180 higher education credits
Supervisors
Examiners
Available from: 2025-06-25 Created: 2025-06-25 Last updated: 2025-09-25Bibliographically approved

Open Access in DiVA

No full text in DiVA

Search in DiVA

By author/editor
Söderlund, Elias
By organisation
Department of Computer and Electrical Engineering (2023-)
Software Engineering

Search outside of DiVA

GoogleGoogle Scholar

urn-nbn

Altmetric score

urn-nbn
Total: 37 hits
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf