Hochschule Düsseldorf
University of Applied Sciences
Fachbereich Medien
Faculty of Media

Aktuelles

Medien / FB M, Prof. Dr. Markus Dahm, Medieninformatik, Master, Usability
15.06.2022

Automatisierter Usability-Check in Figma

​Automatisierte Analyse und Bewertung der Usability von GUIs in FIGMA

Masterarbeit von Lara Bertram - Juni 2022

Betreung: Prof. Dr. Markus Dahm, Prof. Dr. Alina Huldtgren

Evaluationen sollten zur Sicherstellung und Verbesserung der Usability im Laufe der Entwicklung interaktiver Anwendungen regelmäßig durchgeführt werden. Automatisierte Herangehensweisen können zeit- und kosteneffektive Evaluationen ermöglichen, indem sie auf die Teilhabe von Test- und Fachpersonen verzichten. Vor allem in frühen Phasen der Entwicklung könnten dadurch Usability-Evaluationen ohne großen Aufwand ermöglicht werden.

In diesem Beitrag wird ein Konzept zur automatisierten Usability-Evaluation von UI-Prototypen beschrieben. Der Ansatz bietet eine Ergänzung zu klassischen Usability-Evaluationsmethoden und zielt auf eine zeit- und kosteneffiziente Durchführung von Evaluationen zur Unterstützung gestalterischer Arbeiten ab.

Zur Erprobung des Konzepts wurde eine Anwendung implementiert, die die Evaluation von Gestaltungsentwürfen in Figma vornimmt.

Die Evaluation erfolgt auf Basis einiger Usability-Metriken, des GOMS-Modells zur Modellierung von Interaktionsfolgen und der Vorhersage der Bearbeitungsdauer und Hinweismustern zur Identifikation von Usability-Problemen in Interaktionsabläufen.

Das Werkzeug wurde im Rahmen einiger Tests erprobt und evaluiert, wodurch Erkenntnisse über die Eignung des Konzepts gewonnen und Ansätze zur Weiterentwicklung identifiziert wurden.


--------------------

Dokumente und mehr Informationen:


Masterarbeit: Masterarbeit_Bertram_Figma_Usability_Plugin.pdf


Beitrag zum Workshop HCI-WS06: Augmenting Usability Evaluation auf der Konferenz Mensch und Computer 2022: Conceptual design and implementation of an automated metrics and model-based usability evaluation of UI prototypes in Figma.


Plugin für Figma: https://github.com/larajb/figma-plugin-ma

Also in english: branch english-version.


Kontakt: Lara Bertram   Markus Dahm


------------------

English Version:


Automated Analysis und Grading the Usability of GUIs in FIGMA

Master Thesis of Lara Bertram - Juni 2022

Supervision: Prof. Dr. Markus Dahm, Prof. Dr. Alina Huldtgren

Evaluations should be conducted regularly throughout the development of interactive applications to ensure and improve usability. Automated approaches can enable time and cost effective evaluations by eliminating the need for test and expert participation. Especially in early phases of development, this could enable usability evaluations without much effort.

This paper describes a concept for automated usability evaluation of UI prototypes. The approach offers a supplement to classical usability evaluation methods and aims at a time- and cost-efficient implementation of evaluations to support design work. To test the concept, an plugin application was implemented that evaluates design drafts in Figma.

The evaluation is based on some usability metrics, the GOMS model for modelling interaction sequences and predicting processing time and hint patterns for identifying usability problems in interaction sequences.

The tool was tested and evaluated in a number of trials, which provided insights into the suitability of the concept and identified approaches for further development.