2019–2020

Twilio Admiral

Over a couple of months I redesigned the navigation of Admiral, the internal platform Twilio’s engineers use to deploy and run their services. Interviews showed each team only cares about a small slice of 2,351 roles, so I rebuilt the structure around your own team: contextual dashboards, a Team › Roles switcher, and shorter paths to everyday tasks.

Twilio Admiral
Role
As a contract product designer I led the navigation research, the information architecture, and the team dashboards.
Outcome
Engineers land on their own team’s deployments and pipelines by default, and editing an access policy takes three steps instead of six.
Product
Twilio Admiral, internal developer platform
Industry
Developer Tools
Year
2019–2020

Showing each team only what’s theirs

  • I joined for a couple of months to iterate on Admiral’s pipelines feature. The research turned it into a redesign of how the whole platform is organized.

Seven people, seven maps of Admiral

  • We interviewed seven Admiral users and had each one rank their top five workflows. Two groups emerged: daily work and administration.
  • Then we asked them to rename and regroup its sections. Everyone came back with a different picture of how Admiral was structured.
Grouping and labeling exercises from the interviews
Grouping and labeling exercises from the interviews

A sliver of a huge list

  • Admiral held 2,351 roles across 246 teams, about ten per team. Each team only owned 0.4–4% of them.
  • So the structure became contextual instead of flat, the way Slack only shows the channels you’ve joined.
Infrastructure’s 12 roles among Admiral’s 2,351
Infrastructure’s 12 roles among Admiral’s 2,351
Flat hierarchy versus contextual hierarchy
Flat hierarchy versus contextual hierarchy

Start from your team

  • A Team › Roles switcher replaced the long list from top to bottom. By default you see your own team’s deployments, pipelines, and dashboards.
  • Editing a team’s access policy went from six steps to three.
Infrastructure’s overview: what needs you, then the team against the company average
Infrastructure’s overview: what needs you, then the team against the company average
Switching from Security to Infrastructure, then narrowing to one role by typing
Switching from Security to Infrastructure, then narrowing to one role by typing
Editing an access policy, before and after
Editing an access policy, before and after

One level down

  • The same structure carried the detailed tools. A role keeps its plans, deployments, firewalls, and access in tabs, a pipeline shows each run stage by stage, and a deployment’s steps and configuration sit under the team that owns it.
A role’s plans for each environment, with its open incident above the tabs
A role’s plans for each environment, with its open incident above the tabs
A pipeline run that failed in dev, with the step that broke
A pipeline run that failed in dev, with the step that broke
A failed deployment, with its log and a rollback, inside the team’s view
A failed deployment, with its log and a rollback, inside the team’s view

A system to build it on

  • Worked with the team to bring a design system into Admiral, and drew an icon set for the platform’s own concepts.
Typography and color in the design system
Typography and color in the design system
The Admiral icon set, with the options drawn for each concept, in light and dark
The Admiral icon set, with the options drawn for each concept, in light and dark