Buzz

See the project on GitHub or view it live
Or, if you like, watch my Demo Day presentation

Timeframe: 2 weeks

Project Description

For final projects at The Iron Yard, we were given two weeks to create a website, web application, or native mobile app prototype. It was challenging to pull everything together in that timeframe, but I survived, and learned a lot in the process.

The idea for my final project at The Iron Yard came from the fact that I have a really hard time introducing myself to people who I look up to. I guess you could say the problem I was hoping to solve was introversion. The solution I came up with was fairly simple: a platform where people like me could enter to win a coffee meeting with a leader in the design, tech, or business industries. I call it Buzz.

Buzz Homepage

Research

The first step in my design process was research. I thought about who would be using the site and what they would want to accomplish. I conducted surveys, reaching out to people like myself who might like to meet a leader, and industry leaders to see if they would be interested in doing something like this. I used what I learned to make decisions regarding what features to include and the general feeling the site should convey.

Google Survey

Planning

After research, I made sketches and wireframes to plan out the best user experience for the site. I focused on the user and their goals, only serving up the most pertinent features and information to help them complete their task simply and easily.

For example, it was important that people be able to quickly and easily find a leader they're interested in and enter to meet them. To that end, I designed the site so users wouldn't have to create an account or login to participate; they just fill in their name and email address, and click Enter. If they win, they are notified via email.

Buzz Mobile Sketches

Design

For the visual look of the site I created several different style tiles where I experimented with colors, typography, and patterns. I chose a script typeface that is casual and light, reminiscent of handwriting with a fun, friendly feel.

Likewise, I used fresh colors to create an accessible, organic aesthetic. The color blue, most prominently featured in the design, is associated with trust and wisdom. The color green is associated with growth and freshness.

Buzz Style Tile

Challenges

There were a number of challenges I faced during the course of this project, but the biggest was making time to rest. Even with prior experience designing and coding, I worried about staying on track with the schedule I laid out for myself. I felt anxious about whether or not I'd be able to complete everything on time. So I would stay up late and wake up early in an effort to keep up. After a while it caught up with me. When I caught myself making mistakes I wouldn't normally make, I decided that was it. I went to bed early that night, didn't wake up quite as early in the morning, and the next day I was much more productive.

Left: Browse Leaders, Right: Leader Page

Code

To build the site I used HTML, Sass, and jQuery. I wrote a Sass mixin to establish a grid system to keep things organized and create a strong hierarchy, and I designed it to be responsive, so it will adapt well to different screen sizes. I tested in a number of different browsers and devices to ensure a consistent experience.

Previous Next