A Graphical User Interface (GUI) is defined by its appearance and its behavior. A GUI’s behavior determines how it reacts to user and system events such as mouse, keyboard, or touchscreen presses, or changes to an underlying data model. Although many tools are effective in enabling designers to specify a GUI’s appearance, defining a custom behavior is difficult and error-prone. Many of the difficulties developers face in defining GUI behaviors are the result of their reactive nature. The order in which GUI code is executed depends upon the order in which it receives external inputs. Most widely used user interface programming frameworks use an event-callback model, where developers define GUI behavior by defining callbacks—sequences of low-level actions—to take in reaction to events. However, the event-callback model for user-interface development has several problems, many of which have been identified long before I started work on this dissertation. First, it is disorganized: the location and order of event-callback code often has little correspondence with the order in which it will be executed. Second, it divides GUI code in a way that requires writing interdependent code to keep the interface in a consistent state. This is because maintaining a consistent state requires referencing and modifying the same state variables across multiple different callbacks, which are often distributed throughout the code. In this dissertation, I will introduce a new framework for defining GUI behavior, called the stateconstraint framework. This framework combines constraints—which allow developers to define relationships among interface elements that are automatically maintained by the system—and state machines—which track the status of an interface. In the state-constraint framework, developers write GUI behavior by defining constraints that are enforced when the interface is in specific states. This framework allows developers to specify more nuanced constraints and allows the GUI’s appearance and behavior to vary by state. I created two tools using the state-constraint framework: a library for Web developers (ConstraintJS) and an interactive graphical language (InterState). ConstraintJS provides constraints that can be used both to control content and control display, and integrates these constraints with the three Web languages—HTML, CSS, and JavaScript. ConstraintJS is designed to take advantage of the declarative syntaxes of HTML and CSS: It allows the majority of an interactive behavior to be expressed concisely in HTML and CSS, rather than requiring the programmer to write large amounts of JavaScript. InterState introduces a visual notation and live editor to clearly represent how states and constraints combine to define GUI behavior. An evaluation of InterState showed that its computational model, visual notation, and editor were effective in allowing developers to define GUI behavior compared to conventional event-callback code. InterState also introduces extensions to the state-constraint framework to allow developers to easily re-use behaviors and primitives for authoring multi-touch gestures.

Uma interface com o usuário é composta por duas "vias" de comunicação, uma que vai do usuário até o sistema e outra que vai do sistema até o usuário. Cada uma destas "vias" possui um formalismo que define a comunicação associado. Neste trabalho, estes formalismos são descritos com uma gramática de atributos. Esta gramática foi expandida de forma a permitir a definição dos elementos que compõe a interface do usuário, e da estrutura que irá controlar a seqüência de execução das tarefas oferecidas pelos sistemas de aplicação. Ao longo do trabalho são discutidas algumas técnicas de descrição do formalismo de comunicação entre interface e sistema, são abordados os estilos de interação e apresentada as expansões aplicadas sobre gramáticas de atributos. Um exemplo auxilia a compreensão do uso da linguagem proposta, e um protótipo permite a validação das definições. / A user interface is composed by two "ways" of communication, one from the user to the system and the other linking the system to the user. Each of these "ways" has it's own mechanism. In this work, these mechanisms are described through an attribute grammar. This grammar has been expanded to allow the definition of the structure of the interface elements and the control of the execution of the tasks that the application system implements. Through this work, technics that describe the communication between the interface and the system, interaction styles and the extensions made on attribute grammar are discussed. An example is given to explain the use of the proposed mechanism and a prototype validates ideas discussed.

Uma interface com o usuário é composta por duas "vias" de comunicação, uma que vai do usuário até o sistema e outra que vai do sistema até o usuário. Cada uma destas "vias" possui um formalismo que define a comunicação associado. Neste trabalho, estes formalismos são descritos com uma gramática de atributos. Esta gramática foi expandida de forma a permitir a definição dos elementos que compõe a interface do usuário, e da estrutura que irá controlar a seqüência de execução das tarefas oferecidas pelos sistemas de aplicação. Ao longo do trabalho são discutidas algumas técnicas de descrição do formalismo de comunicação entre interface e sistema, são abordados os estilos de interação e apresentada as expansões aplicadas sobre gramáticas de atributos. Um exemplo auxilia a compreensão do uso da linguagem proposta, e um protótipo permite a validação das definições. / A user interface is composed by two "ways" of communication, one from the user to the system and the other linking the system to the user. Each of these "ways" has it's own mechanism. In this work, these mechanisms are described through an attribute grammar. This grammar has been expanded to allow the definition of the structure of the interface elements and the control of the execution of the tasks that the application system implements. Through this work, technics that describe the communication between the interface and the system, interaction styles and the extensions made on attribute grammar are discussed. An example is given to explain the use of the proposed mechanism and a prototype validates ideas discussed.

