top of page
Header.png

Independent Study | UX Strategy and Animation | 6 weeks

Financial advice made comprehensive through animated content.

Project Vision

NerdWallet is a personal finance company that offers thousands of detailed blogs and tools to help people with their financial questions. But all of this information can be overwhelming as learning about finances has become just as challenging as learning another language. With rising student debt and money becoming more digital it's more important than ever to emphasize financial education.

Nerdwallet has the opportunity to make learning about finances less challenging by making financial concepts more tangible through animation. By introducing financial topics to young adults sooner and in a less formal setting, they're more likely to have a better understanding in the future.

Challenges

1. Decide what information is most impactful to this audience.

2. Convey important information in a short amount of time.

3. Keep the audience engaged.

4. Inform them enough to make them reflect on their choices and seek further information.

Team

54% of people are struggling with some aspect of their financial lives.
hero-image_debt-consolidation-770x462.pn

Final Solution 

Make difficult concepts more tangible.

Nerdwallet has the opportunity to create a less intimidating and more accessible learning environment through animation. By using visual references that a viewer can already relate to, it makes understanding the information much easier.

This animation was created to live on Nerdwallet's Instagram story. In most cases, young adults go to social media for financial advice and in this setting it's easy to nudge viewers to learn about financials more preemptively.

 Final Product 

1-minute animation created for Instagram stories.

 Hover and click the audio button for sound. 

Meet the people where they are.

The 'Budgeting 101' animation will live on Nerdwallet's Instagram stories while shorter content will act as Instagram ads. In the future, I'd like to move the longer animations to their Nerdwallet App.

While researching I learned most people get their financial information from social media, youtube, or financial gurus but these resources feel long and informal.

Be intentional when creating shorter content.

It's important to be intentional when creating shorter content.

Shorter content comes with the constraints of a smaller space to work with and overall less time to convey a message. This doesn't include the fact that the target audience has an overall shorter attention span.

For those who are not following the Nerdwallet Instagram, these ads will lead users to their Instagram stories. The short message is meant to give them a second of reflection when it comes to their finances.

Screen Shot 2020-01-10 at 7.30.15 PM.png
MiniAnim_Final.gif

 Social Media Ad  

Final 5-second ad

Animaton
U2N75MNUFBBEXKDTZVQFE37B44.jpg
Why is financial knowledge important?

With the rise of student loan debt and the concept of money becoming harder to comprehend as finances become more digital, it’s more important than ever that young adults have a better understanding of their finances than simply putting spare change into stocks.

 

The lack of financial knowledge can come from feeling ashamed about your financial situation, not knowing where to get correct information from, or simply being unaware of how finances impact your day to day life.

Bringing financial information to a younger audience poses the challenge of not only finding a way to get their attention but being able to condense it in into something that would lead them to look for more information on their own.

NW_Header_Mobile.jpg
What does the average millennial know about finances?

Many significant moments in your life impact your finances. This can be anything like going to college, buying a car, or getting married. 

To validate my research, I conducted user research with people ranging from ages 19 to 32. I not only asked about their financial habits but where they get their information from. User interviews guided me to create content for social media as well as being intentional with the short amount of time I had to teach them something. It also helped me hone in on what content would be most useful for them.

It's hard for people to know what financial advice they need if they've never needed it before.

"I've never really researched financial advice. I don't know what to look for because I don't know what I need yet. "

Chris, 29

Mike.jpeg

Sometimes getting advice from your parents can feel irrelevant.

"I get a lot of advice from my parents but sometimes they make me feel stupid because I didn't know something or I feel like their advice is outdated."

Angela, 23

Alisha.jpeg

Banks and the internet are the most common places people go for financial information.

"I'm more likely to call my bank for information. But sometimes I'll go on youtube or instagram. I try to choose someone with a financial background."

Samantha, 25

Becca.jpeg

Design Process

Adjusting the visuals.

It was important to create visuals that I felt like my audience could relate too. I shifted through images of piggy banks and pizza slices to represent saving and percentages before I arrived at my final concept.

WIP1
WIP2
Creating the Animatic

Before creating the final animation presented at the beginning of the page, I first had to create a script and then an animatic. This allowed me to decide on which visuals and transitions to use throughout the final animation.

Animatic1_Final.gif

 Animatic  Rough Draft

Design Guidelines

Currently, Nerdwallet uses a wide range of colors and a very flat design with its illustrations. I sought to improve on that design through the use of textures and gradients.

Color Palette

I picked a palette that gave me warm and cool tones based off Nerdwallet's iconic green logo colors.

ColorPalette-08.png

Design Evolution

houses.png

Nerdwallet typically uses flat design. I wanted to improve on that with the addition of gradients and texture.

Styleframes

Here are a few stills shots from the animation.

Screen Shot 2020-01-10 at 7.36.39 PM cop
Screen Shot 2020-01-10 at 7.36.39 PM cop

 Next Steps: 

Bring animations to the Nerdwallet app.

Similar to Headspace, I'd like to move these animations to live on the Nerdwallet app while creating new features that help incentivize financial education. Currently, their app is a fountain of financial information but it can be overwhelming.

Screenshot_20200704-082807_Headspace.jpg
bottom of page