Boosting Engagement on Today' Account and Recipe Pages
2024 (2 months)
Duration
Role
Product Designer
Project Overview
As a trusted source for in-depth analysis and lifestyle content, NBC News extends its influence through the Today Show, which offers various cooking and recipe segments.
However, it became evident that enhancing user engagement on Today’s digital platforms was essential, particularly in the areas of recipe accessibility and user account features. In response, I set out to revamp the user experience by boosting engagement on Today’s recipe and account pages.
Solution
This initiative included adding detailed recipe information, creating a scannable table of contents for quick jumps to specific recipe sections, and integrating related links under video pages to help users easily discover detailed recipe articles. Additionally, we simplified the account creation and onboarding process, making it more intuitive and user-friendly.
By focusing on user-centric improvements, the redesigned pages offer a seamless and engaging experience, ensuring that visitors can easily find and enjoy the rich content offered by Today while simplifying their interaction with the platform’s account features.
THE PROBLEM
How can we adjust Today' digital platform to cater to its primary audience?
The existing design of Today’s digital recipe pages and account features posed challenges for users in terms of accessing detailed recipe information and navigating the account creation process.
Users struggled with finding specific recipe details quickly and efficiently due to the lack of a scannable table of contents. Additionally, the video pages lacked related links, making it difficult for users to discover more content relevant to their interests.
The majority audience for the Today Show is older users aged 45+ and because of this, an increase in clear scannability and readability is important.
The challenge was redesigning these elements to improve user engagement and accessibility, making navigating and interacting with the content easier.
Original Today' Food Front (Home Page)
My PROCESS
To address these challenges, I implemented a three-step process for each redesign task.
Review of Previous Designs & Branding
I conducted a thorough review of the existing recipe and account pages to identify pain points and areas needing improvement. This step helped pinpoint the issues with content accessibility and navigation that users were facing.
Designing & Iterating
Leveraging insights from user feedback and previous designs, I created wireframes to introduce a scannable table of contents, improve the clarity of recipe details, and enhance the account onboarding process. I worked iteratively, incorporating feedback to refine the design and ensure it aligned with user needs and project goals.
Dev Handoff
After finalizing the designs, I prepared detailed specifications and assets for the development team, ensuring a smooth transition from design to implementation. I remained available to address any questions or adjustments needed during the development phase.
01. CANONICAL VIDEO PAGES
How can we improve user discoverability through providing related links to recipe video pages?
Context
When users watch the show, they want to be able to see the recipe which they were not able to so we have to explore how to add links to the recipe on the video page.
Project Goals
To showcase and provide direct links to recipes that are mentioned in the videos, and add unique details to make the recipes stand out.
Design Considerations
Showcase through call-out boxes with each recipe’s details and image.
Final Handoff
Calling out the links through ‘Mentioned in This Video’ made it clear and concise.
Stick to the original layout as much as you can to make it easier for developers.
Original Video Recipe Page Template
Final Video Recipe Page With Two Links
02. FOOD FRONT
In what ways can we better the platform' scannability and display recipe articles and news?
Context
It’s not intuitive which articles have recipes as an overview in the Food Front so how can we add details and icons to make it more obvious?
Project Goals
Create the current Food Front Template to make it easier for designers and developers to look for, and design a way to distinguish the recipe articles clearly.
Final Handoff
-
Include icons for recipe articles only.
-
Add the recipe details here instead to provide the user with a quick overview on the recipe they might want to check out.
Redesigned Food Front With Icons and Details
Feed Feature With Icons and Details
03. TABLE OF CONTENTS
How can we improve usability on article pages with more then a few recipes?
Context
With articles that reference 5 or more recipes organization and quick links are needed.
Project Goals
For users to better navigate a recipe article, a clear table of contents on top could help them jump to specific recipes especially if it one with a large number of recipes.
Design Considerations
-
Add a clear title and bullet points to show number of recipes in the article.
Final Handoff
-
Provided a save button to let users come back to the recipe later.
-
Added underline for each recipe to make it clear the link is clickable unlike before.
-
Added a scroll within the call out box for articles over 5 recipes.
Recipe Article Page
Final Table of Contents With 4 Links
04. ACCOUNT PROMOTIONAL PAGE
How can we drive user engagement through a new promotional page?
Context
There is no current account page that lists all the features and asks you to sign in, there are just overlays.
Project Goals
Provide users with a clear page that displays the offers and perks they will receive when signing up for a Today account.
Design Considerations
-
One page layout with the perks listed out with checkmarks to be read easily.
-
Adding images to call out each of the features while also having easy log in buttons
Final Handoff
-
Created a side-by-side layout for better scannability.
-
Added images and icons to create a better balance with the text.
Original Sign Up Promotional Overlay
Final Account Promotional Page
05. ACCOUNT ONBOARDING
What may a Today onboarding process look like?
Context
Now that there is a clear account sign-up page, there needs to be an onboarding form to help personalize the platform for the user.
Project Goals
Provide users with a quick and intuitive onboarding system that asks for their interests and demographics
Design Considerations
-
Having the selected options be bordered can be more visually intuitive.
-
Added a checkmark to emphasize multiple selections.
Final Handoff
-
Make sure to distinguish between multiple selections and selecting one by providing radio and checkmark buttons
Original Onboarding Layout
Final Account Onboarding Pages
REFLECTION
What were my main takeaways from this project?
The redesigned Today Show recipe and account pages successfully met the project’s primary goals of improving user engagement and accessibility. The new design not only made it easier for users to find and interact with content but also streamlined the account creation process, leading to a more satisfying user experience.
01
Implementing User-Centric Design
This project reinforced the importance of understanding user needs and integrating those insights into the design process to create more effective and engaging digital experiences.
02
Iterative Design Process
Working in an iterative design process allowed for continuous improvement and refinement of the design, ensuring that the final product met both user expectations and project objectives.
03
Cross-Functional Collaboration
Collaborating closely with the development team during the handoff phase was crucial to ensuring that the final implementation matched the design vision, highlighting the importance of clear communication and documentation.
I completed 4 projects during this internship!
Let's take a look at what I accomplished