Uma interface com o usuário é composta por duas "vias" de comunicação, uma que vai do usuário até o sistema e outra que vai do sistema até o usuário. Cada uma destas "vias" possui um formalismo que define a comunicação associado. Neste trabalho, estes formalismos são descritos com uma gramática de atributos. Esta gramática foi expandida de forma a permitir a definição dos elementos que compõe a interface do usuário, e da estrutura que irá controlar a seqüência de execução das tarefas oferecidas pelos sistemas de aplicação. Ao longo do trabalho são discutidas algumas técnicas de descrição do formalismo de comunicação entre interface e sistema, são abordados os estilos de interação e apresentada as expansões aplicadas sobre gramáticas de atributos. Um exemplo auxilia a compreensão do uso da linguagem proposta, e um protótipo permite a validação das definições. / A user interface is composed by two "ways" of communication, one from the user to the system and the other linking the system to the user. Each of these "ways" has it's own mechanism. In this work, these mechanisms are described through an attribute grammar. This grammar has been expanded to allow the definition of the structure of the interface elements and the control of the execution of the tasks that the application system implements. Through this work, technics that describe the communication between the interface and the system, interaction styles and the extensions made on attribute grammar are discussed. An example is given to explain the use of the proposed mechanism and a prototype validates ideas discussed.

The focus of this research is to investigate the potential of user interface (UI) pattern languages in assisting students of Human Computer Interaction (HCI) to learn the principles of UI design. A graphical representation named a UI-pattern model was developed. It arose from the evaluation of four existing pattern languages. The UI-pattern model is an enhanced form of UI pattern list that represents a specific UI. It was recognised that the UI-pattern model has the potential to help students learn about pattern language structure. It was also realised that UI-pattern modelling can be used to incrementally improve pattern languages through the generative process proposed by Alexander (1979). A UI pattern language Maturity Model (UMM) has been developed. This model can be used by educators when selecting and/or modifying existing UI pattern languages so that they are more appropriate for student use. A method for developing detailed UI designs that utilises a UI pattern language has been developed with the aim of providing students with an ‘authentic’ real-world UI design experience, as envisaged by constructivist educational theory (Jonassen 1999). This UI design method (TUIPL) guides the students’ development of user interface conceptual models. To establish the authenticity of TUIPL three case studies were undertaken out with developers who had differing levels of UI design experience. A series of studies investigated how HCI students used TUIPL to guide the development of UI-pattern models and canonical abstract prototypes. The studies also ascertained the students’ views on using three different forms of UI pattern (illustrated, narrative and diagrammed). Data was collected by observation, questionnaires and completed exercises. The results indicate that the students developed an understanding of pattern language structure, were positive about their experience building UI-pattern models and canonical abstract prototypes, and that patterns aided communication. The learning outcomes were encouraging and students responded positively to using a UI pattern language.

