←Go Back Timeline: August 2020 Role: Designer Technologies: WidgetKit, SwiftUI, Dark Mode, DynamicType via UIFontMetrics

  1. Hypothesis and Choices 2. Top Widget 3. Most Popular Widget 4. Arts, Culture, and Style 5. Future

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/625811ef-6f7a-4c2d-b7b9-4f793ca293b0/Screen_Shot_2020-08-22_at_8.25.53_PM.png

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/06858aef-14d0-4755-8f2f-4038c69cd4e4/Maker_Week_top_stories_widget_demo_2020-08-07_at_4.11.06_PM.mov

We launched it!

Announcing The New York Times Widget for iOS 14

The New York Times launches its own widget for iOS 14

H y p o t h e s i s

If we bring additional surface to users like iOS 14 Home Screen Widget, they will access news and stories of their interest easier, thus increasing reader lifetime value.

iOS 14 is adding home screen widgets when it arrives in September. These new widgets extend a microcosm of an iOS app onto the home screen that is always visible without needing to launch or open the main app, but that can deep-link into specific content to view fully in the main app.

Product Mind

A NYT Top Stories widget would be a terrific use of this new functionality, and would allow us to compete with Apple's own Apple News widget that will be available in iOS 14.

Engineering Mind

Afford an opportunity to experiment with SwiftUI in the view layer, and combine in the data layer

Design Goal

Create an additional surface that would extend the programming decisions of the News Desk and add value to our iOS users by adding a unique platform specific feature.

↑ Back to beginning

Top Stories Widget

Design Explorations

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/26c33ced-54c9-4ea6-9914-f0593ffaa362/Screen_Shot_2020-08-27_at_4.21.32_PM.png

A. Exploring various sizes

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/5ede9f62-7237-4049-afd1-90e7d06b8ef7/Screen_Shot_2020-08-27_at_4.30.38_PM.png

B. Decided on Medium size for Top and Breaking News. Explorations around different types of news and their visual cues (Live for Top Stories vs. Politics for Most Popular)

Once the second headline cannot fit on the card without truncation, it’s removed from the card. Stories are centered within their container box when there’s extra space left over

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/b3913dcd-43c3-475a-a378-ee4457232fd5/Screen_Shot_2020-08-27_at_4.37.50_PM.png

C. Exploring edge cases with the text volume as well as dark/light modes.