Wthout Landing Page

Process

The idea for Wthout spawned from attending tons of really cool events, but having a hard time finding them. I'd spend an hour every Sunday Googling for events and meetups in downtown Denver and then populating my calendar with tech, business, design, and social events. Wthout is an attempt to automate this process and curate events to a user's preference. Our MVP was an email list I populated with parties around campus on Halloween, so the main goal of the page was to convert visitors to our link to subscribers to our email list.

Our target demographic was freshmen and sophomore college students at the University of Denver and surrounding Denver metro area who are heavy smartphone users, like to socialize, and may be looking for new experiences and opportunities to meet new people.

Wireframes and Mockups

I wanted to get some printed advertising out across campus, but we first needed a landing page. The landing page needed to be scaleable and peruasive across both mobile and desktop so that anyone could access it anywhere on campus and signup as easily as possible. I weighed a variety of options across both platforms to achieve this main goal, from presenting event examples and a lot of imagery to one big jumbotron that prompted the user to find out more about the product. The early wireframes attempted to balance intriguing and interactive photo content with light copy but it quickly became clear that the value of the product needed to be as concise and available as possible, and that populating the event feeds would be a huge content burden.

I experimented with sizing and positioning of the mission statement and value proposition, as well as how to direct the user towards giving us their email. I focused on how to balance the copy with photography and what would make the page extremely digestible in seconds.

I knew while I was designing the page layouts that there was going to be a heavy emphasis on photography, so I rendered a couple of unique digital mockups to see how photography would effect the layout. Balancing the hues of the the photos and the Wthout color palette was definitely a challenge in composing these. Rendering the photos in a light grey filter and adding color accents looked the most appealing, but the colors vibrated a little too much and were difficult to read on the detailed photo backgrounds. I tried a much more minimalistic approach with one big jumbotron and a simple headline. I personally would have preffered a different photo, but our target demographic was college students, so it needed to look casual and fun. One of the worries in the final layout was that the composition and color scheme was too masculine, so I tried to lighten-up the page with the yellow fading in and out of links and a light green for actionable confirmations.

Printed Materials

The printed advertising needed to convey the brand, mission, and product effectively, persuade people to visit the landing page, and be relatively affordable to produce. Rubik was a thick, quirky and cool font introduced to the Google font family fairly recently, and I built most of the brand around it for the website, so naturally it needed to be on the print materials. The copy on the material was as direct as possible, and featured the website link and an email for people to reach us at. I designed the little pointer-hand to complement the weight of Rubik.

Final Design

The design of the final landing page features an arial photo of the University of Denver campus I shot with my drone, then edited to match the brand pallette of soft, earthy pastels and a stark yellow/gold. The only purpose of the landing page was to funnel sign ups, so I went with a basic minimum viable product presenting the logo, general idea, and a "join" button. The desktop page had a lot more real estate, so I put a very subtle arrow to direct the user to scroll down while letting the photo steal the show. The mobile page doesn't have an arrow, but rather brings the text higher up the page to imply the user should scroll down. I had to crop the photo over the main tower so mobile users still recognized it was a picture over the campus. We went from 20 to 150 subscribers after Halloween, converting about 25% of unique visits to subscribers in that time period. This could mean that the website worked well, but I think the value proposition and copy could have used a little bit more work. Regardless as to whether that was the case, I heard that people drove all the way out from Boulder (~40 minute drive) to attend some of the events we advertised through our feed!

Feel free to see the results for yourself at Wthout.com