Overview
Migrating and expanding the Service NSW design system to be utilised by all product teams.
Service NSW is a New South Wales Government agency within the Department of Customer Service that provides one-stop access to government services and other partner agencies via online, phone or in-person at its service centres.
The Service NSW design system was originally designed by Future Friendly, all contained within a Word document and managed by the website product team.
This project kicked off during the Transaction Team’s search for a place to house their transactional component content, which later evolved into a bigger product for all product teams.
Problem statement
The design system at the time was placed within a shared Word Document on OneDrive and needed to be lifted and shifted onto a new platform that would encourage a shared contribution model.
After Sharepoint and Confluence were not deemed a need-fit for the two key audiences, designers and developers, the Website team was tasked to develop a proof-of-concept in the Drupal CMS to see if it could meet future needs.
One of the main goals was to ensure we re-utilise existing components as much as possible for consistency and a quick build.
Users & audience
Product Managers and Designers, Front-end developers and Content Designers of Service NSW.
Roles & responsibilities
The website product team at Service NSW is relatively large with a small number of Product Designers, Two Senior Product Designers and one Principal Product Designer. Due to the content management demand, our team was largely content designers. Each designer usually focuses on their initiative priority – however, this initiative had a tight time constraint and involved collaboration with the team’s Principal Product Designer.
Processes
Platform feasibility study
Drupal is an open-source CMS back-end with a deployed static front-end using HTML/React. The CMS also enables the shared contribution model as the CMS is easy to use with its simple back-end UI. Deployments and changes can be made immediately as the site is built and replaced on demand. This supports the ability to introduce scalable features, content and functionality into the medium-long term.
Mapping workshops
We facilitated two workshops with the main focus of conducting mapping exercises.
The first workshop was done internally with the website team including our content designers, developers and our product manager. The goals were to understand the breadth and depth of content in the GEL as well as its current IA/structure and to have a foundation to build the digital iteration
The second workshop was conducted with designers, content designers and developers from other product teams as well as external vendors. The goal was to brainstorm what content each discipline requires from the design system and the ‘why’ behind these ideas and group them into themes.
Information architecture card sort activity
Due to lockdown restrictions, we organised an optimal workshop card sort activity and survey with 23 participants across the product portfolio, including 11 designers, 7 developers, 4 product managers and 1 architecture manager. All with varying levels of experience and time in the organisation.
The goals were to understand the mental models of various disciplines when it comes to the design system, collect feedback on experiences, pain points and delights from the current design system, validate our current mindset and approach around the information architecture and iterate upon our current thinking to further add to our backlog for continuous improvement.
Insights:
There is a lack of confidence that the current GEL is up to date
There is a need to enforce the design system and for greater collaboration
Findability and sharing is an issue due to the migration
Coveted features: searchable, browsable, version control, comments/discussion, roadmap, notifications, patterns…
There was a high degree of confusion around the category ‘Roles,’ with many not understanding what the label indicated or what it should contain.
There was a level of blending in the understanding of components and patterns, with some participants equating the two.
MVP information architecture
Based on the findings from the card sort activity, we were able to forge an information architecture for the MVP.
Interviews & usability testing
Before launching the design system's MVP state, we conducted x7 1-hour staff interviews and usability testing sessions. This involved 4 designers, 2 developers and 1 product manager across diverse teams in the product portfolio with varying experience and tenure at Service NSW.
The goals were to understand whether the users know where to go for onboarding, mental models map to the information architecture, comprehend the content and its structure, ease of navigation and overall desire to use the new design system.
Design output
Outcomes
The Service NSW design system, now known as the GEL (Global Experience Language) is now live using the Drupal CMS.
After a rigorous amount of workshops with other product teams, external teams and disciplines, we were able to deliver a home of the design system based on a contribution model that’s easy to use and simple to understand, regardless of your role within Service NSW.
Unfortunately, access to the design system site is password locked and only accessible to those within Service NSW, but it may in future be available to the general public as there’s the desire to do so.