SlideShare a Scribd company logo
1 of 28
KG Feelings case study
Karolyn Garzon
The product:
KG Feelings wanted to create an app to help kids
learn about emotions and empathy.
Project overview
Project duration:
October 2022 to November 2022
The problem:
Users want an easy and fun method for
children to learn about empathy and emotions.
Project overview
The goal:
Design a fun, safe mobile app for kids that will
teach them about emotion and empathy.
My role:
UX designer: designing an app for KG Feelings
from conception to delivery.
Project overview
Responsibilities:
Conduct interviews, paper and digital
wireframing, low and high-fidelity prototyping,
conducting usability studies, accounting for
accessibility, and iterating on designs.
Understanding
the user
● User research
● Personas
● Problem statements
● Competitive audit
● Ideation
User research: summary
I conducted research on users to understand their wants and needs in order to design an effective
app. Primary user group identified through research were young children.
The user research revealed how children learn new concepts and how they navigate through an
app. One of the main findings is that children quickly learn how to naviagate an app. Another
finding is that children become easily unintrested with an app if it is too complex or boring.
Persona 1: Jacob Kennedy
Problem statement:
Jacob Kennedy is a 3rd
grader who needs a new
way of learning about
feelings because he is
curious and because his
parents think its
important.
Persona 2: Jane Jones
Problem statement:
Jane Jones is a
Kindergartener
who needs a fun,
exciting way of learning
about emotions
because her parents
think its important.
Competitive audit
The top competitors are Feelu, Daylio, and wondergrade. Audit revealed theats and opportunities
for the KG Feeling app.
Ideation
During an ideation exercise, I
initial jot down my ideas for
an app to help kids learn
about emotions and
empathy. Since the app is
designed for children, it is
important for the app to be
simple, easy to understand.
● Digital wireframes
● Low-fidelity prototype
● Usability studies
Starting
the design
Digital wireframes
The digital wireframe gives
a concrete idea of the
layout of the app. The
designs incorporates the
findings from the user
research.
Use of large font and
large icons for easy
comprehension.
Simple
homepage
button, easy
navigation.
Low-fidelity prototype
The low-fidelity prototype shows the
general user flow from browsing the
website to completing the order.
In the first usability study, most
participants expressed confusion
navigating the app and homepage.
The app layout and homepage were
modified to a simpler, concise
version.
Usability study: parameters
Study type:
moderated usability study
Location:
United States
Participants:
6participants
Length:
30-60 minutes
Usability study: findings
The usability study revealed the wants and needs of the user and pain points in the original
mockup, which will help to improve the high-fidelity prototype. In summary, participants want
a simple, easy to navigate app.
Participants were
confused about the app
layout.
Finding Finding Finding
Participants quickly
became uninterested
by the app.
Participants expressed
confusion understanding
the homepage.
1 2 3
● Mockups
● High-fidelity prototype
● Accessibility
Refining
the design
Mockups
I added colors to the layout
for child to relate the colors
to the emotions. Font is
large and clear for easy
understanding.
Before usability study After usability study
Mockups
The usability study revealed
the users' frustration when
navigating the app. For the
redesign, I added east-to-
understand images.
Before usability study After usability study
Mockups
High-fidelity
prototype
The high-fidelity
prototype followed
the same user flow
as the low-fidelity
prototype. There is
navigation icons on
every page for easy
back and forth.
Prototype Links: iPhone, Tablet, Desktop.
Accessibility considerations
Used icons to help make
navigation easier.
Incorporated high-
contrast color palette in
order to make it
accessible for those with
visual impairments.
Used large images for
visual help. Simple layout
easy understanding.
1 2 3
● Information architecture
● Responsive design
Responsive Design
Sitemap
The app is very simple. There are
two main page: emotions and
empathy. The emotions page has
much more elements.
Home
Emotions
Green
Disgust
Confused
Worried
Nervous
Blue
Sad
Worried
Scared
TIred
Yellow
Happy
Calm
Excited
Silly
Red
Mad
Annoyed
Jealous
Hurt
Empathy
Responsive designs
It is important to keep the
app’s branding and
consistency. Because this
app is for children, I
decided not to make any
major changes to the
layout.
● Takeaways
● Next steps
Going forward
Takeaways
Impact:
The app provides a method for children to
explore and learn about their feelings and
empathy. This app will improve children’s lives
and make them emotionally intelligent.
What I learned:
While designing the KG Feelings app I learned
that much more details is added to the
prototype later in the process, especially after
receiving feedback. UX design is ever flowing.
Next steps
Refine prototype:
• Add more detailed
frames.
• Add more animations.
• Add more visual
elements that will
enrich the design.
Conduct another usability
test in order to assess
user flow and determine
any new areas of need.
Add other elements such
as video features .
1 2 3
Let’s connect!
Thank you for reviewing my KG Feelings case study. If you would like to get in touch, please contact
me via email. Thank you!
Email: karolyngarzon@hotmail.com

More Related Content

