In this April Fool's Day hackathon, I worked with a  small team to make an present a product page for an unbeliveable poncho. 

The Challenge

Working on a four-person team, two designers and two engineers we were charged with the task of creating a landing page and newsletter sign-up for a fabulous poncho. I was responsible for consolidating designing ideas, wireframes and hi-fidelity screens.

​The end result would be a mobile first, responsive site the user could sign up for a newsletter.

Our Research

My research was about looking up pattern layouts for the newsletter sign up module. I was interested in seeing many examples at once. This gave me a good understanding of the common patterns.

My design partner was able to pull four sites to compare elements, content, and standard layouts.
 

Sketching it Out

Since we needed a mobile-friendly site, I sketched out both layouts at the same time for consistency. Once the layout was set I recopied the layouts so the development team could get started. This helped ID the elements we would need.  

Getting Visual

While I was working on setting up the layout, my co-designer had been working on developing the brand guidelines and sourcing the content.

This Ain't Low-fi

Once we had the brand and content, I was able to take my wireframes and give them some life by applying the color pallet and content. Since we were working with a rain poncho we wanted the color scheme to feel cool and inviting.

We went with a soft blue for our header, footer, and pop-up. I wanted the primary buttons to be vibrant which is why a burnt orange was chosen; a contrasting color to blue.

A Completed Sprint

Shipping a product in 2 days is fun and intense.

 

The experience of working with developers gave me insight into how to collaborate in the future. The biggest lesson I learned is that communication needs to be fluid and constant. I could have been better about the frequency of my check-ins to achieve a product that represents our concept.