kth.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
Comparing User Interface Design Implementation between Cross-Platform and Native Mobile Applications: FlutterFlow versus Jetpack Compose
KTH, School of Electrical Engineering and Computer Science (EECS).
KTH, School of Electrical Engineering and Computer Science (EECS).
2023 (English)Independent thesis Basic level (degree of Bachelor), 10 credits / 15 HE creditsStudent thesisAlternative title
Jämförelse av Implementering av Användargränssnitt mellan Cross-Platform och Native Mobila Applikationer : FlutterFlow kontra Jetpack Compose (Swedish)
Abstract [en]

Smartphones have become indispensable in modern life, largely due to the vast array of apps that aim to simplify and enrich our daily experiences. Given the vast number of apps available, it's crucial to have a unique and user-friendly UI to stand out from the crowd.

This thesis explores the processes of mobile application UI development, contrasting the traditional declarative programming approach with the Android toolkit Jetpack Compose and the use of a web based low-code tool, FlutterFlow, for cross-platform applications. The goal is to provide valuable insights for those seeking to develop competitive, modern UI. This is achieved by examining the advantages and disadvantages of each approach, focusing on their ability to create non-standard custom components, the scalability of the apps developed, and potential differences in UI responsiveness, animation smoothness, and overall fluidity.

To address these questions, a case study was conducted where an application was developed using both approaches. In addition, a qualitative user survey was conducted to assess whether users could discern any difference between the two applications.

The findings suggest that while users did not perceive a significant difference, Jetpack Compose outperformed in terms of app scalability and the creation of non-standard custom components. On the other hand, FlutterFlow proved advantageous in implementing standard functionalities and animations, as well as offering a considerably faster development time when only standard components were required.

Abstract [sv]

Smartphones har blivit oumbärliga i det moderna livet, till stor del på grund av det stora utbudet av appar som syftar till att förenkla och berika våra dagliga upplevelser. Med tanke på det stora antalet tillgängliga appar är det avgörande att ha ett unikt och användarvänligt gränssnitt för att sticka ut från mängden.

Syftet med denna avhandling är att jämföra processen vid utveckling av användargränssnitt för mobila applikationer, specifikt genom att kontrastera det traditionella tillvägagångssättet med deklarativ programmering med Jetpack Compose och användningen av ett lågkodverktyg, FlutterFlow, för cross-platform applikationer. Avsikten är att erbjuda värdefulla insikter för intressenter som strävar efter att utveckla moderna och konkurrenskraftiga applikationer. Detta mål uppnås genom att förtydliga fördelarna och nackdelarna med vardera tillvägagångssätt, särskilt när det gäller deras flexibilitet i att skapa icke-standard komponenter, skalbarheten hos de utvecklade applikationerna, och potentiella skillnader i responsivitet, smidighet och fluiditet mellan applikationen.

För att besvara dessa frågor genomfördes en fallstudie där en applikation utvecklades med båda tillvägagångssätten. Dessutom genomfördes en kvalitativ användarundersökning för att bedöma om användarna kunde upptäcka skillnader mellan de två applikationerna.

Resultaten tyder på att medan användarna inte uppfattade någon märkbar skillnad, visade Jetpack Compose vara överlägsen när det gäller applikationens skalbarhet och skapandet av icke-standard komponenter. Däremot uppvisade FlutterFlow en fördel i implementeringen av standard funktionaliteter och animationer, samt erbjuder betydligt snabbare utvecklingstid när applikationen endast kräver standardkomponenter.

Place, publisher, year, edition, pages
Stockholm: KTH Royal Institute of Technology , 2023. , p. 72
Series
TRITA-EECS-EX ; 2023:515
Keywords [en]
Cross-Platform, Native, Mobile development, Low-code, Jetpack Compose, FlutterFlow, User interface
Keywords [sv]
Cross-Platform, Native, Mobilutveckling, Low-code, Jetpack Compose, FlutterFlow, Användargränssnitt
National Category
Computer Sciences Computer Engineering
Identifiers
URN: urn:nbn:se:kth:diva-332401OAI: oai:DiVA.org:kth-332401DiVA, id: diva2:1783632
External cooperation
Sigma Technology Cloud
Educational program
Bachelor of Science in Engineering - Computer Engineering
Presentation
2023-06-26, via Zoom https://kth-se.zoom.us/j/5680136250, Isafjordsgatan 22 (Kistagången 16), Stockholm, 14:00 (English)
Supervisors
Examiners
Available from: 2023-08-07 Created: 2023-07-23 Last updated: 2023-08-07Bibliographically approved

Open Access in DiVA

fulltext(9494 kB)1263 downloads
File information
File name FULLTEXT01.pdfFile size 9494 kBChecksum SHA-512
77c543807f43231774f9cf58491be192de868992f0703a692e64eb9bedca458255bf07fca60acf04177b362c4dfbb34694e4298bcbf92064d8bbd14d898b5db8
Type fulltextMimetype application/pdf

Search in DiVA

By author/editor
Jonsson Sjödin, AdrianLundqvist, Alexander
By organisation
School of Electrical Engineering and Computer Science (EECS)
Computer SciencesComputer Engineering

Search outside of DiVA

GoogleGoogle Scholar
Total: 1265 downloads
The number of downloads is the sum of all downloads of full texts. It may include eg previous versions that are now no longer available

urn-nbn

Altmetric score

urn-nbn
Total: 1045 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