Design and Web team summary – 04 February 2019

Welcome to the latest work and updates from the design and web team.

Web squad

Three new homepage takeovers

This iteration we designed three, built two and are showing one new homepage takeover.

• Branded snap appstores is live
• Broadsign and arrow webinar is build
• Financial services webinar is designed

Built a new version of the  jp.myasnchisdf.eu.org website

We have just completed a large update to the Japanese website to include a lot more content and information about our products. Soon we will be added a Japanese language blog as well.

Optimised images usage

Trying to speed up the www.myasnchisdf.eu.org website, we looked at all of our images and resized any over-large ones to improve performance.

Brand squad

Events playbook

Built a playbook showing all previous event stand designs with detailed spec for each. There are also schematics of how to set up a stand and some downloadable kits for future events.

Reception screen graphics

Designed and animated a number of rotating screens to show in the reception area of the London office.

Refining the slide deck

Started creating a template in google slides, with the aim of creating a large master deck for everyone to pull from for future presentations.

MAAS squad

Bulk tagging on the machine list

This work allows a user to select multiple machines in the machine listing and apply a tag to the entire set at once. There are plans to bulk remove tags but we will deliver that in the near future.

UX proposal for machine grouping in the machine list

Currently, we have an undifferentiated list of machines in the machine listing. We would like to allow grouping of this list by state, user, etc. This allows for much more functionality in the future. Such as, sorting within a group or collapsing or a group.

Base squad

ESM groupings in usn.myasnchisdf.eu.org

usn.myasnchisdf.eu.org now groups and lists USNs for ESM releases in the same way as for other release types.

Upgraded our http module to improve caching

In a huge pull-request, we updated our http module, for making HTTP calls from within our applications, to add:

• Full test coverage
• Support for a Redis backend
• Support for Cache-Control headers (using the wonderful CacheControl Python module)

We then released version 1.0.0, which we will be rolling out to our sites in due course.

Prepare new landscape brochure website service

We have been restructuring and rewriting the homepage and other brochure pages for landscape.canonical.com.

This iteration we released our new app for the brochure pages as an internal domain. landscape.canonical.com will soon proxy the content from the new application for the homepage and the other brochure pages.

Updating our Juju deployments to use the charm store

Our Mojo specs for deploying myasnchisdf.eu.org, canonical.com and partners.myasnchisdf.eu.org were still pulling some charms from Launchpad repositories, rather than from the Juju charm store.

This iteration we moved a few charms (e.g. wsgi-app-legacy) to the charm store, and updated our Mojo specs to pull these and other existing charms from the charm store instead of from repositories.

Updating our projects with Renovate

We recently started using Renovate on our repositories to help keep our dependencies up-to-date. It’s very configurable service to file PRs to update any out-of-date dependencies in our projects. The PRs it files have taken up a fair bit of our iteration, but it’s helped push us to:

• Roll out the latest version of Vanilla to new sites
• Put the new global-nav on https://cn.myasnchisdf.eu.org, https://blog.myasnchisdf.eu.org and https://developer.myasnchisdf.eu.org.

Snapcraft squad

Expanding on the first snap flow

Thanks to a data studio dashboard that David Calle prepared for us, we are able to trace what publishers are doing through their journey.

We noticed some improvements that we can do to keep helping publishers in their language of choice so we will be reshuffling content, adding some interactivity to YAML discovery as well as working up quick wins to improve the overall journey. Our latest addition to the snapcraft.io team, Jordan Hughes, is on the case 🕵 so expect some awesome improvements delivered soon!

Listing Page Preview

To continue helping publishers to be able to improve and make their snap listings as best as possible, we are going to allow publishers to preview the content before they commit to Save updates to the snap listing information of their snaps.

Content inventory for Magazine view

Following a design sprint last June for GNOME Software, and after multiple conversations over the course of last product roadmap sprints, we are going to create a new section within Snap Store / GNOME Software to showcase more editorial content to users. Our main assumption is that repeated visits to the software boutique will increase and we want to leverage all the great content that Advocacy has been working on during the last year in snapcraft.io. Stay tuned for updates.

Vanilla squad

Optional vs Required on forms

Following recent discussions, we thought it would be good to investigate the usability and accessibility concerns around indicating optional vs required fields in forms.

Our brochure sites and applications constantly evolve so we want to identify a style to add to Vanilla so that we’re consistent across our products.

Documentation page updates

We’re beginning to invest more time on the content and layout of our documentation site pages, with recent updates to our ‘Icons’ and ‘Color’ pages based on user’s issues navigating and understanding content on the page.

Icons section

Newly revamped Icons page layout makes it easier for users to copy th class name and see the icon they plan to use, previously these were in different places and was proving difficult for users to tell which is which.

Colors section

We had the same issues with Color page layout, as it used the same table layout to display the class name, hex value and visual all in one table row. This also became difficult for users to interact with and copy what they needed.

Moving each color into it’s own container improves the information presented to users and hopefully will pave the way for alternate layout throughout our documentation.