The audience of NBC’s “TODAY” has always enjoyed health segments and wellness goals such as Al Roker’s walking challenge. In December, the NBC News Digital team decided to build on that interest by releasing a fitness app called Start TODAY, which is the first of its kind made by the NBCU News Group. It offers daily workouts, healthy meal planning and expert advice and motivation to help users meet personal wellness goals.
Since NBC News Digital’s design team did not receive specific guidelines on what to include in the app, they needed to brainstorm on how best to serve users’ needs. Watch the video above and read below to learn how they built an app from the ground up.
Design begins with ideation
Product design starts with ideation, a structured process to generate new ideas for the features or experience of a product.
“Are we going to have video classes? Is it going to be individual workouts? Nothing was defined,” said Melvin Rivera, senior UX designer for NBC News Digital. “It was up to us to imagine what the final product could be. It’s the best position you could be in as a designer.”
For the Start TODAY app, the team began with a “start from the end” exercise, envisioning how the final product would look in an app store. Designers wrote down potential features on Post-it notes and stuck them on a board. They wanted the app to be inclusive for users at different stages of life and with different body types.
“In those design jams, we have people of all different experience levels, even our interns, working on that,” said Kirsten Webb, design operations manager for NBCU News Group digital creative design/UX. “To have so many team members from diverse backgrounds ideate is always super helpful.”
What are wireframes and how do they help the design process?
To help figure out how users will navigate the app (also known as the “user flow”), the team worked on wireframes, or simple black-and-white sketches that map out the connections between the app’s content. At this stage of development, designers are not concerned with final decisions on color or font choice. Instead, they are making sure users stay engaged with the app, rather than become frustrated and leave.
“If you’re purchasing a product, do I want to give you 1,000 choices to pick from right before you go to the next screen? No, because you would bounce out,” Rivera said. A “bounce” is when a user leaves an app without completing an intended action, such as a purchase.
This wireframing process helped determine where features like tabs, buttons and workout content would be placed. The goal was to create a logical flow without overwhelming users, especially since the app offers thousands of workouts, healthy recipes and other wellness items.
What is UX design? How did it help with Start TODAY?
UX design, which stands for “user experience,” focuses on how a user interacts with a product or brand. UX designers focus on the entire experience of using an app, whether they are first-time users, repeat users or occasional users.
Prototypes helped Rivera’s team visualize ideas and gather user feedback on Start TODAY features. The designers specified which group of users they wanted to hear from, such as a specific age range, frequent “TODAY” viewers or people who subscribe to other fitness apps. These test groups gave feedback on screenshots through questionnaires.
“The difference between a traditional graphic designer and a UX designer is you’re not working in isolation,” Rivera said. “The final decision is a combination of everything: user feedback with business needs.”
As the wireframe evolved, users shared that they wanted weekly fitness challenges and a community-driven “inspiration” section, where they could share success stories and encouragement. Finally, the designers chose a color palette and font choices for the app that aligned with the “TODAY” brand. Features like badges were considered but put on hold for future updates. Since Rivera knows both UX design and coding, he could speed up any fixes.
Building an app takes collaboration
Many teams needed to collaborate to build Start TODAY, including those who set up the studio and hired talent to film workouts.
Amanda Geisinger, director of product design at NBC News Digital, had to check in with multiple teams to ensure Start TODAY met quality standards, aligned with brand guidelines and provided a seamless user experience. Webb also acted as a go-between, making sure the design software was up-to-date, and working with vendor management and the legal department.
“You’re checking with the editorial team: ‘What are you writing, shooting?’ We’re checking with engineers: ‘Can you actually build this thing?’ Product managers: ‘Does this meet business requirements?’ More senior stakeholders: ‘Is this the image we want to be projecting?’” Geisinger said. “You’re getting feedback from every single angle.”
A former UX designer herself, Geisinger said Start TODAY also needed to feel cohesive, rather than “a combination of feedback from a million people.”
As the app’s launch date approached, product designers like Jackie Ma worked on promotional designs for the website, and made sure the imagery, photographs and animations were consistent throughout the entire brand. Start TODAY launched after more than a year in development.
Chris Hardtman, vice president and head of design for NBC News Digital, said Start TODAY is the result of her team using “data-driven, human-centered design” to meet consumer needs.
“Being human-centered — are we checking in on each other? Are there things that we need to understand and learn together? We do a lot of that as a team,” Hardtman said. “That’s so we can be better about serving millions of folks out there, the audiences for all of our news brands.”
