In part 1 of 3 for this series, DFO shares how they’re charting new waters with GC Design System. Together, we’re bringing digital innovation to water (two elements that don’t traditionally mix), to unlock new possibilities!
CDS products have been making waves with the Chief Digital Officer Sector (CDOS) team at the Department of Fisheries and Oceans Canada (DFO). DFO is responsible for safeguarding Canada’s oceans and maintaining fish and ocean resources, including ensuring our ocean ecosystems are healthy and protected.
The CDOS team has been working with CDS product teams to find ways to streamline workflows, scale impact, and shape the future of digital initiatives. These collaboration efforts have resulted in helpful feedback for all teams, resulting in product and service improvements at DFO and CDS.
Wave hello to digital teams at DFO
We chatted with members of the Chief Digital Officer Sector (CDOS) at DFO about their experiences using GC Design System. CDOS is the IT Digital shop at DFO, consisting of 4 directorates: IT Operations, Strategic Planning, the Data, AI, and Information Management (IM) branch that runs the Enterprise Data Hub, and Digital Innovation which includes the User Experience (UX) branch that supports user-centered digital initiatives.
CDOS team members at DFO we interviewed: Antoine Bedward (Director of User Experience), Russell Moore (Analyst with the Digital Enterprise Hub), Paula Aoyagui (Manager for UX Strategy and Digital Accessibility), Lisanne Vickers (Team Lead for UX Design), and Adele Strub (UX Designer).
How DFO’s charting new waters with GC Design System
“A big value for adopting CDS platform products is the fact that we didn’t have to do a formal agreement, which freed up time for us to focus on the service. The products are free to use and their teams are easy to partner with. This lowered the barrier to entry.”
– Antoine Bedward, Director of User Experience, Chief Digital Office Sector at DFO
| GC Design System: Becoming the single source of truth for a trusted government Design System that will be leveraged by public servants to prototype and build online services. |  |
The User Experience Branch at DFO’s Chief Digital Officer Sector was established 3 years ago. Before it existed, most of the application/product design was done by either the business owner, a developer, or a business analyst.
Now, multi-disciplinary DFO teams of designers and developers are using GC Design System to collaborate on publishing content on Canada.ca. A group of public servants are using the design tool for the department’s initiatives and are working closely with the product support team to learn how to best utilize it. DFO’s collaboration and feedback on the design system has helped the product team improve it for GC teams.
Paula Aoyagui: Testing out GC Design System.
DFO’s journey with GC Design System is a little different than with GC Forms or GC Notify. DFO is currently implementing the alpha version of GC Design System. About a year ago, we decided to start testing it out by having 18 of our employees use it for select projects. We decided on using 3 projects that are quite important to our portfolio and mandate, and made sure that we had designers and developers from our teams involved from the get go, which was a great opportunity to get everyone to put their heads together and work on something cool.
Since GC Design System is still in the alpha stage, testing this product meant we were in constant communication with the product team at CDS. With anything new, we had a lot of questions and there was a lot of back and forth to understand the tool, its possibilities, and how we could use it to best meet our needs. Setting it up was a great experience and we now have a great relationship with the product support team, meeting every month to discuss the tool and how it’s working. We’ve also scaled our use of the design system, using it for around 10 initiatives (vs the 3 pilots we started out testing with).
Adele Strub: Creating a cohesive look across pilot initiatives.
From the design point of view, GC Design System has been very helpful. For over a year, I’ve been working on a product team that has 3 external-facing products. There are more products planned to follow, both internal and external, and I expect to continue using the design system across all of them.
Using GC Design System has helped us create a cohesive look across all three of those pilot products. Not having to worry about designing individual components (like a button) enables me to focus on improving user interactions with the components (like the sequence of actions), which is a way more beneficial use of my time. Even just being able to use the central Figma file has been really helpful. It includes multiple interaction states, such as error and hover, and typography styles designed to be accessible to a wide range of users.
Initiatives at DFO using GC Design System:
- Canadian Fisheries Information System
- Elvers Monitoring and Traceability System
- Pacific Salmon Strategy Initiative Data Portal
- Salmon Habitat Restoration (SHARE)
- Fish and Fish Habitat Protection Program (Projects Near Water – Proponent Portal)
- Species at Risk Information Management System (SARIMS)
- Otolith Manager
- Integrated Science Advisory System
- Enterprise Data Hub (EDH)
- Whale Insight
Key impacts of using GC Design System at DFO:
- Using GC Design System has helped us create a cohesive look across all pilot products.
- Not having to worry about designing individual components (like a button) enables us to focus on improving user interactions with the components (like the sequence of actions), which is a way more beneficial use of our time.
- We meet regularly with the GC Design System team to discuss and align on design system strategies. In these sessions, we’ve shared research results, component designs, and identified areas for improvement. These insights helped the product team resolve bugs and prioritize contributions for GC Design System. The insights also enabled the approval for the adoption of the design system in CDOS!
- Examples: We submitted a Modal component contribution, which has been prioritized in the GC Design System roadmap. We also helped the product team identify bugs related to form components in the GC Design System Angular package, so they could resolve them.
Advice from DFO for using GC Design System
Adele Strub: Explore resources on GC Design System and play around.
My advice for public servants interested in using GC Design System? I’d say start with exploring the capabilities and just try it out. On the product website, there’s great resources in terms of explaining what the typical use cases are and the Figma files have a lot of documentation.
You can play around with their code builder to try out different variations of the component. If you’re experienced in Figma, there’s even things you can do like use recommended spacing and colour styles. This makes the transition easier from designing in Figma to actually developing.
Antoine Bedward: Use GC Design System to foster multi-disciplinary collaboration.
A big benefit I saw in the GC Design System was the common platform it provided for multi-disciplinary collaboration. It introduced some of the developers to design work and designer colleagues. It’s kind of an accelerator for building multi-disciplinary relationships and learning how to work together. In some cases, it’s helped break the ice for designers to explain the importance of discussing and exploring the problem space before designing user interactions, as it can influence design decisions.
Paula Aoyagui: Try out GC Design System with pilot initiatives.
Pilot initiatives are a great way for teams to learn how to implement GC Design System. It can be daunting to adapt to new ways of working and using a new tool, but going through the learning process with others helps. We had multiple teams in our sector using the tool, designers and developers included. It was a great opportunity to share experiences, help each other along the way, and provide feedback to the team behind the GC Design System.
As early-adopters of the tool, we were able to surface critical issues and highlight the need for two-way collaboration to ensure not only the successful implementation in projects, but to encourage broader adoption.
Paula Aoyagui: Highlight GC Design System’s accessibility for adoption.
One major positive aspect of GC Design System is its accessibility. Whenever we talk to clients and tell them about the design system, it’s one of the aspects of the product that we really highlight.
Think GC Design System can help with your service delivery?
Our support team frequently hosts demo and forum sessions for public servants to learn about how the tools can help with their service delivery. Participants get the opportunity to ask questions and hear from other teams about how they think the tool could help them (potentially inspiring ideas). Pick an upcoming date to attend a demo!
DFO also uses the GC Feedback tool and the GC Task Success Survey in their web optimization work. Check them out to learn how they can help you measure and improve users’ experiences with Canada.ca web content.