Savr
CONTEXT: In this case study, we will go through the process of how we created our product for Gen Z— a gamified and whimsical app where they can learn about how personal financial literacy. This was created for our Design for America project.
overview
Problem
Generation Z faces a critical gap in personal financial literacy. Budgeting, saving, and investing are all critical skills for financial success, yet are topics often overlooked and ignored among Gen Z. This can be detrimental as many Gen Z are beginning adulthood— knowledge of personal finances can ultimately make or break their situation for years, even decades to come.
Solution
Savr is a mobile application that addresses these concerns by creating a welcoming, fun, and whimsical learning environment where Gen Z can learn new financial skills, tips and tricks, and how to effectively be financially independent. Users can do hands-on activities that replicate real-life scenarios and situations so that they can practice in a safe and risk-free environment.
EMPATHIZE
Market research
We began by identifying similar apps, services, programs, and other products that are within the domain of finances and education. We did a SWOT analysis to get a sense of the market competition.
NerdWallet has a lot of good information that is backed by trusted and reliable sources. However, it appears to still be pretty overwhelming and unengaging, primarily catering to an older user base.
Fidelity is a popular brokerage that has many key features that fit the industry standard. It does lack educational elements, and users still need prompting or guidance to fully comfortably use it.
Generative AI does a great job of creating personalized and detailed financial plans. It can be very convenient and highly accessible. However, with general AI tools, information can be unreliable and lack clear accountability.
User research
We also conducted user research to get a better understanding of our stakeholders and their personal needs. We surveyed and interviewed various students.
Survey
In a survey, we asked: “What has discouraged you from learning about financial products/services in the past?”
Most people stated that it was due to feelings of being overwhelmed and intimidated that strayed them away from learning about personal finances. Other main factors included not having enough money or time to even worry about it.
Interview
Through our semi-structured interviews, we took away three (3) main insights from students with self-reported mediocre knowledge of personal finances:1. Want to learn more about long-term strategies:They have a good understanding of basic tools like checking accounts, savings, and credit cards, but lack knowledge on topics like investing and retirement.2. Previously learned from their parents and trusted peers:They relied on knowledge that came from trusted support systems, such as their parents or close friends, as opposed to other mediums.3. They learn better through practice, visuals, and real-time feedback:They want to be able to learn in a risk-free environment where they can get real-world practice and credible financial advice.
DEFINE
Problem statement
Using both the market and user research to research our users, we came up with the following driving problem statement:
“How might we support Gen Z in developing a stronger understanding
and confidence in their personal financial literacy, by making the learning process both fun and engaging?”
What is Crazy 8? Crazy 8 is an ideation sprint in which we all spend a total of 8 minutes coming up with random ideas. We each have eight squares where we spend one minute sketching, jotting, and spilling our crazy ideas in these squares. By the end of this quick activity, we hope to have 48 new ideas, assuming we have six participants!
?
IDEATE
Crazy 8
With this driving statement and prior research in mind, we did a group activity to generate ideas. This involved the technique, Crazy 8.
Some shared ideas generated:
Education policy
Gamified App
*
Anime
Interactions
*
Personalized mentorship
Discussion forums
Paying them
Lectures
Putting everything in consideration, from the user research to the market research to common themes among our designers, we established our solid idea, combining two prevalent concepts, gamification and hands-on interaction:A mobile application that provides Gen Z with a whimsical and informative environment where they can learn and practice personal finance skills.
Low-fidelity BUILD
Wireframing
With our ideas in mind, we transformed them into more tangible wireframes. We’re using simplicity and minimal styling as this is a crucial phase for constant user testing and rounds of reiteration.
Through some user testing, we found that users generally liked building blocks-like activities, they would probably stray away from external links to learn more or open an account, and felt positively towards icons and illustrations. Through many iterations and deliberations with the team, our wireframes kept changing and evolving taking in to consideration all the input along the way.
Design system
We created an established design system entailing color palette, fonts, font sizes, and header hierarchy. This is crucial in keeping our styling consistent and clean, eliminating random discrepancies.
Header 1
34px | DM Sans SemiBold
Header 2
24px | DM Sans SemiBold
Header 3
20px | DM Sans Medium
Text
16px | DM Sans Medium
570646
9C3687
FFB3F2
FFD1F7
FFF8FB
High-Fidelity Build
Screens and features
After all of the research, ideation, wireframing, and user testing, we developed high-fidelity prototype screens. These screens serve as a polished representation that displays the functionality and interface of our final product.
Onboarding and Home
The app will tailor curriculum to user-inputted needs and familiar topics. Users will also get to have a personalizable pet in their home dashboard!
Exercise and Practice
Hands-on practice with real life financial strategies. Users can also simulate investing in stocks with real-life market data and mechanics, but with fake money— at no risk!
CONCLUSION
Final thoughts
With this, we have reached the end of the timeline and project. Although I am really proud of this project and the work we have put in, there is always room for improvement and further development.
Learning experience: This was the first time I lead a design team, and needless to say, it was a very hefty, yet rewarding experience. I learned first-hand the intricacies of design leadership and how to navigate tricky scenarios.
Things we could’ve done differently:
Doing academic/literature research. By doing so, we could learn more about existing educational frameworks and utilized countless academic studies that currently existed and are backed by research studies.
Collaborating with financial institutions. Most of our knowledge and content came from the internet and prior knowledge, but we could’ve had some great insights from subject matter experts in finances..
You reached the end!
brighthoang01@gmail.com
Savr
ROLE:
Product Designer, UX Researcher
TIMELINE:
6 months
TEAM:
Group of 6
TOOLS:
Figma, FigJam, Google Forms
CONTEXT: In this case study, we will go through the process of how we created our product for Gen Z— a gamified and whimsical app where they can learn about how personal financial literacy. This was created for our Design for America project.
overview
Problem
Generation Z faces a critical gap in personal financial literacy. Budgeting, saving, and investing are all critical skills for financial success, but can be very overhwelming and yet are topics often overlooked and ignored among Gen Z. This can be detrimental as many Gen Z are beginning adulthood— knowledge of personal finances can ultimately make or break their situation for years, even decades to come.
Solution
Savr is a mobile application that addresses these concerns by creating a welcoming, fun, and whimsical learning environment where Gen Z can learn new financial skills, tips and tricks, and how to effectively be financially independent. Users can do hands-on activities that replicate real-life scenarios and situations so that they can practice in a safe and risk-free environment.
EMPATHIZE
Market research
We began by identifying similar apps, services, programs, and other products that are within the domain of finances and education. We did a SWOT analysis to get a sense of the market competition.
NerdWallet has a lot of good information that is backed by trusted and reliable sources. However, it appears to still be pretty overwhelming and unengaging, primarily catering to an older user base.
Fidelity is a popular brokerage that has many key features that fit the industry standard. It does lack educational elements, and users still need prompting or guidance to fully comfortably use it.
Generative AI does a great job of creating personalized and detailed financial plans. It can be very convenient and highly accessible. However, with general AI tools, information can be unreliable and lack clear accountability.
User research
We also conducted user research to get a better understanding of our stakeholders and their personal needs. We surveyed and interviewed various students.
Survey
In a survey, we asked: “What has discouraged you from learning about financial products/services in the past?”
Most people stated that it was due to feelings of being overwhelmed and intimidated that strayed them away from learning about personal finances. Other main factors included not having enough money or time to even worry about it.
Interview
Through our semi-structured interviews, we took away three (3) main insights from students with self-reported mediocre knowledge of personal finances:1. Want to learn more about long-term strategies:They have a good understanding of basic tools like checking accounts, savings, and credit cards, but lack knowledge on topics like investing and retirement.2. Previously learned from their parents and trusted peers:They relied on knowledge that came from trusted support systems, such as their parents or close friends, as opposed to other mediums.3. They learn better through practice, visuals, and real-time feedback:They want to be able to learn in a risk-free environment where they can get real-world practice and credible financial advice.
DEFINE
Problem statement
Using both the market and user research to research our users, we came up with the following driving problem statement:
“How might we support Gen Z in developing a stronger understanding
and confidence in their personal financial literacy, by making the learning process both fun and engaging?”
IDEATE
Crazy 8
With this driving statement and prior research in mind, we did a group activity to generate ideas. This involved the technique, Crazy 8.
What is Crazy 8? Crazy 8 is an ideation sprint in which we all spend a total of 8 minutes coming up with random ideas. We each have eight squares where we spend one minute sketching, jotting, and spilling our crazy ideas in these squares. By the end of this quick activity, we hope to have 48 new ideas, assuming we have six participants!
?
Some shared ideas generated in this session:
Education policy
Anime
Personalized mentorship
Interations
Discussion forums
Paying them
Gamified App
Lectures
Putting everything in consideration, from the user research to the market research to common themes among our designers, we established our solid idea, combining two prevalent concepts, gamification and hands-on interaction:A mobile application that provides Gen Z with a whimsical and informative environment where they can learn and practice personal finance skills.
Low-fidelity BUILD
Wireframing
With our ideas in mind, we transformed them into more tangible wireframes. We’re using simplicity and minimal styling as this is a crucial phase for constant user testing and rounds of reiteration.
Through some user testing, we found that users generally liked building blocks-like activities, they would probably stray away from external links to learn more or open an account, and felt positively towards icons and illustrations. Through many iterations and deliberations with the team, our wireframes kept changing and evolving taking in to consideration all the input along the way.
High-Fidelity Build
Design system
We created an established design system entailing color palette, fonts, font sizes, and header hierarchy. This is crucial in keeping our styling consistent and clean, eliminating random discrepancies.
Header 1
34px | DM Sans SemiBold
Header 2
24px | DM Sans SemiBold
Header 3
20px | DM Sans Medium
Text
16px | DM Sans Medium
570646
9C3687
FFB3F2
FFD1F7
FFF8FB
Screens and features
After all of the research, ideation, wireframing, and user testing, we developed high-fidelity prototype screens. These screens serve as a polished representation that displays the functionality and interface of our final product.
Onboarding and Home
The app will tailor curriculum to user-inputted needs and familiar topics. Users will also get to have a personalizable pet in their home dashboard!
Exercise and Practice
Hands-on practice with real life financial strategies. Users can also simulate investing in stocks with real-life market data and mechanics, but with fake money— at no risk!
CONCLUSION
Final thoughts
With this, we have reached the end of the timeline and project. Although I am really proud of this project and the work we have put in, there is always room for improvement and further development.
Learning experience: This was the first time I lead a design team, and needless to say, it was a very hefty, yet rewarding experience. I learned first-hand the intricacies of design leadership and how to navigate tricky scenarios.
Things we could’ve done differently:
Doing academic/literature research. By doing so, we could learn more about existing educational frameworks and utilized countless academic studies that currently existed and are backed by research studies.
Collaborating with financial institutions. Most of our knowledge and content came from the internet and prior knowledge, but we could’ve had some great insights from subject matter experts in finances..
You reached the end!
brighthoang01@gmail.com
Savr
ROLE:
Product Designer, UX Researcher
TIMELINE:
6 months
TEAM:
Group of 6
TOOLS:
Figma, FigJam, Google Forms
CONTEXT: In this case study, we will go through the process of how we created our product for Gen Z— a gamified and whimsical app where they can learn about how personal financial literacy. This was created for our Design for America project.
overview
Problem
Generation Z faces a critical gap in personal financial literacy. Budgeting, saving, and investing are all critical skills for financial success, but can be very overhwelming and yet are topics often overlooked and ignored among Gen Z. This can be detrimental as many Gen Z are beginning adulthood— knowledge of personal finances can ultimately make or break their situation for years, even decades to come.
Solution
Savr is a mobile application that addresses these concerns by creating a welcoming, fun, and whimsical learning environment where Gen Z can learn new financial skills, tips and tricks, and how to effectively be financially independent. Users can do hands-on activities that replicate real-life scenarios and situations so that they can practice in a safe and risk-free environment.
EMPATHIZE
Market research
We began by identifying similar apps, services, programs, and other products that are within the domain of finances and education. We did a SWOT analysis to get a sense of the market competition.
NerdWallet has a lot of good information that is backed by trusted and reliable sources. However, it appears to still be pretty overwhelming and unengaging, primarily catering to an older user base.
Fidelity is a popular brokerage that has many key features that fit the industry standard. It does lack educational elements, and users still need prompting or guidance to fully comfortably use it.
Generative AI does a great job of creating personalized and detailed financial plans. It can be very convenient and highly accessible. However, with general AI tools, information can be unreliable and lack clear accountability.
User research
We also conducted user research to get a better understanding of our stakeholders and their personal needs. We surveyed and interviewed various Gen Zers.
Survey
In a survey, we asked: “What has discouraged you from learning about financial products/services in the past?”
Most people stated that it was due to feelings of being overwhelmed and intimidated that strayed them away from learning about personal finances. Other main factors included not having enough money or time to even worry about it.
Interview
Through our semi-structured interviews, we took away three (3) main insights from students with self-reported mediocre knowledge of personal finances:1. Want to learn more about long-term strategies:They have a good understanding of basic tools like checking accounts, savings, and credit cards, but lack knowledge on topics like investing and retirement.2. Previously learned from their parents and trusted peers:They relied on knowledge that came from trusted support systems, such as their parents or close friends, as opposed to other mediums.3. They learn better through practice, visuals, and real-time feedback:They want to be able to learn in a risk-free environment where they can get real-world practice and credible financial advice.
DEFINE
Problem statement
Using both the market and user research to research our users, we came up with the following driving problem statement:
“How might we support Gen Z in developing a stronger understanding
and confidence in their personal financial literacy, by making the learning process both fun and engaging?”
IDEATE
Crazy 8
With this driving statement and prior research in mind, we did a group activity to generate ideas. This involved the technique, Crazy 8.
What is Crazy 8? Crazy 8 is an ideation sprint in which we all spend a total of 8 minutes coming up with random ideas. We each have eight squares where we spend one minute sketching, jotting, and spilling our crazy ideas in these squares. By the end of this quick activity, we hope to have 48 new ideas, assuming we have six participants!
?
Some shared ideas generated in this session:
Education policy
Gamified App
*
Anime
Interactions
*
Personalized mentorship
Discussion forums
Paying them
Lectures
Putting everything in consideration, from the user research to the market research to common themes among our designers, we established our solid idea, combining two prevalent concepts, gamification and hands-on interaction:A mobile application that provides Gen Z with a whimsical and informative environment where they can learn and practice personal finance skills.
Low-fidelity BUILD
Wireframing
With our ideas in mind, we transformed them into more tangible wireframes. We’re using simplicity and minimal styling as this is a crucial phase for constant user testing and rounds of reiteration.
Through some user testing, we found that users generally liked building blocks-like activities, they would probably stray away from external links to learn more or open an account, and felt positively towards icons and illustrations. Through many iterations and deliberations with the team, our wireframes kept changing and evolving taking in to consideration all the input along the way.
High-Fidelity Build
Design system
We created an established design system entailing color palette, fonts, font sizes, and header hierarchy. This is crucial in keeping our styling consistent and clean, eliminating random discrepancies.
Header 1
34px | DM Sans SemiBold
Header 2
24px | DM Sans SemiBold
Header 3
20px | DM Sans Medium
Text
16px | DM Sans Medium
570646
9C3687
FFB3F2
FFD1F7
FFF8FB
Screens and features
After all of the research, ideation, wireframing, and user testing, we developed high-fidelity prototype screens. These screens serve as a polished representation that displays the functionality and interface of our final product.
Onboarding and Home
The app will tailor curriculum to user-inputted needs and familiar topics. Users will also get to have a personalizable pet in their home dashboard!
Exercise and Practice
Hands-on practice with real life financial strategies. Users can also simulate investing in stocks with real-life market data and mechanics, but with fake money— at no risk!
CONCLUSION
Final thoughts
With this, we have reached the end of the timeline and project. Although I am really proud of this project and the work we have put in, there is always room for improvement and further development.
Learning experience: This was the first time I lead a design team, and needless to say, it was a very hefty, yet rewarding experience. I learned first-hand the intricacies of design leadership and how to navigate tricky scenarios.
Things we could’ve done differently:
Doing academic/literature research. By doing so, we could learn more about existing educational frameworks and utilized countless academic studies that currently existed and are backed by research studies.
Collaborating with financial institutions. Most of our knowledge and content came from the internet and prior knowledge, but we could’ve had some great insights from subject matter experts in finances..
You reached the end!
brighthoang01@gmail.com
Savr
ROLE:
Team Lead, Designer, Researcher
TIMELINE:
6 months
TEAM:
Group of 6
TOOLS:
Figma, FigJam, Google Forms
CONTEXT: In this case study, we will go through the process of how we created our product for Gen Z— a gamified and whimsical app where they can learn about how personal financial literacy. This was created for our Design for America project.
overview
Problem
Generation Z faces a critical gap in personal financial literacy. Budgeting, saving, and investing are all critical skills for financial success, but can be very overwhelming and scary to Gen Z, leading to them ignoring or pushing it off for “the future”. This can be detrimental as many of Gen Z are beginning adulthood— knowledge of personal finances can ultimately make or break their situation for years, even decades to come.
Solution
Savr is a mobile application that addresses these concerns by creating a welcoming, fun, and whimsical learning environment where Gen Z can learn new financial skills, tips and tricks, and how to effectively be financially independent. Users can do hands-on activities that replicate real-life scenarios and situations so that they can practice in a safe and risk-free environment.
EMPATHIZE
Market research
We began by identifying similar apps, services, programs, and other products that are within the domain of finances and education. We did a SWOT analysis to get a sense of the market competition.
NerdWallet has a lot of good information that is backed by trusted and reliable sources. However, it appears to still be pretty overwhelming and unengaging, primarily catering to an older user base.
Fidelity is a popular brokerage that has many key features that fit the industry standard. It does lack educational elements, and users still need prompting or guidance to fully comfortably use it.
Generative AI does a great job of creating personalized and detailed financial plans. It can be very convenient and highly accessible. However, with general AI tools, information can be unreliable and lack clear accountability.
User research
We also conducted user research to get a better understanding of our stakeholders and their personal needs. We surveyed and interviewed various students.
Survey
In a survey, we asked: “What has discouraged you from learning about financial products/services in the past?”
Most people stated that it was due to feelings of being overwhelmed and intimidated that strayed them away from learning about personal finances. Other main factors included not having enough money or time to even worry about it.
Interview
Through our semi-structured interviews, we took away three (3) main insights from students with self-reported mediocre knowledge of personal finances:1. Want to learn more about long-term strategies:They have a good understanding of basic tools like checking accounts, savings, and credit cards, but lack knowledge on topics like investing and retirement.2. Previously learned from their parents and trusted peers:They relied on knowledge that came from trusted support systems, such as their parents or close friends, as opposed to other mediums.3. They learn better through practice, visuals, and real-time feedback:They want to be able to learn in a risk-free environment where they can get real-world practice and credible financial advice.
DEFINE
Problem statement
Using both the market and user research to research our users, we came up with the following driving problem statement:
“How might we support Gen Z in developing a stronger understanding
and confidence in their personal financial literacy, by making the learning process both fun and engaging?”
IDEATE
Crazy 8
With this driving statement and prior research in mind, we did a group activity to generate ideas. This involved the technique, Crazy 8.
What is Crazy 8? Crazy 8 is an ideation sprint in which we all spend a total of 8 minutes coming up with random ideas. We each have eight squares where we spend one minute sketching, jotting, and spilling our crazy ideas in these squares. By the end of this quick activity, we hope to have 48 new ideas, assuming we have six participants!
?
Some shared ideas generated in this session:
Education policy
Gamified App
*
Anime
Interactions
*
Personalized mentorship
Discussion forums
Paying them
Lectures
Putting everything in consideration, from the user research to the market research to common themes among our designers, we established our solid idea, combining two prevalent concepts, gamification and hands-on interaction:A mobile application that provides Gen Z with a whimsical and informative environment where they can learn and practice personal finance skills.
Low-fidelity BUILD
Wireframing
With our ideas in mind, we transformed them into more tangible wireframes. We’re using simplicity and minimal styling as this is a crucial phase for constant user testing and rounds of reiteration.
Through some user testing, we found that users generally liked building blocks-like activities, they would probably stray away from external links to learn more or open an account, and felt positively towards icons and illustrations. Through many iterations and deliberations with the team, our wireframes kept changing and evolving taking in to consideration all the input along the way.
High-Fidelity Build
Design system
We created an established design system entailing color palette, fonts, font sizes, and header hierarchy. This is crucial in keeping our styling consistent and clean, eliminating random discrepancies.
Header 1
34px | DM Sans SemiBold
Header 2
24px | DM Sans SemiBold
Header 3
20px | DM Sans Medium
Text
16px | DM Sans Medium
570646
9C3687
FFB3F2
FFD1F7
FFF8FB
Screens and features
After all of the research, ideation, wireframing, and user testing, we developed high-fidelity prototype screens. These screens serve as a polished representation that displays the functionality and interface of our final product.
Onboarding and Home
The app will tailor curriculum to user-inputted needs and familiar topics. Users will also get to have a personalizable pet in their home dashboard!
Exercise and Practice
Hands-on practice with real life financial strategies. Users can also simulate investing in stocks with real-life market data and mechanics, but with fake money— at no risk!
CONCLUSION
Final thoughts
With this, we have reached the end of the timeline and project. Although I am really proud of this project and the work we have put in, there is always room for improvement and further development.
Learning experience: This was the first time I lead a design team, and needless to say, it was a very hefty, yet rewarding experience. I learned first-hand the intricacies of design leadership and how to navigate tricky scenarios.
Things we could’ve done differently:
Doing academic/literature research. By doing so, we could learn more about existing educational frameworks and utilized countless academic studies that currently existed and are backed by research studies.
Collaborating with financial institutions. Most of our knowledge and content came from the internet and prior knowledge, but we could’ve had some great insights from subject matter experts in finances..
You reached the end!
brighthoang01@gmail.com