Case Study: FamilyLeaf

One of our most popular case studies so far was the Perch site redesign by Paddy Donnelly.

And what do you know, this week we take a look at another stellar redesign by Paddy, the FamilyLeaf homepage. We’ll be joined by Ajay Mehta of FamilyLeaf.


First of all, can you briefly introduce what FamilyLeaf does?

FamilyLeaf is a private network for your spread-out family to keep photos, conversations, and information in one secure place. We started working on this idea at YCombinator back in March, and our mission is to help families around the world stay in touch.

Although the internet has helped many of us connect better with friends, acquaintances, and work colleagues — it has done surprisingly little to bring us closer to some of the most important people in our lives: our family.

Preparatory sketches

Finding The Right Time For Design

For a startup, the question is not so much if design matters, but when it matters. A startup’s resources and time are limited, so finding the right priorities at any given time is vital.

You’ve launched a couple months ago, if I’m not mistaken. What made you decide it was time for a redesign? Launching a startup involves many moving pieces, so where does branding and design fit in in your company’s priorities?

You’re right — we launched our very early beta on TechCrunch right before Demo Day at the end of March. But in the months since then, we’ve really focused on improving the FamilyLeaf experience for our early users, and a big part of that was a visual and UI/UX upgrade.

Design is hugely important to a company like ours that has a wide audience (maybe unsurprisingly, many of our users don’t fit the typical young male techie stereotype). We constantly need to make FamilyLeaf as clear, easy-to-use, and delightful as we possibly can. It’s the highest priority.

The Elements of a Good Homepage

Paddy, once again (see the Perch redesign) you’ve created a richly illustrated homepage with dynamic typography and fresh colors. Do you think that this is becoming your “style”? Is there a point where having a personal style takes away from your ability to adapt to the job at hand?

Illustration is certainly something I’ve been incorporating into my web designs more and more, however I start each project from scratch with thorough wireframing and moodboarding sessions in order to create a design that’s right for my client and the end user.

A style is important to have, but it’s just as important to try out new things and push yourself out of your comfort zone.

Speaking of typography, how did you choose to use Cubano? Any other fonts you’d recommend or that you enjoy using right now?

We actually didn’t choose Cubano until later in the design process. Initially, we were experimenting with more scripty type, but readability was an issue and I wanted something with a lot more strength as we had kept the copy on the website pretty short.

It was important that the type still retained a friendly edge for the FamilyLeaf message, and Cubano had all these qualities. There are some fantastic type choices over at the Lost Type Co-op and I’m particularly keen to try out their Abraham Lincoln on a project.

Illustration detail

Another thing that struck me about the homepage is how clear and concise its message is. I counted, and there are less than 80 words on the page altogether (as a comparison, competitor Everyme has 140 words on their much shorter homepage).

How did this happen? Did you start out to keep it short from the start, or did it take many iterations to reach this point?

I can only speak for myself here, but I’ve never personally been a fan of overdone copy. You don’t need to write too much to convey the general message and emotions that we want our users to feel before clicking the “sign up” button.

We tried to convey our product’s story visually, and the words are few but hopefully high in impact.

Oftentimes copy can become a crutch to lean on when you have trouble crafting a clear message. Through the illustrations and design we wanted to create the atmosphere for FamilyLeaf, while reserving the copy to communicate the finer details of the product.

We made sure to keep it short, while still  getting the key messages across to the potential users.

Finding The Right Match

Folyo will put you in touch with about a dozen great designers, but the question remains of knowing which one to pick. Making it even harder in this particular case was the fact that Ajay’s posting received an unprecedented 27 replies!

Picking a designer is always tricky, especially for people who do not have a design background themselves. How did you decide to work with Paddy? What made you pick him rather than one of the other designers who applied for the job?

I learned something very early on in my search for designers: all designers worth picking have a certain, distinctive style. Design is a creative thing – if you enter with a preconceived notion of exactly what you want a page to look like, the process is likely to be exhausting, expensive, and frustrating.

We picked Paddy because the style of his previous projects – the “cute,” accesible nature of his illustrations – was exactly in line with what we wanted for FamilyLeaf.

Homepage detail

Conversely Paddy, what did you find interesting about this project? What did Ajay do right to make you want to work with him?

It was pleasing to see that FamilyLeaf was not just ‘another social network’. Aiming to unite families and make it easier to share updates was certainly something that sparked my interest, with the Tidbit weekly digest emails feature being something I could see myself using with my family.

After my first Skype chat with Ajay, I could clearly see his passion for his product and that’s an extremely encouraging factor when deciding to work with a client.

Closing Thoughts

Did you see an increase in the sign-up rate after the homepage? Did the redesign live up to your expectations and goals?

It’s too early to talk about sign-up rates! But I can certainly say that we’re very proud of the homepage we have now, and it’s a massive step up from what we had before. A beautiful, nice homepage can impact your company’s brand immeasurably.

What were your impressions of using Folyo? Would you recommend the service to other startups? Anything we could improve?

I was very pleasantly surprised by Folyo’s usefulness! It was recommended to me by one of the guys here, Henry Liu (he mentions that you had spoken to him very early on about the Folyo idea).

I posted a job not necessarily expecting much, but I ended up contacting 10+ solid-to-great designers (and definitely plan to stay in touch with some of them for the future). I would highly recommend Folyo to any startup looking for a designer.

Thanks to both Paddy and Ajay for answering my questions, and congratulations for building such a beautiful site!

  • http://www.JakeMiller.Me Jake Miller

    Love this design! Good work FL!

  • Windo

    good story, seems like everything are going as smooth as planned except the typo :) . love the warm feeling when I get to family leaf’s site.