The use of no-code editors makes developing web applications more accessible since they are based on Graphical User Interface elements instead of conventional programming languages. This allows users without previous programming experience to design web-application interfaces. However, designing web applications with no-code editors can be a daunting process for beginners without design experience. This study therefore investigates which aspects of no-code editors can support novice designers when designing aesthetically pleasing web-application layouts. A usability analysis of three state-of-the-art no-code editors was conducted using the Cognitive Dimensions of Notations framework. The main aspect that impacted usability in the no-code editors was a difficulty aligning and positioning elements due to hidden dependencies and unforeseen actions. Based on this finding, a prototype was developed to address these issues. The prototype introduced the concept of a "Golden Ratio Guide", a visual guide intended to support the alignment and positioning of elements. A user study was conducted with inexperienced designers (n=5) to test if the Golden Ratio Guide helps with designing aesthetic web-application layouts. Contrary to expectations, a survey with users of such web-applications (n=36) showed that the web-layouts designed without the Golden Ratio Guide were preferred. / Att använda sig av programmeringsfria redigeringsprogram för att utveckla webbapplikationer bidrar till en större tillgänglighet då de är baserade på grafiska användargränssnittselement istället för konventionella programmeringsspråk. Detta tillåter användare utan tidigare programmeringserfarenhet att designa webbapplikationsgränssnitt. Men att designa webbapplikationer i ett programmeringsfritt redigeringsprogram kan vara en skrämmande process för nybörjare utan designerfarenhet. Denna studie undersöker därför vilka aspekter av programmeringsfria redigeringsprogram som stödjer nybörjare med att designa estetiskt tilltalande layouter för webbapplikationer. En användbarhetsanalys av tre programmeringsfria redigeringsprogram relevanta inom fältet genomfördes med hjälp av ramverket Cognitive Dimensions of Notations. Den huvudsakliga aspekten som påverkade användbarheten i programmeringsfria redigeringsprogram var svårigheten att anpassa och placera element på grund av dolda beroenden och oförutsedda händelser. Baserat på denna upptäckt utvecklades en prototyp för att lösa dessa problem. Prototypen introducerade konceptet med en "Gyllene Snittet Guide", en visuell guide avsedd att stödja anpassning och positionering. En användarstudie genomfördes med oerfarna designers (n=5) för att testa om guiden baserad på det Gyllene Snittet hjälper med att designa estetiska layouter för webbapplikationer. Tvärtemot förväntningarna visade en undersökning med användare av dessa webbapplikationer (n=36) att webblayouterna som designats utan guiden baserad på det Gyllene Snittet föredrogs.
| Identifer | oai:union.ndltd.org:UPSALLA1/oai:DiVA.org:kth-334500 |
| Date | January 2023 |
| Creators | Berg, Beatrice |
| Publisher | KTH, Skolan för elektroteknik och datavetenskap (EECS) |
| Source Sets | DiVA Archive at Upsalla University |
| Language | English |
| Detected Language | Swedish |
| Type | Student thesis, info:eu-repo/semantics/bachelorThesis, text |
| Format | application/pdf |
| Rights | info:eu-repo/semantics/openAccess |
| Relation | TRITA-EECS-EX ; 2023:377 |
Page generated in 0.0022 seconds