natalie calvert, designer - design and development videos€¦ · available updates for the app. do...

#WWDC17

© 2017 Apple Inc. All rights reserved. Redistribution or public display not permitted without written permission from Apple.

Natalie Calvert, Designer

•Writing Great Alerts • Session 813

Design

When should alerts be used?

emily.parker@icloud.comEmily Parker

EDIT

Apple IDSettings

9:41 AM 100%

Emily’s iPhoneThis iPhone 7

Emily’s Apple Watch

Name, Phone Numbers, Email

Password & Security

VisaPayment & Shipping

iCloud

Family Sharing James

iTunes & App Store

EDIT

Try AgainCancel

Your Apple ID or password is incorrect.Verification Failed

emily.parker@icloud.comEmily Parker

EDIT

Apple IDSettings

9:41 AM 100%

Emily’s iPhoneThis iPhone 7

Emily’s Apple Watch

Name, Phone Numbers, Email

Password & Security

VisaPayment & Shipping

iCloud

Family Sharing James

iTunes & App Store

EDIT

Try AgainCancel

Your Apple ID or password is incorrect.Verification Failed

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.

9:41 AM 100%9:41 AM 100%

Alerts are disruptive by design

Alerts are disruptive by design

Alerts are disruptive by design

Alerts are lightweight by design

Yes, in every app

Do you want “App Name” to remember this choice?

Yes, and show a banner in every app

Yes

Yes, and show a banner

No

Dismiss

Error Domain=Parse Code=431 “The requested operation couldn’t be

completed.” [Parse error 431] UserInfo=0x345624ag0 {code=431,

error=This user type is not supported by this application.}

Log In Error

OK

Please do not enter the following special characters

in the password field: - _ . ~ & % + () {} [] “ | <> ?

Alert Dos and Donts

Correct errors

Request access to user data

Notify users about critical updates

Alert Dos and Donts

Correct errors

Request access to user data

Notify users about critical updates

Don’t use nonessential or lengthy content

Don’t offer complicated choices

Don’t duplicate the tasks of other UI elements

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.

Title

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.Message

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.

Actions

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.Message

Actions

Title

9:41 AM 100%

Don’t Allow Allow

Allow “Calendar” to access your location while you use

the app?Your location is used to estimate travel times to events and improve location

searches.Why?

How?

What?

Common Problems Too much/vague information

No

You may need to download the latest available updates for the app. Do you want to visit the “App Name” website

for more information and troubleshooting tips?

“App Name” cannot open this file.

Yes

Common Problems Too much/vague information

No

You may need to download the latest available updates for the app. Do you want to visit the “App Name” website

for more information and troubleshooting tips?

“App Name” cannot open “File Name”.

Yes

Common Problems Too much/vague information

No

An update to the latest version of the app may be required.

“App Name” cannot open “File Name”.

Yes

Common Problems Too much/vague information

Check for Updates

An update to the latest version of the app may be required.

“App Name” cannot open “File Name”.

Learn More

Cancel

Before and After

No

You may need to download the latest available updates for the app. Do you want to visit the “App Name” website

for more information and troubleshooting tips?

“App Name” cannot open this file.

Yes

Check for Updates

An update to the latest version of the app may be required.

“App Name” cannot open “File Name”.

Learn More

Cancel

Before and After

No

You may need to download the latest available updates for the app. Do you want to visit the “App Name” website

for more information and troubleshooting tips?

“App Name” cannot open this file.

Yes

Check for Updates

An update to the latest version of the app may be required.

“App Name” cannot open “File Name”.

Learn More

Cancel

Common Problems Too little/confusing information

Common Problems Too little/confusing information

Common Problems Too little/confusing information

Common Problems Too little/confusing information

Before and After

Before and After

Style and Quality

Style and Quality

Avoid platitudes, jargon, or fillers

Style and Quality

Avoid platitudes, jargon, or fillers

Use correct formatting, spelling, and punctuation

Style and Quality

Avoid platitudes, jargon, or fillers

Use correct formatting, spelling, and punctuation

Consider your audience

Summary

Summary

Keep it simple and helpful

Summary

Keep it simple and helpful

Practice: revise your alerts to incorporate these guidelines

Summary

Keep it simple and helpful

Practice: revise your alerts to incorporate these guidelines

Read the HIG