Interactive Infographic for Single Dads
WHAT IT IS

An interactive infographic

MAIN GOAL

To empower dads with information and answers his questions about their daughters' development

AUDIENCE

Dads with daughters

WHY I MADE IT

I wanted to break down some of those awkward barriers that exist between dads and daughters when it comes to talking about topics like her period, puberty and birth control.

MY ROLE

Researcher, UX, and Visual Designer

STEPS I TOOK

Research, Sketches, Scenario and a Coded Prototype

Landing Screen of Infographic
GOAL

Dad wants to know what symptoms to expect when his daughter's first period comes.

GOAL

Dad wants to know what symptoms he should be concerned with.

GOAL

Dad wants to know when he should be concerned about his 12-year-old daughter.

GOAL

Dad wants answers to his uncomfortable questions.

HOW I DID IT

Collecting the data needed to inform dad

I collected the data that would be within this infographic. I created a research document that holds both contains both quantitive and qualitative data about a woman's development.

Research Document
Research Document
DISCOVERY FROM RESEARCH

From the research, I created the four main sections of the infographic: Period, Puberty, Birth Control, and Self Care.

STEP I TOOK

I placed the sections in the sidebar, as filters, so that dad could see as much or as little as he wants.

Topics of Research
Research Document
DISCOVERY FROM SCENARIO

By creating scenarios, I realized a lot of the content the dad would be looking for was question-based.

STEP I TOOK

I created a section of "frequently asked questions", where the dad could skim and find the answer his questions.

See it

Figuring out a visual way of containing the data

I decided to use circles because they can keep holding related information inside of them.

Dad's Scenario
Dad's Scenario
ITERATION THAT DIDN'T WORK

Initially, I used lines to show the relationship between the content.

The use of lines started to make the infographic look too complex.

STEP I TOOK

I got inspiration from an information design book and decided to nest circles within circles to show the symptoms of a specific event.

See it

Adding color coding and tooltips

I used color to differentiate the physical symptoms from the emotional ones. I also added tooltips to show what each symptom is, without having to move away from the landing screen. Both of these allow the dad to get information at glance.

 Tool Tip
 Tool Tip

Making it approachable with color and typography

Since it deals with the uncomfortable subject, I wanted to make it look very approachable and clean. For that reason, I chose to add a friendly sans serif and iconography.

 Style Tile
 Style Tile

Take another look at the prototype

The prototype follows the scenario I created prior, where the dad wants to be educated about his 12-year-old daughter.

THINGS I LEARNED
  • Using research insights, like the frequently asked questions, to help guide my design decisions
  • The importance of conducting user interviews to get a better understanding of what the dads really want out of the experience
  • Playing around with colors and contrast can make a huge difference when showing the relationship between items