Skip to end of metadata
Go to start of metadata


All UX interaction prototypes and visual design work can be found here.


SubjectDescriptionDesign Link(s)AreaDate Updated

End-to-End Prototype

(OLD - Not up to date)


First draft design - Low-Fi prototype for use in customer sessions

Second draft design - Low-Fi prototype with design (but without primitive flow creation).

The final design is shown in each aspect described below. However there is no end to end prototype.

https://emcux.invisionapp.com/share/ST9NSTZWU


https://emcux.invisionapp.com/share/CDACQX5J5

interaction

1/16/17


2/7/17

Primitive Creation Wizard


Current interaction prototypes for primitive creation for Local Ansible, REST API calls, and Shell script primitiveshttps://emcux.invisionapp.com/share/8TA0E4W96Interaction1/16/17
Basic StructureTabs, Buttons, and basic structural elements

Visual Designs - https://inside.dell.com/docs/DOC-240481


1/18/17

Library UI



Interaction prototype -

https://emcux.invisionapp.com/share/GAATT0E5P


Interaction

+ Visuals

3/20/17

WF-Tab:

Input/Output Parameters and Library


Design

  • Library (contains operations and workflows you drag and drop to the canvas)
  • Input/Output parameters
https://emcux.invisionapp.com/share/2EAKWKP8RInteraction + Visuals3/20/17

Error Handling + Validation


Alerting and messaging for tab-specific issues, such as workflow errors and validation.Visual Designs - https://inside.dell.com/docs/DOC-240581

Interaction

+ Visuals

1/18/17

Workflow Diagram


Design on how we create the diagram step by step including the visuals and interaction.


We considered 3 layouts for the diagram, they are visualized in the link below:

https://emcux.invisionapp.com/share/A3AX2KH7Q

The same complex diagram was displayed in these 3 different layouts to compare and decide which one is better and based on the results we decided to proceed with layout 2-sides

The design on how you build a diagram on the canvas is here:

https://emcux.invisionapp.com/share/8ZAVPV1TJ


Start- old design below - ignore for now

Visual Design - https://inside.dell.com/docs/DOC-240464

Interaction prototype - https://invis.io/KG9VTJCWP
(can follow guided explanation by clicking flashing blue dot, or click around on own.)

End- old design below - ignore for now

Interaction

+ Visuals

3/20/17
Icons

The following icons (16x16 pixels) should be used in the tree-view on left of a tree-node label.

- User created WF

- User created Operation
- ViPR-C WF
- ViPR-C Operation
Visuals2/7/17
  • No labels