←  Kodi Alex Case 06

Children's home · Kismathpur, Hyderabad · Since 2013

Aadarana Trust

/aa·daa·ra·na/ — Telugu compassion

I designed and developed the website for Aadarana Trust, which runs children’s homes in Hyderabad. I built the pages about the homes, the trust’s story and impact, and the donation flow in Next.js.

aadaranatrust.org
RoleDesign & build, solo
FrameworkNext.js, App Router
HostingVercel
PaymentsRazorpay checkout
Seven girls from the Aadarana home standing in a line, smiling at the camera
A photograph from Aadarana’s home in Kismathpur, used on the website’s opening page.

The website

Meet Aadarana.

The homepage introduces the care the trust provides: shelter, education, health, and nutrition. From there, visitors can read about the children’s homes, learn how the trust started, or get in touch. I handled the design and the build.

A few decisions behind the pages ↓
Aadarana campaign artwork with two boys smiling together against a blue background
Campaign artwork used in this portfolio. The blue carries through the photographs, headings, and links.

What I focused on

01 / design & development
The aimMy approach
01

Opening with the homes

The first thing visitors see is a photograph from the trust. Below it, the homepage explains why shelter and education are central to Aadarana’s work.

02

Giving the story its own space

I built separate pages for the trust’s story, its impact, and contact details. Each is linked in the main navigation, alongside the page about the children’s homes.

03

Putting checkout together

I connected the donation page to Razorpay checkout, with payment orders created on the server. The flow also checks the visitor’s country to route them to the relevant donation option.

04

Taking it live

I built the site with Next.js and Tailwind CSS and deployed it on Vercel. Next.js handles image optimisation, and the fonts are served with the site.

What went into it

02 / the build

Design

  • A consistent blue across the site
  • Photographs from the trust
  • Dedicated pages for story, impact, and contact

Development

  • Next.js App Router
  • Tailwind CSS
  • Self-hosted fonts with next/font

Images & delivery

  • Image optimisation with next/image
  • Lazy loading below the opening screen
  • Deployment on Vercel

Donations

  • Razorpay checkout integration
  • Payment orders created on the server
  • Country lookup with a timeout

How I worked

  1. 01Problem

    Donors needed to understand the children’s homes and trust where their money goes.

  2. 02People

    Donors, volunteers and families finding the trust for the first time.

  3. 03Design

    It opens on a photograph from the home; story, impact and contact each get their own page.

  4. 04Build

    Next.js on Vercel, with online donations.

  5. 05Result

    A site the trust can keep up to date after handover.