The rapid advancement of Large Language Models (LLMs), particularly with the advent of multimodal capabilities, offers promising solutions for automating code generation with graphical user interface (UI) images as inputs. This thesis explores the development of an automated pipeline utilizing LLMs to generate application code directly from UI images. Starting with UI images as inputs aligns well with modern industry practices, where designers create layouts and mockups using tools like Figma before handing them over for further development. While much of the existing research using vision-capable LLMs focuses on replicating the visual layout and styling of UIs, this work shifts the focus toward seeing how well the intended functionality behind the UI is correctly interpreted and captured. In other words, rather than prioritizing visual accuracy, the primary goal is to assess how well LLMs can infer and generate the underlying application logic and interactive functionality based on UI affordances. The process also involves various experimental phases that build on each other to discover how to effectively prompt LLMs for more extensive and accurate code generation, further refining the pipeline for optimal results. The findings highlight both the strengths and limitations of current LLM capabilities, offering insights for future research and laying a foundation for enhancing automated code generation pipelines. While LLM-generated code is not flawless, it may provide a valuable starting point, significantly reducing time and effort in application development.

Den snabba utvecklingen av stora språkmodeller (LLMs), särskilt med införandet av multimodala funktioner, erbjuder lovande lösningar för att automatisera kodgenerering med bilder av grafiska användargränssnitt (UI) som indata. Denna avhandling undersöker utvecklingen av en automatiserad pipeline som använder LLMs för att generera funktionell applikationskod direkt från UI-bilder. Att börja med UI-bilder som indata stämmer väl överens med moderna industripraxis, där designers skapar layouter och mockups med verktyg som Figma innan de lämnas över för vidare utveckling. Medan mycket av den befintliga forskningen som använder visionskapabla LLMs fokuserar på att replikera den visuella layouten och stiliseringen av UI, skiftar detta arbete fokus mot att undersöka hur väl den avsedda funktionaliteten bakom UI tolkas och fångas korrekt. Med andra ord, istället för att prioritera visuell noggrannhet, är det primära målet att utvärdera hur väl LLMs kan härleda och generera funktionell, interaktiv applikationskod baserad på UI-funktioner. Processen innefattar också olika experimentella faser som bygger på varandra för att upptäcka hur man effektivt kan utforma uppmaningar till LLMs för mer omfattande och korrekt kodgenerering, vilket ytterligare förfinar pipelinen för optimala resultat. Resultaten lyfter fram både styrkor och begränsningar hos nuvarande LLM-förmågor, och ger insikter för framtida forskning samt lägger en grund för att förbättra automatiserade kodgenereringspipelines. Även om den kod som genereras av LLMs inte är felfri, kan den ge en värdefull startpunkt och avsevärt minska tid och ansträngning i applikationsutveckling.