Tackling your first project: The new Yik Yak site

Product

You’re new, you wanna prove yourself, and you have a background in making websites and website-related materials. What do you do? If you said “read this blog post,” 👌. If you said “I dunno,” also read this blog post.

I started at Yik Yak in November, and I love it. The people, the work, the murals: all top notch. My first project was to lead the remake of our website, which we started the afternoon of my first day.

When we started, we knew there were a couple of key things we wanted to hit on:

  1. Be authentic. Make sure the personality of our brand — really the personality of everyone working at Yik Yak — is present and consistent. We wanted our website to feel fun, with a high level of quality.
  2. Illustrate all the things. Aside from being a pin baron and all-around good guy, Daniel Haire is an amazing illustrator. His designs are a visual symbol of what the Yik Yak brand has come to embody, and I wanted that to stand out on our new site.
  3. Yak Green all the way down. Our signature green (what you all jokingly refer to as “Yik Yak Teal”) aligns perfectly with the personality of our brand, and I wanted to tie it to the personality of the site. (Though I hear a splash of color is coming in V2 👀)
An early concept for visuals in the hero area

An early concept for visuals in the hero area

One of the first things I did was work on the element I could picture most clearly in my head: the hero. For those wondering about website jargon, the “hero” area exists at the top of a page and usually has an attention-demanding visual paired with a clear action. Think about a stop sign. The red is essentially that attention-demanding element, while the text on the sign saying Stop lets you know what you’re supposed to do next.

A little asymmetry never hurt anybody

A little asymmetry never hurt anybody

While this was appealing visually, it felt out of place when the rest of the site used illustrations so heavily. In the end it was a direction we decided not to go in. It wasn’t hitting on what we wanted. We wanted our website – the “home base” for so many people who discover Yik Yak for the first time – to convey Yik Yak’s mission of making the world feel small again. After all, the essence of Yik Yak is enabling real conversations between people in the same place – regardless of device. 

Here’s the first mock of the site, printed and hanging next to Daniel Haire’s desk.

Here’s the first mock of the site, printed and hanging next to Daniel Haire’s desk.

I started integrating photography into the hero but quickly realized it wasn’t going to be the ideal solution for a couple reasons. First and foremost, Yakkers are diverse. People on Yik Yak come from all kinds of different backgrounds and that’s something I wanted to reflect in the hero. Also, with video I felt like I could capture a range of emotion rather than just one. For example, in the video that’s live now, the first shot shows a young woman reading a yak and then laughing. You can see the focus as she’s reading over the yak, and then the response. She even looks up to share it with her friend standing out of frame Mr. Justin Carson. That chain reaction isn’t something you can capture in one frame. Building on that, I really wanted each part of the video to be someone different from the person before them. We’re all different but happiness and joy are universal. 

Shooting the videos was a ton of fun. My main focus was capturing a tiny moment of genuine happiness. I wound up getting a minute here, 30 seconds there for each person and extracting these little 2 second clips that I thought really hit the mark. Then I dropped them in iMovie, pulled the color, boosted the contrast and exported it. While there are more quality ways of doing this, our approach was simple and could be easily replicated down the road when we change out our hero videos.

Thank you to the brave Yakkers who volunteered to be in the hero video

Thank you to the brave Yakkers who volunteered to be in the hero video

The video wound up working out really well and nailed the direction we wanted to take: less tech, more emotion. All in all, the hero was incredibly important and something that saw quite a few iterations. In my next post, I’ll talk about everything else besides the hero and share some of the things that didn’t make it into the site. I really hope you all enjoy the site, this post, and using Yik Yak as much as we enjoy building all of this for you. Talk to you soon!