Speeding Up the Prototyping of Low-Fidelity User Interface Wireframes

Abstract

Prototyping for user interfaces (UIs) is essential when it comes to giving an idea for how the final result will look and function. This allows both designers and stakeholders to test if all the project requirements are being fulfilled and the functionality of the UI, saving time and money further down the road when the final product is being made. However, current established prototyping tools have an emphasis on visual aesthetics without support for quickly producing low-fidelity prototyping. This leads to the initial prototyping process to be time-consuming and labor-intensive as designers need to start from scratch. In this research, we propose a solution that hopefully speeds up the low-fidelity UI prototyping process by streamlining the workflow. Based on previous research of scenario-based UI design and utilizing UI design patterns and sketching, we created a Figma plugin tool for guiding the creation of low-fidelity wireframe prototypes. We then conducted a user study which revealed that the plugin was easy to learn and use with a lower subjective workload for physical demand, temporal demand, and frustration. The contribution of our work is providing an alternative approach for designers and stakeholders to collaborate together and facilitate easy prototyping of low-fidelity UI wireframes.