Launch Instance Redesign

Registered by Travis Tripp

This is a redesign of the launch instance form which will incorporate the UX collaboration done in the community before during and after the Kilo design summit. It will be based on angular and will incorporate many aspects of the development previously done by Maxime Vidori and will be jointly developed by HP, eNovance, and Intel. It will also track the ongoing angular discussions and changes happening in Horizon.

Launching an instance is often one of the first touch points that new users have with OpenStack. The current launch instance form has been received poorly by new users and causes OpenStack to be unapproachable. We want to enable a more modern UI that is also more end-consumer friendly.

The launch instance workflow will include a modern layout, access to enhanced descriptions, and an improved help system.

We will break it out into multiple pieces and patches, starting with a reusable angular based wizard. Additional potential breakouts will be a new reusable table format design. Each step may be broken into separate patches as well. We'll do our best to create easy to review code, which may mean multiple dependent patches.

The initial revision will only add a few incremental features over current functionality:
 * Add a network from within the launch wizard
 * Provide easy access to additional descriptive information about flavors, images, and volumes. In Juno, a metadata catalog was added to Glance which provides the ability for rich information to be looked up about the properties on things like flavors, images, and volumes. For example, a flavor may have specific information about the virtual cpu topology it exposes or an image may set specific shutdown behavior. This information, along with a description of it will be available to users by leveraging this catalog.

This was discussed in numerous sessions at the Kilo summit:

Links to discussions at summit:
UX discussion:
Contributors meetup:


The design has been done with the community and will be continued to be iterated on as necessary.

Wireframes, Mocks, Videos and UI Markup
The user experience has been mocked up through many rounds of iteration with the community as well as multiple formal usability studies:

The iteration in the community has led to the following concepts being incorporated:

 * Be approachable to new users with information and help readily available
 * Ease of navigation between sections of information
 ** Support a layout that will allow deployers to add / remove steps in the future
 * Allow immediate launch as soon as the minimal possible information is set
 * Provide quick access to advanced settings for advanced users
 * Support adding networks as part of launch

Reviewers will be able to pull the patch from Gerritt. Initially, we may provide a private URL for them to access as it is developed. Eventually, the current Launch Instance button will be wired to launch the new workflow.

Outside Dependencies
Is this functionality already supported in other services? Yes. If landed in Kilo, the wizard may be updated to also take advantage of the Glance elasticsearch capability being developed.

List the appropriate API calls and if they are extensions or base API functionality. The below are all the existing APIs that are base functionality which will be used.


Requirements Update Required
Angular 1.3.7
Jasmine 2.x
Angular-Bootstrap added
Others as determined by angular discussions happening in the community.

Doc Impact
This should describe any changes to Horizon documentation that will be required. This could include:
  * settings file changes that will be required
  * changes to default behaviors
  * any deprecation or obsolescence notices

Only docs that have screenshots or discussion of the current workflow should be affected.


# determine the experience to enable. Set them both to true to enable
# both.


Blueprint information

David Lyle
Travis Tripp
Travis Tripp
Series goal:
Accepted for kilo
Milestone target:
milestone icon 2015.1.0
Started by
Travis Tripp
Completed by
David Lyle

Related branches



Note: Some design and collaboration across companies is being tracked here: See here:

Gerrit topic:,topic:bp/launch-instance-redesign,n,z

Addressed by: -- merged
    WIP REST API for create instance angular front end

Addressed by: -- abandoned
    Setup launch instance wizard framework

Addressed by: -- merged
    Update angular to 1.3.7

Addressed by: -- merged
    WIP Donut chart directive

Addressed by: -- merged
    WIP Re-designed and Angularized tables

Addressed by: -- abandoned
    WIP REST API to support create instance angular (Neutron)

Addressed by: -- merged
    Glance Rest API for Angular Front End

Addressed by: -- merged
    WIP Cinder REST API for angular front end

Addressed by:
    Metadata display widget

Addressed by: -- merged
    Refactor, customization and fixes of Metadata Widget

Addressed by: -- merged
    Metadata widget support for default values

Gerrit topic:,topic:angularServiceNeutron,n,z

Addressed by: -- abandoned
    basic angular-based launch instance wizard

Addressed by:
    WIP Angular alert/messaging service

Addressed by: -- merged
    WIP Transfer tables

Addressed by: -- merged
    Base launch instance wizard

Addressed by:
    Enabling auto-focus on first form element

Addressed by: -- merged
    Base dashboard Jasmine framework

Addressed by: -- merged
    Network Rest API for Angular Front End

Addressed by:
    Trapping focus

Gerrit topic:,topic:bp/instance-details-redesign,n,z

Addressed by: -- merged
    Angular Filter files

Gerrit topic:,topic:service_catalog_rest,n,z

Addressed by: -- merged
    Add service catalog get for keystone REST API

Addressed by:
    WIP Directive to allow editing of table values

Addressed by: -- merged
    Nova Flavor Server Extensions Rest APIs - Angular

Addressed by: -- abandoned
    Adding Advanced step to base launch instance wizard

Gerrit topic:,topic:demo/focus-trap,n,z

Addressed by: -- merged
    Angular-based Modal Wait Spinner Widget

Addressed by: -- merged
    REST API to support create instance angular (Neutron).

Addressed by: -- merged
    Launch Instance Model

Addressed by: -- merged
    Launch Instance Step - Select Source

Addressed by: -- merged
    Launch Instance Step - Select Flavor

Addressed by: -- merged
    Launch Instance Step - Access and Security

Addressed by: -- merged
    Launch Instance Step - Network

Addressed by: -- merged
    Launch Instance Step - Select Source

Addressed by: -- merged
    Refactor of Metadata Widget

Gerrit topic:,topic:158936,n,z

Addressed by: -- merged
    Warning popover in transfer tables

Addressed by: -- merged
    REST Angular for Cinder Fix

Addressed by: -- merged
    WIP - Launch instance - common style

Addressed by: -- merged
    Updated Wizard Help Panel Design

Gerrit topic:,topic:modal_wait_spinner_demo,n,z

Addressed by: -- abandoned
    Add callback to allow controller notification of allocation change

Addressed by: -- DO NOT MERGE (DEMO)
    Demo for transfer tables and basic table

Addressed by: -- abandoned
    Add 'decode' Angular filter

Addressed by:
    upstream deltas needed for neutron api

Addressed by:
    Launch Instance Step - Key Pair Import

Addressed by:
    Launch Instance - Optional Network Enabled

Gerrit topic:,topic:bug/1432769,n,z

Gerrit topic:,topic:bug/1432810,n,z

Gerrit topic:,topic:bug/1432401,n,z

Addressed by:
    WIP Angular alert service - add auto dismiss

Addressed by:
    Angular alert service - refactor use


Work Items

Dependency tree

* Blueprints in grey have been implemented.

This blueprint contains Public information 
Everyone can see this information.