Similar to Kids case study.pptx

Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...AnandGopalakrishnan8
 
[UX Design Exercise] Miriwoong
[UX Design Exercise] Miriwoong[UX Design Exercise] Miriwoong
[UX Design Exercise] MiriwoongAmy Cheong
 
Case Study for Ntachi-Osa Restaurant
Case Study for Ntachi-Osa Restaurant Case Study for Ntachi-Osa Restaurant
Case Study for Ntachi-Osa Restaurant ObianujuRosejoy
 
UIUX Design - report on summer training.docx
UIUX Design - report on summer training.docxUIUX Design - report on summer training.docx
UIUX Design - report on summer training.docxbhawnamangla2
 
Food Toast Case-study-slide-deck-(1).pptx
Food Toast Case-study-slide-deck-(1).pptxFood Toast Case-study-slide-deck-(1).pptx
Food Toast Case-study-slide-deck-(1).pptxJayKrishh
 
CoCo - case study
CoCo - case studyCoCo - case study
CoCo - case studyGemma .
 
Case Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptxCase Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptxChan Jia Jun
 
Steam Project.docx
Steam Project.docxSteam Project.docx
Steam Project.docxKod Alketbi
 
Study time app presentation
Study time app presentationStudy time app presentation
Study time app presentationsmsschool
 
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...VimalSavi
 
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)Maryam Farooq
 
fast delivery (1).pptx
fast delivery (1).pptxfast delivery (1).pptx
fast delivery (1).pptxImaneBenamou
 
Project-based learning
Project-based learningProject-based learning
Project-based learningHansa Narang
 
Kidscriptz Case Study.pptx
Kidscriptz Case Study.pptxKidscriptz Case Study.pptx
Kidscriptz Case Study.pptxChristinaJames35
 
Therapist app - Case study
Therapist app - Case studyTherapist app - Case study
Therapist app - Case studyAbineshVivek
 

Similar to Kids case study.pptx (20)

Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...
 
[UX Design Exercise] Miriwoong
[UX Design Exercise] Miriwoong[UX Design Exercise] Miriwoong
[UX Design Exercise] Miriwoong
 
Case Study for Ntachi-Osa Restaurant
Case Study for Ntachi-Osa Restaurant Case Study for Ntachi-Osa Restaurant
Case Study for Ntachi-Osa Restaurant
 
UIUX Design - report on summer training.docx
UIUX Design - report on summer training.docxUIUX Design - report on summer training.docx
UIUX Design - report on summer training.docx
 
Food Toast Case-study-slide-deck-(1).pptx
Food Toast Case-study-slide-deck-(1).pptxFood Toast Case-study-slide-deck-(1).pptx
Food Toast Case-study-slide-deck-(1).pptx
 
Tutor finder
Tutor finderTutor finder
Tutor finder
 
Audubon's UX portfolio
Audubon's UX portfolioAudubon's UX portfolio
Audubon's UX portfolio
 
L3 CMPT Y2 Evaluation.pptx
L3 CMPT Y2 Evaluation.pptxL3 CMPT Y2 Evaluation.pptx
L3 CMPT Y2 Evaluation.pptx
 
CoCo - case study
CoCo - case studyCoCo - case study
CoCo - case study
 
Presentation2
Presentation2Presentation2
Presentation2
 
Presentation2
Presentation2Presentation2
Presentation2
 
Case Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptxCase Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptx
 
Steam Project.docx
Steam Project.docxSteam Project.docx
Steam Project.docx
 
Study time app presentation
Study time app presentationStudy time app presentation
Study time app presentation
 
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...
Google UX Design Certificate - Portfolio Project 1 - Case study slide deck [T...
 
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)
NYAI #18: Designing for AI (Rob Strati & Jesse Schifano of ECHO)
 
fast delivery (1).pptx
fast delivery (1).pptxfast delivery (1).pptx
fast delivery (1).pptx
 
Project-based learning
Project-based learningProject-based learning
Project-based learning
 
Kidscriptz Case Study.pptx
Kidscriptz Case Study.pptxKidscriptz Case Study.pptx
Kidscriptz Case Study.pptx
 
Therapist app - Case study
Therapist app - Case studyTherapist app - Case study
Therapist app - Case study
 

Recently uploaded

Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentInMediaRes1
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxChelloAnnAsuncion2
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........LeaCamillePacle
 
Hierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementHierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementmkooblal
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfFraming an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfUjwalaBharambe
 
Romantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxRomantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxsqpmdrvczh
 
ACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfSpandanaRallapalli
 
ENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomnelietumpap1
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17Celine George
 

Recently uploaded (20)

Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media Component
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
9953330565 Low Rate Call Girls In Rohini Delhi NCR
9953330565 Low Rate Call Girls In Rohini  Delhi NCR9953330565 Low Rate Call Girls In Rohini  Delhi NCR
9953330565 Low Rate Call Girls In Rohini Delhi NCR
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
 