Interação homem-máquina, também difundida com o nome de Interface com o Usuário (ou simplesmente interface), é uma área de pesquisa relativamente recente e evidentemente multidisciplinar. Um importante critério para projeto de interfaces é a separação de um programa interativo em seu componente computacional (aplicação) e seu componente de diálogo (que implementa a interface) • Esta separação, denominada independência de diálogo, . cr1a o papel do projetista de interfaces separado do programador da aplicação e a necessidade de novas comunicações entre os componentes do programa e o usuário. O componente de diálogo é usualmente construído usando-se alguma Ferramenta para Desenvolvimento de Interfaces com o Usuário (abreviadas FIUs) para definição e manipulação de interfaces. As FIUs comercialmente disponíveis atualmente (na sua maioria "toolboxes" como MicroSoft Windows e Macintosh Toolbox, entre outras), no entanto, não são tão facilmente utilizáveis, contendo literalmente centenas de rotinas e confundindo freqüentemente os papéis do projetista de interfaces e do programador da aplicação. Isto acarreta prejuízos à almejada independência de diálogo .Além disto, devido às idiossincrasias de cada FIU, o p r ograma interativo é desenvolvido direcionado para o uso de uma FIU específica, necessitando de uma série de reformulações em caso de mudanças de FIU. O objetivo da dissertação é a proposta de uma FIU Canônica que permite: a) uma definição de interface de maneira mais adequada aos usuários projetistas, programador da aplicação; e mais notadamente ao b) a portabilidade de programas interativos entre diferentes FIUs. O componente principal da FIU Canônica é o seu modelo representacional orientado a objetos, o Canonicus, que contém as abstrações necessárias para o uso adequado dos usuários projetistas. A portabilidade vem do fato da FIU Canônica ser, na verdade, uma camada intermediária entre a aplicação e uma FIU. Sua implementação consiste na tradução de seus objetos e operações para objetos e operações de alguma FIU subjacente. Nesta dissertação sao apresentados a arquitetura da FIU Canônica e o seu modelo representacional Canonicus assim como a sua implementação sobre duas FIUs tipo "toolbox" comerciais, o MicroSoft Windows e o Macintosh Toolbox. / Human-computer interactionf interface f lS a mul tidisciplinary and research issue. also named use r relatively recent An important criteria to user interface design is the separation of interactive program in two components: computational component (application) and dialogue component (which implements the user interface). This separationf interface named dialogue independencef independent creates the user designer role of application programmer role and new components-user communications. The dialogue component is usually constructed by using some User Interface Development Tool (abreviated FIU) to both user interface definition and manipulation. The comercial FIUs available (most of them are toolboxes like MicroSoft Windows and Macintosh Toolbox) f howeverf are often not so easily usable, since they contain literally hundreds of procedures and they confuse the interface designer and application programmer roles. Thus the desirable dialogue independence is prejudiced. Furthermore, an one interactive program is developed directed to use only one specific FIU, since each FIU has its idiosycrasies. In case o f FIU change, several reformulations are needed. The dissertation goal is the purpose of the Canonical FIU. The Canonical FIU allows: a) an user interface definition in more adequate way to its designer-users, more notably the application programmer; and b) interactive programs portability between diferent FIUs. The Canonical FIU main component is its objectoriented representational model, the Canonicus, which contains the needed abstractions to user interface designers. Portability is obtained slnce the Canonical FIU lS an intermediate level between the application and a FIU. The Canonical FIU lS implemented by a translation mechanism, mapping its objects and operations to some subjacent FIU's objects and operations. In this dissertation, the Canonical FIU architecture, its representational model Canonicus and its implementations over two FIUs (MicroSoft Windows and Macintosh Toolbox) are presented.

