Verify Domains & Click Tracking (Admin Center) - (Office hours: Nov 24, 2020 & Jan 14, 2021)

[JT1989]

Background: We want customers to verify their domain and setup their domain to shorten URLs within messages and track engagement data
Stage of design: Lo-Fi Prototyping
Request: Would like to ask DSYS to weigh in on designs, specifically use of Paste components and accessibility concerns.

Specific questions:

1. What's the recommended way to show designs in a wizard fashion? Currently using accordions.
2. What's the recommended way to show DNS records? Through a table? or through input fields?

Input fields

Table

Links to mockups or prototype - See Version no.2 and Version no.3: https://twilio.invisionapp.com/share/NWZI16B4T8Q#/434572258_Cover_Sheet

[serifluous]

Hey @JT1989 !

What's the recommended way to show designs in a wizard fashion? Currently using accordions.

Using either accordions or grouping the steps with headings works from an accessibility and component usage perspective, and they're both patterns that seem to be commonly used in the products.

My personal 2¢: Based on the Refine to the Essentials principle, there don't seem to be too many steps or form fields (though the accordion version seems to have steps than the other one), so it could be fine to simplify and not add in the accordion interaction....but I'd rely more on usability testing + your PD crit for this.

What's the recommended way to show DNS records? Through a table? or through input fields?

Can you explain this question a little more during office hours? Do you mean the "copy" action specifically, or something else?

We don't have any DNS-record-specific recommendations, since they're primarily product concerns. But I think @seanmateer and @pguptaDS have tackled similar customer problems, so it could be good to sync up with them.

[JT1989]

Yes, absolutely - I've spoken with Sean Mateer and am currently partnering with Priyanka on this project :)

[serifluous]

Summary of feedback from office hours:

For Question #2: In general, you'll want to use a table for tabular data or if you're going to have a list of multiple records. A single form field could be appropriate if it's just one record. Again, this is just general guidance, though, and there may be other concerns related to showing DNS records that our team isn't aware of and could require a different UI solution!

[JT1989]

Dec 16 Update: I will update the designs now that Paste has shipped tables, and Katie has provided wonderful Loom videos on how to use the new component.

Update: I've migrated the designs from lo-fi to high-fidelity: https://twilio.invisionapp.com/share/QAZLFPL82RX

Background: We want customers to verify their domain and setup their domain to shorten URLs within messages and track engagement data

Research:

• Discovery Research & Lo-Fi Designs Research: slide deck & full report
• Research on Hi-Fi Designs: @JT1989 to add links here
• Current research on hi-fi version: Dec 9-18, 2020

Stage of design: Hi-Fi Prototyping

Request:
Please review the designs for an accessibility check and ensure proper use of components, design language, and patterns.

Note:

• Opening this thread for next office hours, Jan 14 (if an earlier office hours pops up, please lmk :) )
• I am actively partnering with @pguptaDS on these designs. Have met with Sean several times to go over learnings from SendGrid.
• We're actively customer testing

*Notable Research Findings for DSYS

• So far, customers do not like how "Delete" is in the middle of the page. Should I wait for guidance from DSYS and @pguptaDS on how best to place deleting of the object?
• Customers don't notice the "optional" tag. Any suggestions on alternatives?