Raw materials used in Herbal Cosmetics.pptx
Raw materials used in Herbal Cosmetics.pptxRaw materials used in Herbal Cosmetics.pptx
Raw materials used in Herbal Cosmetics.pptx
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...
 
Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........
 
Hierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementHierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of management
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfFraming an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
 
Romantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxRomantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptx
 
ACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdf
 
ENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choom
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17
 

Kids case study.pptx

  • 1. KG Feelings case study Karolyn Garzon
  • 2. The product: KG Feelings wanted to create an app to help kids learn about emotions and empathy. Project overview Project duration: October 2022 to November 2022
  • 3. The problem: Users want an easy and fun method for children to learn about empathy and emotions. Project overview The goal: Design a fun, safe mobile app for kids that will teach them about emotion and empathy.
  • 4. My role: UX designer: designing an app for KG Feelings from conception to delivery. Project overview Responsibilities: Conduct interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
  • 5. Understanding the user ● User research ● Personas ● Problem statements ● Competitive audit ● Ideation
  • 6. User research: summary I conducted research on users to understand their wants and needs in order to design an effective app. Primary user group identified through research were young children. The user research revealed how children learn new concepts and how they navigate through an app. One of the main findings is that children quickly learn how to naviagate an app. Another finding is that children become easily unintrested with an app if it is too complex or boring.
  • 7. Persona 1: Jacob Kennedy Problem statement: Jacob Kennedy is a 3rd grader who needs a new way of learning about feelings because he is curious and because his parents think its important.
  • 8. Persona 2: Jane Jones Problem statement: Jane Jones is a Kindergartener who needs a fun, exciting way of learning about emotions because her parents think its important.
  • 9. Competitive audit The top competitors are Feelu, Daylio, and wondergrade. Audit revealed theats and opportunities for the KG Feeling app.
  • 10. Ideation During an ideation exercise, I initial jot down my ideas for an app to help kids learn about emotions and empathy. Since the app is designed for children, it is important for the app to be simple, easy to understand.
  • 11. ● Digital wireframes ● Low-fidelity prototype ● Usability studies Starting the design
  • 12. Digital wireframes The digital wireframe gives a concrete idea of the layout of the app. The designs incorporates the findings from the user research. Use of large font and large icons for easy comprehension. Simple homepage button, easy navigation.
  • 13. Low-fidelity prototype The low-fidelity prototype shows the general user flow from browsing the website to completing the order. In the first usability study, most participants expressed confusion navigating the app and homepage. The app layout and homepage were modified to a simpler, concise version.
  • 14. Usability study: parameters Study type: moderated usability study Location: United States Participants: 6participants Length: 30-60 minutes
  • 15. Usability study: findings The usability study revealed the wants and needs of the user and pain points in the original mockup, which will help to improve the high-fidelity prototype. In summary, participants want a simple, easy to navigate app. Participants were confused about the app layout. Finding Finding Finding Participants quickly became uninterested by the app. Participants expressed confusion understanding the homepage. 1 2 3
  • 16. ● Mockups ● High-fidelity prototype ● Accessibility Refining the design
  • 17. Mockups I added colors to the layout for child to relate the colors to the emotions. Font is large and clear for easy understanding. Before usability study After usability study
  • 18. Mockups The usability study revealed the users' frustration when navigating the app. For the redesign, I added east-to- understand images. Before usability study After usability study
  • 20. High-fidelity prototype The high-fidelity prototype followed the same user flow as the low-fidelity prototype. There is navigation icons on every page for easy back and forth. Prototype Links: iPhone, Tablet, Desktop.
  • 21. Accessibility considerations Used icons to help make navigation easier. Incorporated high- contrast color palette in order to make it accessible for those with visual impairments. Used large images for visual help. Simple layout easy understanding. 1 2 3
  • 22. ● Information architecture ● Responsive design Responsive Design
  • 23. Sitemap The app is very simple. There are two main page: emotions and empathy. The emotions page has much more elements. Home Emotions Green Disgust Confused Worried Nervous Blue Sad Worried Scared TIred Yellow Happy Calm Excited Silly Red Mad Annoyed Jealous Hurt Empathy
  • 24. Responsive designs It is important to keep the app’s branding and consistency. Because this app is for children, I decided not to make any major changes to the layout.
  • 25. ● Takeaways ● Next steps Going forward
  • 26. Takeaways Impact: The app provides a method for children to explore and learn about their feelings and empathy. This app will improve children’s lives and make them emotionally intelligent. What I learned: While designing the KG Feelings app I learned that much more details is added to the prototype later in the process, especially after receiving feedback. UX design is ever flowing.
  • 27. Next steps Refine prototype: • Add more detailed frames. • Add more animations. • Add more visual elements that will enrich the design. Conduct another usability test in order to assess user flow and determine any new areas of need. Add other elements such as video features . 1 2 3
  • 28. Let’s connect! Thank you for reviewing my KG Feelings case study. If you would like to get in touch, please contact me via email. Thank you! Email: karolyngarzon@hotmail.com