Interação homem-máquina, também difundida com o nome de Interface com o Usuário (ou simplesmente interface), é uma área de pesquisa relativamente recente e evidentemente multidisciplinar. Um importante critério para projeto de interfaces é a separação de um programa interativo em seu componente computacional (aplicação) e seu componente de diálogo (que implementa a interface) • Esta separação, denominada independência de diálogo, . cr1a o papel do projetista de interfaces separado do programador da aplicação e a necessidade de novas comunicações entre os componentes do programa e o usuário. O componente de diálogo é usualmente construído usando-se alguma Ferramenta para Desenvolvimento de Interfaces com o Usuário (abreviadas FIUs) para definição e manipulação de interfaces. As FIUs comercialmente disponíveis atualmente (na sua maioria "toolboxes" como MicroSoft Windows e Macintosh Toolbox, entre outras), no entanto, não são tão facilmente utilizáveis, contendo literalmente centenas de rotinas e confundindo freqüentemente os papéis do projetista de interfaces e do programador da aplicação. Isto acarreta prejuízos à almejada independência de diálogo .Além disto, devido às idiossincrasias de cada FIU, o p r ograma interativo é desenvolvido direcionado para o uso de uma FIU específica, necessitando de uma série de reformulações em caso de mudanças de FIU. O objetivo da dissertação é a proposta de uma FIU Canônica que permite: a) uma definição de interface de maneira mais adequada aos usuários projetistas, programador da aplicação; e mais notadamente ao b) a portabilidade de programas interativos entre diferentes FIUs. O componente principal da FIU Canônica é o seu modelo representacional orientado a objetos, o Canonicus, que contém as abstrações necessárias para o uso adequado dos usuários projetistas. A portabilidade vem do fato da FIU Canônica ser, na verdade, uma camada intermediária entre a aplicação e uma FIU. Sua implementação consiste na tradução de seus objetos e operações para objetos e operações de alguma FIU subjacente. Nesta dissertação sao apresentados a arquitetura da FIU Canônica e o seu modelo representacional Canonicus assim como a sua implementação sobre duas FIUs tipo "toolbox" comerciais, o MicroSoft Windows e o Macintosh Toolbox. / Human-computer interactionf interface f lS a mul tidisciplinary and research issue. also named use r relatively recent An important criteria to user interface design is the separation of interactive program in two components: computational component (application) and dialogue component (which implements the user interface). This separationf interface named dialogue independencef independent creates the user designer role of application programmer role and new components-user communications. The dialogue component is usually constructed by using some User Interface Development Tool (abreviated FIU) to both user interface definition and manipulation. The comercial FIUs available (most of them are toolboxes like MicroSoft Windows and Macintosh Toolbox) f howeverf are often not so easily usable, since they contain literally hundreds of procedures and they confuse the interface designer and application programmer roles. Thus the desirable dialogue independence is prejudiced. Furthermore, an one interactive program is developed directed to use only one specific FIU, since each FIU has its idiosycrasies. In case o f FIU change, several reformulations are needed. The dissertation goal is the purpose of the Canonical FIU. The Canonical FIU allows: a) an user interface definition in more adequate way to its designer-users, more notably the application programmer; and b) interactive programs portability between diferent FIUs. The Canonical FIU main component is its objectoriented representational model, the Canonicus, which contains the needed abstractions to user interface designers. Portability is obtained slnce the Canonical FIU lS an intermediate level between the application and a FIU. The Canonical FIU lS implemented by a translation mechanism, mapping its objects and operations to some subjacent FIU's objects and operations. In this dissertation, the Canonical FIU architecture, its representational model Canonicus and its implementations over two FIUs (MicroSoft Windows and Macintosh Toolbox) are presented.

Interação homem-máquina, também difundida com o nome de Interface com o Usuário (ou simplesmente interface), é uma área de pesquisa relativamente recente e evidentemente multidisciplinar. Um importante critério para projeto de interfaces é a separação de um programa interativo em seu componente computacional (aplicação) e seu componente de diálogo (que implementa a interface) • Esta separação, denominada independência de diálogo, . cr1a o papel do projetista de interfaces separado do programador da aplicação e a necessidade de novas comunicações entre os componentes do programa e o usuário. O componente de diálogo é usualmente construído usando-se alguma Ferramenta para Desenvolvimento de Interfaces com o Usuário (abreviadas FIUs) para definição e manipulação de interfaces. As FIUs comercialmente disponíveis atualmente (na sua maioria "toolboxes" como MicroSoft Windows e Macintosh Toolbox, entre outras), no entanto, não são tão facilmente utilizáveis, contendo literalmente centenas de rotinas e confundindo freqüentemente os papéis do projetista de interfaces e do programador da aplicação. Isto acarreta prejuízos à almejada independência de diálogo .Além disto, devido às idiossincrasias de cada FIU, o p r ograma interativo é desenvolvido direcionado para o uso de uma FIU específica, necessitando de uma série de reformulações em caso de mudanças de FIU. O objetivo da dissertação é a proposta de uma FIU Canônica que permite: a) uma definição de interface de maneira mais adequada aos usuários projetistas, programador da aplicação; e mais notadamente ao b) a portabilidade de programas interativos entre diferentes FIUs. O componente principal da FIU Canônica é o seu modelo representacional orientado a objetos, o Canonicus, que contém as abstrações necessárias para o uso adequado dos usuários projetistas. A portabilidade vem do fato da FIU Canônica ser, na verdade, uma camada intermediária entre a aplicação e uma FIU. Sua implementação consiste na tradução de seus objetos e operações para objetos e operações de alguma FIU subjacente. Nesta dissertação sao apresentados a arquitetura da FIU Canônica e o seu modelo representacional Canonicus assim como a sua implementação sobre duas FIUs tipo "toolbox" comerciais, o MicroSoft Windows e o Macintosh Toolbox. / Human-computer interactionf interface f lS a mul tidisciplinary and research issue. also named use r relatively recent An important criteria to user interface design is the separation of interactive program in two components: computational component (application) and dialogue component (which implements the user interface). This separationf interface named dialogue independencef independent creates the user designer role of application programmer role and new components-user communications. The dialogue component is usually constructed by using some User Interface Development Tool (abreviated FIU) to both user interface definition and manipulation. The comercial FIUs available (most of them are toolboxes like MicroSoft Windows and Macintosh Toolbox) f howeverf are often not so easily usable, since they contain literally hundreds of procedures and they confuse the interface designer and application programmer roles. Thus the desirable dialogue independence is prejudiced. Furthermore, an one interactive program is developed directed to use only one specific FIU, since each FIU has its idiosycrasies. In case o f FIU change, several reformulations are needed. The dissertation goal is the purpose of the Canonical FIU. The Canonical FIU allows: a) an user interface definition in more adequate way to its designer-users, more notably the application programmer; and b) interactive programs portability between diferent FIUs. The Canonical FIU main component is its objectoriented representational model, the Canonicus, which contains the needed abstractions to user interface designers. Portability is obtained slnce the Canonical FIU lS an intermediate level between the application and a FIU. The Canonical FIU lS implemented by a translation mechanism, mapping its objects and operations to some subjacent FIU's objects and operations. In this dissertation, the Canonical FIU architecture, its representational model Canonicus and its implementations over two FIUs (MicroSoft Windows and Macintosh Toolbox) are presented.

