Designers upplevelse av att ta designarbete till kod
2024 (Swedish)Independent thesis Basic level (degree of Bachelor), 10 credits / 15 HE credits
Student thesis
Abstract [sv]
Genom årtionden har det funnits en tydlig uppdelning mellan designers och utvecklares arbete. Missförstånd och bristfällig kommunikation kan lätt uppstå under samarbete, vilket kan leda till problem såsom “design breakdowns” under handoff-processen. Olika verktyg uppdateras kontinuerligt för att stödja samarbetet mellan dessa roller och underlätta samarbetet. Verktygen som vi särskilt fokuserar på i vår studie är designverktyget Figma, utvecklingsmiljön Android Studio och plugin tillägget Relay. Vi fokuserar på att undersöka designers känslor under processen där de använder dessa verktyg för att ta sitt designarbete till kod. “Co-discovery” workshops genomfördes och en reflektionsenkät fylldes i efteråt. För att analysera datan användes affinitetsdiagram och svaren på enkätfrågorna sammanställdes främst i form av diagram. Resultaten visar att designers upplevde processen som komplex men på en acceptabel nivå och de tyckte positivt om konceptet, men önskade utveckling och förbättring på olika plan. De kände sig begränsade i sitt designarbete av Relay i Figma och upplevde svårigheter med att exportera UI-paketet från Figma, samt framförallt att importera det i Android Studio. De tyckte att det var väldigt komplicerat att navigera och förstå innehållet i Android Studio, framförallt som nybörjare till den miljön. Diskussionen om dessa resultat fokuserar mycket på bakomliggande faktorer. Erfarenhet och osäkerheten med ovana verktyg som Relay och Android Studio gjorde att designers upplevde mest problematik i samband med dessa. Klyftor mellan roller försvårade för designers att ta ett steg in i utvecklarnas arbetsmiljö. Slutsatser kan sammanfattas på följande sätt:
•Designer upplever processen positivt generellt, men förbättringar önskas
•Konceptet av att översätta design till kod är önskvärt, men designers hoppas att verktyget kan fortsätta utvecklas för att bättre uppfylla deras mål och perspektiv med färre begränsningar.
•Mer introduktion och tydligare navigering behövs, särskilt i Android Studio.
•Processen i Android Studio var betydligt svårare än den i Figma.
•Yrkesverksamma designers verkar vara mer fasta med sina gränser och anser att det inte bör vara deras ansvar att ta fram koden, jämfört med designstudenter.
Abstract [en]
For decades, there has been a clear division between the work of designers and developers. Misunderstandings and poor communication can easily occur during collaboration, which can lead to problems such as Design breakdowns during the hand-off process. Various tools are continuously updated to support collaboration between these roles and facilitate collaboration. The tools that we particularly focus on in our study are the design tool Figma, the development environment Android Studio, and the plugin extension Relay. We focus on examining designers' emotions during the process of using these tools to bring their design work to code. Co-discovery workshops were conducted and a reflection survey was completed afterwards. An affinity diagram was used to analyze the data and the answers to the survey questions were mainly put together in the form of diagrams. The results show that designers experienced the process as complex but at an acceptable level and they felt positively about the concept, but desired further development and improvement on various levels. They felt limited in their design work by Relay within Figma and experienced difficulties in exporting the UI package from Figma, and especially importing it into Android Studio. They found it very complicated to navigate and understand the contents of Android Studio, especially as a beginner in that environment. The discussion of these results focuses a lot on underlying factors. Experience and uncertainty with unfamiliar tools such as Relay and Android Studio meant that designers experienced most of the problems in connection with these. Gaps between roles made it difficult for designers to step into the developers' work environment. Conclusions can be summarized as follows:
•Designers experience the process positively in general, but improvements are desired.
•The concept of translating design into code is desirable, but designers hope that the tools can continue to evolve to better meet their goals and perspectives with fewer limitations
•More introduction and clearer navigation is needed, especially in Android Studio.
•The process in Android Studio was significantly more difficult than the one in Figma.
•Professional designers seem to be more firm with their boundaries and feel that it should not be their responsibility to produce the code, compared to design students.
Place, publisher, year, edition, pages
2024.
Keywords [en]
Human-computer interaction, division of labor, design and developer collaboration, hand-off process, design breakdowns, Figma, Android Studio, Relay, co-discovery, workshop, user experience, affinity diagram, qualitative and quantitative analysis, future improvements.
Keywords [sv]
Människa-datorinteraktion, arbetsfördelning, design-och utvecklarsamarbete, hand-off process, “design breakdowns”, Figma, Android Studio, Relay, “co-discovery”, workshop, användarupplevelse, affinitetsdiagram, kvalitativ och kvantitativ analys, framtida förbättringar.
National Category
Human Computer Interaction
Identifiers
URN: urn:nbn:se:su:diva-242677OAI: oai:DiVA.org:su-242677DiVA, id: diva2:1955568
2025-04-302025-04-30