Case study-Designing an Age Calculator


My Goal

  • To provide an effortless user journey and an appealing visual experience following the basic UX laws to have a better user experience
  • To make a product that will not only be beneficial for the user but also for the owner of the product owing to it.

My Business Goal

The way I incorporated:-

  • Referrals on sharing the app-used sharing offers to make it an advantage when possible(will explain it further)further helping in marketing of the product.


Researched the product

  • I read a few blogs and articles regarding age calculators.
  • Interviewed a few of my friends to understand the target users.
  • Spoke to a few users who have used the age calculator to understand the issues they faced and what would they want in general.
  • Explored a few similar competitive products and read a few reviews to understand the pain points.

Reference Inferred -

Target audience

  • Workplace(any job sectors)- Age calculation is a must work at a workplace. Using google sheet and Excel is a bit delaying and tricky, hence an online application saves time and does the work easily.
  • Elderly users(considering it to be above 40yrs)-Elder people prefer an online application rather than the traditional method of counting since it takes a lot of time and memory to calculate it from the DOB.
  • Young users(below 40yrs)-Mostly include young generation to calculate the age check their upcoming birthdays.

User Expectation from the product

  • My Friend Srija(who belongs to the workplace also below 25yrs of age), who happens to be an Hr and needed the age calculator for work purposes.
  • My father(above 40yrs of age)wanted to check the age difference between him and his son.

They are:-

  • A decent way of calculating the age and checking the age difference rather than a complicated way.
  • Users don't want to spend too much time on the work
  • Users expect to have details about the age and save it
  • Users want a very simple clean UI.

Problem with other similar competitive products

  • Inconsistency in the UI screen complicated the way of entering the Date of birth details.
  • The UI is exaggerating and does not share the same format.
  • Unclear information hierarchy in form of buttons and information segregation.
  • Not well-structured User flow hence gets confusing and makes the user frustrated
  • Sudden Advertisement mid-way breaks the consistency of the content and does disrupt the action.
  • Keeping the business module in mind, too much advertising highlights the profit of the application only ignoring the priority of the users.

Why did I choose Referrals?

  • It helps to identify consistent customers.
  • Increases brand awareness.
  • In a study it showed up, it increases sales revenue at a low cost.


Getting started with the Information Architecture-

The User flow.
  1. To calculate the age- for the user who just wants to calculate the age and check the age details and know about their upcoming birthday and also save it.
  2. To calculate age difference- users who want to know the age difference and save it.
  3. Saved dates-for user who wants to check the saved dates.

Colour scheme

  1. it does not cause pain to the eyes. As the target audience is from all age group
  2. Also different from other similar competitive products.
The colour Palette.


Roboto typeface.

📱Screen Designs

Logo Design

Splash Screens

Splash screen preview

Home Screen

Organized and presented the actions in a way it is easier for the user to choose and make a decision based on their goals and needs.

  • There are 3 primary, secondary and tertiary actions categorized co-ordinating with the goal. As I said I studied other app and their UX to understand the structure. I concluded options are made depending on the different user goals.
  • Included the Affordance using the share option and the referral feature.
  • Made it Clean and simple.

Final Design

Referral page.

Category 1 -Age Calculator

Date inputs.step-1
The final design for the calendar picker.

Displaying results-

Result page-screen preview.
edit birth date-screen preview.

Card Design-

Final card Design.

Save Option-

Saving screen preview.

Category 2- Check the Age Difference

Calculate age difference screen preview.

Category 3-Saved Dates

Saved date feature screen preview.

And.. That's it!




Ux designer out here to solve problems with my logical ability and designing skills.Learning and experiancing the better.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Should recurring events be designed differently from one-time events?

Typography and UX

Redesign of Green Public Spaces in Skopje

Future retrospective

Case study: editorial design

UI/UX Articles and Interesting Tidbits of the Week

Things you need to know before Conducting User Research in India

Play as a catalyst for empathy in the corporate organization

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


Ux designer out here to solve problems with my logical ability and designing skills.Learning and experiancing the better.

More from Medium

Mood scales for mobile App- UX Research with social workers & at-risk youth.

Freshious |Enjoy fresh groceries


UI Case Study: how to connect tourists to the global city of Toronto

A hand holding up a cellphone with the app Explore Toronto open on it’s home page.