Šio magistro darbo užduotis – apžvelgti šiuo metu labiausiai naudojamas vartotojo sąsajas, kurios padeda žmogui sąveikauti su kompiuteriais ir kitais įrenginiais bei sąsajų architektūros būdus, kurie palengvina programų kūrimą. Taip pat išanalizuoti šiuo metu plačiausiai naudojamus metodus interneto paslaugoms įgyvendinti, kad būtų rastas sprendimas, kaip interaktyvios informacinės sistemos galėtų bendrauti tarpusavyje be apribojimų reikiamam funkcionalumui gauti pasirenkant geriausią būdą saugoti ir atvaizduoti reikiamus programos duomenis kuo paprastesniu ir lankstesniu būdu. Sukurti lygiagrečių tekstynų prototipą, kuris leistų matyti gautą rezultatą su galimybe kuo lengviau ir greičiau rasti bei koreguoti automatiškai sugeneruotus netikslumus, jei tokie yra, pritaikant sąsają, kuri būtų patogesnė ir reikalautų kuo mažiau darbo pastangų. Pasinaudojant prototipu atlikti tyrimą, kuris parodytų įvesties įrenginių naudojimo tendencijas. Darbą sudaro 8 dalys: įvadas, vartotojo sąsajų apžvalga, vartotojo sąsajos atskyrimas, interneto paslaugų analizė, XML duomenų bazės, vartotojo sąsajos kūrimas, išvados ir literatūros sąrašas. Darbo apimtis – 48 p. teksto be priedų, 25 paveikslai ir 2 lentelės. Atskirai pridedami 2 darbo priedai. / The purpose of this thesis is to review most currently used user interfaces that help people interact with computers and other equipment, and begin exploring new user interface paradigm, which allows humans to interact naturally with the computer. Furthermore, analyze the most widely used methods today for implementing web services, to find a solution how interactive information systems could communicate with each other without any restrictions to gain an overall result choosing the best way to store and display relevant data to the program simpler and more flexible way. Create an interactive parallel corpus development environment prototype for minimizing available errors, if they occur, from the generated parallel translation as easy as possible using as less human labor as possible. Using the prototype, perform a study that will show trends in the use of different interface input devices. The work consists of 8 parts: introduction, overview of user interfaces, user interface separation, web services analysis, XML databases, user interface development, conclusions and references. Thesis consists of: 48 pages of text without appendixes, 25 pictures and 2 tables. Two enclosures of the work are enclosed separately.