Complex components abstraction to simplify a visual interface specification

Resumo

The term user interface (UI) is most of the times associated to what a user see and interact with. Nowadays, there are a huge variety of user interface types and interaction styles and, therefore it emerges a demand of specific tools and methodologies to support the design process. Along the years, several researchers have proposed a multitude of specification methods enabling the representation of user interfaces. However, there is a lack in specification methods that consider at once: to allow specifying not only the interface components (usually known as widgets) but concomitantly use those components to represent the interface as a whole. This dissertation addresses the specification and representation of interactive GUI (Graphical User Interface) prototypes, based on direct manipulation interaction style, using interactive visual components. Specifically, this thesis contributes to the formalization process of interface complex components, from non-functional prototypes with free design issues. The conducted research has a UI designer centred perspective, since the interface designer can freely establish the interface functionality, including the visual elements to be used, independently of any platform or programming environment. To overcome the identified limitation of current methods, a new complex component concept is introduced, allowing increasing the amount of abstraction in the user interfaces construction process. In order to exemplify, compare and validate the presented methods, a test bed user interface of a simple 2D game is presented. This interface is originally represented by simple components using a well-established methodology. From there, it was possible to verify the complex components abstraction, obtained from simple components and thus, to contribute to reduce the complexity of the interface design process. An algorithm that allows the identification of complex components from state diagrams, representing the UI functionality, is introduced. As a result of this algorithm the interface representation becomes simpler as it reduces the number of represented states and transitions. Complex components reusability is also demonstrated to contribute to simplify the design of other new UIs. This thesis also introduces a new specification language and an automated prototyping system, supporting the new complex component concept, and consequently enabling the specification of complete and interactive visual user interfaces. Comparing to existent approaches, the proposed complex component, together with the developed specification language, have a potentially wider application as they enable a more expeditious specification of complete visual interfaces. Furthermore, they enable to use interface components independently of platforms and/or predefined widgets toolkits (which usually merely allows the presentation manipulation).