Retirement Budget Calculator

cover image for retirement budget calculator project

In spring 2021 the CTO of Retirement Budget Calculator, a friend and mentor, reached out to me about redesigning the home page of the site, which had been built as a placeholder. Here's how it looked when I started...

old retirement budget calculator home screen

The goals of the project were to 1. modernize the site, namely with a new headings font. 2. to humanize the site with age appropriate, joyful stock photos. 3. to design with comfortable white space. I also wanted to polish up the color scheme, and we ran a 99Designs contest for a new logo simultaneously.


The building blocks were there, so we landed on the core structure of the site pretty quickly. We knew we needed to show customers what the product looked like, why the tool was important, and why should trust us with their retirement plan.

Retirement Budget Calculator screen mockup
Retirement Budget Calculator screen mockup

Here is the first low-fi wireframe, and a a couple iterations later. We had vastly improved the flow of the site, and gotten closer to a final color system. There were still a couple sections to add, and the photos weren’t quite right.


Here is the final design we landed on.

Retirement Budget Calculator screen mockup

As my ideas for the site evolved, I decided that it was important to go for a fun vibe, that could get customers excited about planning for retirement. I'm really happy with how the hero image ties into this.



I felt as though it would be important for customers to see a snapshot of the product, so that it didn't look too unfamiliar when they logged in and started to populate their personal plan.

With a tool as crucial as a retirement planner, I knew it was important to establish credibility. On the original site design the testimonials were laid out uninterestingly, and were entirely ignorable. To make them pop I gave them their own distinct section with plenty of padding, as well as individual focus through a timed slideshow. Presenting a comfortable amount of information made them much more readable.



One potential selling point over Retirement Budget Calculator's competitors is the online community that exists for this product. We wanted to show users that there was a way to ask questions, and discuss the facts of saving for retirement.



The same goes for the blog, which contains a lot of helpful information for customers to take advantage of.

Another important way I established trustworthiness was highlighting the "As Seen & Heard On" section, as well as including a title with the news feature.

Check out the completed site here.