Connectivity vs Process Paste Status

[kendal-kirby]

I am in the process of redesigning the Twilio Status page (which is currently not using Paste) and I'd like some clarity on when to use the connectivity status icons (dots) vs the process status icons (symbols). The status dot/symbol will only be visible for non-operational states.

The possible statuses that can appear are (with proposed status indicators):

• Operational (text only)
• Degraded performance (text + orange)
• Partial outage (text + orange)
• Major outage (text + red)
• Under maintenance (text + blue)

See wireframes

[loreina]

Hi @kendal-kirby,

Connectivity status icons are used to indicate if a user or system is online or offline. Process status icons are used to indicate stages in a process. There's some information on our doc site with more detail about the differences: https://paste.twilio.design/patterns/status/#variations

For the possible statuses, could you share more about mixing plain text statuses with text+icon statuses? I see that Operational is text only, and am wondering if on the status page where there are multiple statuses displaying, that the plain text status might look visually different than the rest.

Let us know if there's anything else we can help with!

[kendal-kirby]

Thanks for all the help here and during office hours!

As discussed during office hours, I'd like to make a request to add one more connectivity status for neutral statuses (like in the process status pattern).

[kate-porter]

Hey @kendal-kirby! Thanks for coming to office hours last week. Here's a link to the recording for future reference (password is shared in the #help-design-system Slack channel).

I'll share your request to add a new neutral connectivity status icon with the team and report back!

[kate-porter]

Hey @kendal-kirby - chatted with the team about adding a new neutral connectivity status, and we've all agreed that it makes sense to do so. We'll work on getting this added within our next couple of sprints. What's your timeline look like for when you'll need this?

[kendal-kirby]

@katieporter The timeline is still TBD, but development likely won't begin for at least another month.

[kate-porter]

Hey @kendal-kirby! We just published an update to the Paste Patterns library that includes the new Neutral variant for Connectivity Statuses. We're aiming to get it added to the Paste codebase and docs site in the next sprint or two.

[kendal-kirby]

Thanks for the update @katieporter!

[shleewhite]

Hi @kendal-kirby! I just merged a PR to add the ConnectivityNeutralIcon and include it in the Status pattern page. The updates should be available soon!