Design and Web team summary – 03 September 2019

This was a fairly busy two weeks for the Web & design team at Canonical.  Here are some of the highlights of our completed work.

Web squad

Web is the squad that develop and maintain most of the brochure websites across the Canonical.

Build and release dqlite.io

The dqlite.io site has been built and deployed. It will gain a discourse in the near future but for now, the documentation is housed in the project.

Ubuntu.com has been upgraded to Vanilla 2.3.0

A vast majority of the work was updating the markup to match the new classes and mark up structure required for Vanilla 2.

Design takeover templates

To speed up delivery of takeovers we are planning to create a set of takeovers which can be reused. This should speed up the design and development of the takeovers going forward.

Base

Base is the team that underpins our toolsets and architure of our projects. They maintain the CI and deployment of all websites we maintain. 

Certification development

Development of the certification site has been completed and just in QA before being released and replace the current certification website.

MAAS

The MAAS squad develop the UI for the maas project.

Convert settings to React

Most of the parts of settings are now in React, the only outstanding ones are DHCP snippets and Scripts, which will be completed in the next iteration. 

Machine summary network card design

The machine summary page shows a summary of the physical characteristics of a machine, we are adding a new card this cycle, that displays the network characteristics. After a number of iterations, we decided on including the fabric (untagged traffic only) that the interface is connected to, link speed and status, DHCP and SR-IOV overview. 

JAAS

The JAAS squad develops the UI for the JAAS store and Juju GUI  projects.

JAAS Dashboard

The team started building and implementing the design of the JAAS dashboard / monitoring tool. The new Juju GUI allows Juju to scale up, targeting enterprises and users with many models to manage. The new GUI brings all bootstrapping together, highlighting the status of all models with metadata about the controllers, analytics and stats. JAAS is the intersection of Juju, CLI, models and solutions.

Juju website

The team is also working on a standalone Juju website that will be focusing on updated docs and specific information on how to get started with the Juju framework.

CharmHub & CLI

The team is working on defining the user experience and the interface of ‘search’, ‘detail’ and publisher pages of the new store, aligning the user experience with Snap and Snapcraft. The same alignment is reflected in the CLI, where the commands on Snapcraft and Charm (publishing stream) and Snap and Juju (operational stream) are getting consistent, with a common user experience and approach.

Vanilla

The Vanilla squad design and maintain the design system and Vanilla framework library. They ensure a consistent style throughout web assets.  

login.ubuntu.com on Vanilla

On the final stretch to migrating login.ubuntu.com to Vanilla 2.3.0, this iteration we’ve completed all account pages, updated the email template and some miscellaneous pages found in the IA.

JS in documentation

We currently don’t document that some components require JavaScript, and that users will need to provide the implementation. First pass is adding a notification within the docs page with a functionality section.

 This iteration we designed a pattern to display the JS required for a Vanilla components,  which has been designed and will be developed in the coming weeks to supersede our current implementation.

Snapcraft

The Snapcraft team work closely with the snap store team to develop and maintain the snap store website.

Guided feature tour for publishers

Recent work was focused on building a guided tour that allows us to highlight new and/or important features to our users. Via small steps, a tour explains the concept, functionality and different UI elements of a feature helping to educate and onboard users.

The very first tour implemented can be found within the snap listing page. This aims to help publishers improve quality and overall completion of their public listing in the Snap Store.

About the author

Anthony Dillon is a Lead Web Developer in the web and design team. The team is responsible for all websites and tooling across Canonical. Anthony loves to create beautiful things and push the boundaries of the web.

More articles by Anthony

Posted in: