Getting Started
A plug-in is an application that adds specialized data and features to vSphere Client. For your plug-in to be successful, you must integrate it using the defined vSphere patterns. This will provide a users a consistent experience.
If you are migrating your plug-in from a previous version of vSphere to vSphere Client (HTML5), see this summary of changes.
Integration Principles
As you begin to sketch the integration story for your plug-in, follow these important, high-level principles.
Put launch points where users need them
You can provide access to your plug-in from these locations: Navigator, Shortcuts page, main workspace (object workspace, global view, list view) and Actions menu.
Provide a consistent experience
Know the information architecture and the intent of each view in vSphere Client, then integrate your plug-in using the defined extension points, navigation mechanisms, and standard design patterns. It is vital that your plug-in operates in a familiar, congruent manner.
Integrate "side-by-side," but leave room for others
The data for your objects will be side-by-side with data for other plug-ins—users need to view all aspects of an object in one place. Use only one area per view to enable your workflow. For example, add only one pointer in the top-level of the Navigator and a single portlet in the Summary tab.
Essential Resources
These resources can help jumpstart the design and development of your plug-in.
The vSphere Client SDK provides libraries, sample plug-ins, documentation, and tools to help you develop and build user interface extensions.
The List of Extension Points describes the current extensions and their definition types.
The HTML Client plug-in seed provides an application skeleton for creating an object workspace, including the structure of Summary, Monitor, Configure tabs and the tabs for related objects.
The Clarity Design System is a VMware open-source project that provides the look and feel of the vSphere Client, including typography, grids, color, and components.
The Clarity documentation is a source of component styling and usage guidelines for your plug-in. The documentation includes live examples and code.
The Clarity Sketch template offers ready-to-use components to jumpstart wireframing.
The VMware Certification program allows partners to test the reliability and stability of their integration.
The integration compliance checklist can help you evaluate your plug-in's integration within the vSphere Client UI.
Changes in vSphere Client
Although the vSphere Client (HTML5) includes improvements to the user experience, the overall organization of the UI is the same as in previous versions of vSphere. Depending on which version of the Client you are migrating from, you might notice these changes:
- The new, modern look and feel of vSphere Client comes from the Clarity Design System.
- In the Summary tab, alerts also use color to represent meaning: red for error, yellow for warning, and blue for information.
- The Manage tab has been renamed Configure to better convey its meaning: editing an object's settings.
- The Monitor and Configure tabs use a single, vertical table of contents (TOC) for navigation, instead of multi-level horizontal subtabs.
- The Permissions tab, formerly under Monitor, is now a top-level tab.
- Categories of related objects appear as top-level tabs (instead of under a single Related Objects tab).
- The Getting Started tab has been removed.
Explorations include:
- Using the home page as a dashboard (instead for shortcuts).
- Moving the display of data from portlets to cards on the Summary tab.
The latest design is in the vSphere Client Fling.