Dell Products Inc.

Patrick East

Sumedh Wasudeo Sathaye

Jennifer M Minarik

Kelly L Lisai

Reut Kovetz

Jehuda Shemer

Nicole Reineke

Arthur F Lent

An automated system for implementing visual testing of a Graphical User Interface (GUI) of an implemented product is provided. A codified user experience design is used to automatically create precompiled code. The precompiled code is executed to generate a GUI based on the intended codified user experience design. The implemented product code is executed to generate a GUI of the implemented product code. Screenshots of the GUIs are compared to perform automatic visual testing of the implemented product code from the codified user experience design.

Visual testing of implemented product code from a codified user experience design

Designers create user experience designs using external design systems. An Experience Design Codification and Management System (EDCMS) retrieves a user experience definition based on the user experience design from the external design system, and generates a comprehensive user experience specification from the user experience definition. Part of the comprehensive user experience specification includes JSON, XML, or YAML code created based on the user experience definition. The EDCMS then packages and encodes the comprehensive user experience specification to create a codified user experience from the comprehensive user experience specification. The codified user experience is then versioned and digitally signed, and the versioned and signed codified user experience is stored in a user experience design repository.

Method and apparatus for codifying user experience designs and managing the codified user experience designs

An automated template and logic generator retrieves a codified user experience design having persona and outcome metadata and a finite state machine. An aggregation engine walks the finite state machine, identifies objects in each state, and selects components that correspond with the objects from a component library. Actions associated with the components are identified, and used to identify API calls that are required to be made to implement the actions. Corresponding APIs are aggregated to create a back-end for front-end (BFF) layer for the codified user experience definition. A pattern is created for a front-end layer for the codified user experience design based on the FSM. A code generator builds components to the objects of the codified user experience design to generate precompiled code, which is packaged with a node.js layer to allow local runtime. The generated precompiled code is versioned and placed in the user experience design repository.

Automatic template and logic generation from a codified user experience design

A partially completed user experience design can be completed by selecting a previous codified user experience design, and determining portions of a Finite State Machine of the previous codified user experience design that should be added to a FSM of the partially completed user experience design. This enables use of a previous codified user experience designs to complete the FSM of a partially completed user experience design. Previously codified user experience designs can also be used as the basis for creation of new user experience designs. A previously codified user experience design is selected, and newly created portions of the FSM that are to be added to the FSM of the previously codified user experience design are added to the FSM of the previously codified user experience design. In both instances, components and patterns of the user experience design are automatically substituted to ensure uniformity within the created design.

Completing partially constructed designs and creating new designs based on existing designs

Codified graphical user experience design includes finite state machine (FSM) metadata, logic describing the graphical aspects of the user experience design, and logic describing states of the user experience design and transitions between states. A GUI to API/CLI translator uses the codified graphical user experience design to automatically create corresponding CLI packages and API playbooks. The translator walks the FSM. For each visited state, a state based functional intermediate code package is created including the one or more API call basic blocks associated with API calls to be implemented at that state, and parameter definitions for each API call at that state. For each state transition, conditional intermediate code is created and attached to the API call basic blocks. The state based functional intermediate code packages with attached conditional intermediate code are used to create a CLI package or an API playbook based on the codified graphical user experience design.

Creating CLI packages and API playbooks from codified graphical user experience designs

An automated system automatically creates compliance checking code that is used to test the functional aspects of implemented product code. Intermediate code blocks are created that are then written into compliance checking code, to enable automatic creation of compliance checking scripts designed to test the implemented product code for compliance with persona, outcome, states and state transitions, consistency rules, and annotations specified by the codified user experience design.

Growing community of inventors

Arvada, CO, United States of America

Patrick East