NPR wanted to avoid the traditional music-related imagery approach, as it didn't want to be in the business of finding quality visuals for every story, and even considered researching an automated way to provide related images. For NPR’s update to UWP, the developers leveraged Windows 10’s adaptive layouts to dynamically change the UI in response to different screen or window sizes. For example, when the app display reaches the large screen breakpoint, the app adjusts the interface elements to make better use of the screen real estate. When it reaches the small or mobile breakpoint, the app responds with a completely different UI design tailored to the condensed screen or window size.
“We’ve always strived to provide a simple, clean experience for users that doesn’t get in the way of them listening and getting to the content they want,” Schein notes. “Once we pivoted to think about that through the scope of displays as large as 20-30 inches, it gave us an opportunity to think about ‘simple’ through a different lens.”
While it's still looking for a better solution, NPR found a way to make a great user experience for its listeners by displaying a high-quality image when one is available, and a placeholder image when one is not. An example of its solution is below; the story metadata is displayed, non-intrusively, inviting the listener to learn more.
Using Background Audio
To create a first-class audio experience for NPR One, the app needed to provide a continuous, reliable audio stream. The dev team needed to run the audio task in the background to optimize performance, even on less-than-ideal hardware. Plus, running the logic in the background meant the UI could be lightweight, while the background task did all the heavy lifting.
The developers leveraged the Windows background audio task, which allows audio to continue playing and to be accessed through the system volume controls even after the foreground app has been closed. Previously in their Windows 8.1 apps for PC and desktop, their background audio code could not be shared between projects, but now with apps built on the UWP it can be shared by both phone and desktop device families. The playback task uses IBackgroundTask, but slightly specialized for background audio. For example, unlike traditional background tasks, it is not registered in the foreground. Through BackgroundMediaPlayer.Current, the app accesses the MediaPlayer class, part of the Windows.Media.Playback namespace.
Cortana in NPR One
As the NPR One app is a mostly hands-off experience, NPR was intrigued by Cortana and the idea of being able to use your voice in situations where it might not be practical to use your hands. The InfernoRed development team needed to make the Cortana background task communicate with the background audio task, something it was not originally designed to do.