Embed Notice

HTML Code

<blockquote style="position: relative; padding-left: 55px;"><section><a href="https://hachyderm.io/users/samhenrigold/statuses/112094325204679902">sam henri gold (samhenrigold@hachyderm.io)'s status on Friday, 15-Mar-2024 01:27:06 JST</a><a href="https://hachyderm.io/@samhenrigold" title="samhenrigold@hachyderm.io"><img src="https://gnusocial.jp/avatar/101854-48-20230226154804.webp" width="48" height="48" alt="sam henri gold" style="position: absolute; left: 0; top: 0;">sam henri gold</a></section><article><p>💡 UX Tips: Improving Alert Copy</p><p>Follow for more UX tips, tricks, and tips!</p></article><footer><a rel="bookmark" href="https://gnusocial.jp/conversation/2824335#notice-5605673">In conversation</a><time datetime="2024-03-15T01:27:06+09:00" title="Friday, 15-Mar-2024 01:27:06 JST">about a year ago</time> <span>from <span><a href="https://hachyderm.io/@samhenrigold/112094325204679902" rel="external" title="Sent from hachyderm.io via ActivityPub">hachyderm.io</a></span></span><a href="https://hachyderm.io/@samhenrigold/112094325204679902">permalink</a><h4>Attachments</h4><ol><li><label><a rel="external" href="https://gnusocial.jp/attachment/2376040">Before. An alert box. Title: Confirm Cancellation. Body: Are you sure you want to cancel? This action cannot be undone. At the bottom, one button reads "Cancel Subscription" while the other reads "Do not cancel". Design notes and arrows are all around the box.  Note 1 points to a red close button and reads "Both buttons close the alert, we don't need a third". Note 2 points to the copy and reads "Cannot be undone is a double negative". Note 3 points to the "Do not cancel" button and reads "Users expect standard terms". Note 4 points to the "cancel subscription" button and reads "Repetitive info, user already knows what they're cancelling". Note 5 points to "Are you sure" text and reads "More question from body to title. Copy is too wordy"</a></label><br><a href="https://media.hachyderm.io/media_attachments/files/112/094/325/083/262/801/original/61d571cdabac2da4.png" rel="external">https://media.hachyderm.io/media_attachments/files/112/094/325/083/262/801/original/61d571cdabac2da4.png</a></li><li><label><a rel="external" href="https://gnusocial.jp/attachment/2376041">After. A dialog box. Title: Are you sure? Body: This action can be done. The highlighted button reads "Cancel" and the second button reads "Cancel"</a></label><br><a href="https://media.hachyderm.io/media_attachments/files/112/094/325/066/071/938/original/3aa1169cb8c6dcee.png" rel="external">https://media.hachyderm.io/media_attachments/files/112/094/325/066/071/938/original/3aa1169cb8c6dcee.png</a></li></ol></footer></blockquote>

Corresponding Notice

Embed this notice
sam henri gold (samhenrigold@hachyderm.io)'s status on Friday, 15-Mar-2024 01:27:06 JST sam henri gold
💡 UX Tips: Improving Alert Copy
Follow for more UX tips, tricks, and tips!
In conversationabout a year ago from hachyderm.iopermalink
Attachments
1. Before. An alert box. Title: Confirm Cancellation. Body: Are you sure you want to cancel? This action cannot be undone. At the bottom, one button reads "Cancel Subscription" while the other reads "Do not cancel". Design notes and arrows are all around the box. Note 1 points to a red close button and reads "Both buttons close the alert, we don't need a third". Note 2 points to the copy and reads "Cannot be undone is a double negative". Note 3 points to the "Do not cancel" button and reads "Users expect standard terms". Note 4 points to the "cancel subscription" button and reads "Repetitive info, user already knows what they're cancelling". Note 5 points to "Are you sure" text and reads "More question from body to title. Copy is too wordy"
  https://media.hachyderm.io/media_attachments/files/112/094/325/083/262/801/original/61d571cdabac2da4.png
2. After. A dialog box. Title: Are you sure? Body: This action can be done. The highlighted button reads "Cancel" and the second button reads "Cancel"
  https://media.hachyderm.io/media_attachments/files/112/094/325/066/071/938/original/3aa1169cb8c6dcee.png

Public

Embed Notice

HTML Code

Corresponding Notice