Style suggestion for "click to dismiss" toasts

[corykon]

This came up in a convo with PopInsights team. They felt like the default icon on toasts clashes with message of the toast a bit. In this example here there's some dissonance - you might first think the "x" represents an error, because its white like the check icon and almost as prominent:

Making it a darker color, and a little thinner helps.

And the PI team liked it top right instead of centered. Feels like a more familiar place for a close icon.

[corykon]

@andrew-frueh thoughts on this?

[andrew-frueh]

@corykon could you spin up a quick usertesting.com test on this? I'd be fine to back whatever design direction the data from that points us.

[corykon]

@andrew-frueh definitely. will report back :+1:

[corykon]

Fired up a couple A/B tests. Long story short is the results point to a dark icon that is centered.

---

Test 1: https://app.usertesting.com/workspaces/795220#!/study/3843207/metrics Here's the screen shown at the end of the test when asked to pick their fav (after being shown them individually).

---

Test 2: https://app.usertesting.com/workspaces/795220#!/study/3843342/metrics

[andrew-frueh]

Thanks for doing this Cory - it looks like the dark/light versions are kind of a toss up. But if we connect that to similar sentiments coming from you and the DOS app teams, it sounds like centered dark is the way to go. :+1: