Camp PolyHacks Website + Event

Role

User research + feedback, UI/UX design, information architecture, wireframing, high fidelity mockups

Tools

Sketch, InVision, Illustrator, Pen + Paper

Timeline

2 weeks

polyhacks banner-02.png

Project + Design Objectives

Cal Poly and the Center for Innovation and Entrepreneurship (CIE) have an array of innovative programs and resources for student entrepreneurs. Camp PolyHacks, an event that I and 6 other Graphic Communication students founded in 2016, brings together students from various disciplines to design/develop websites or apps that solve problems. 

Last year, Camp PolyHacks: 

- Brought together >90 students from disciplines across Cal Poly. 
- Aimed to solve problems for our community and on our campus. 
- Attracted people from various industries. 
- Engaged faculty, students, and mentors, for 12+ hours
- Helped students understand their strengths and encouraged them to continue working on their PolyHacks projects
- Fostered the spirit of entrepreneurship and teamwork
- Attracted an audience of over 50 students, community members, and local media for final pitches. 

I was asked to lead the redesign the Camp PolyHacks website for 2018, and the site is live at www.camppolyhacks.com

Read more about how we used UX methodologies to make hackathons more human.


Process OVERVIEW

Making hacking human

Process.png

EVENT research

To begin building our event experience, we talked to dozens of students, sponsors, community leaders, and educators to get a better grasp of current perceptions toward hacking itself. What we uncovered were two very different tales. On one hand, people spoke of the incredible, creative energy that went into forming a team and building an app in just a day. At the other end of the spectrum, however, some felt that hackathons were shrouded in overly technical language that conjured up imagery of a dimly lit room and hoodie-clad hackers vigorously typing out lines of code on mechanical keyboards. While we knew that hackathons, at their best, were incredibly creative events that brought people from design, business, and engineering together, we also took the other less ideal view on these events seriously. At the start of our redesign, we focused in on sending a message that a new kind of hackathon was coming to Cal Poly. PolyHacks would focus in on making hacking human. 


DESIGN OBJECTIVES

Brand Definition.png

We took a few weeks to brainstorm ideas as to how we could refocus our messaging for PolyHacks through our website. 

  1. Maximize value of PolyHacks mission by informing the public about our involvement of solving current issues in the community of San Luis Obispo. Emphasize inclusivity and how the best software is built by teams of designers, business people, and engineers coming together to build software for people. 
  2. Incorporate new branding and emphasize social entrepreneurship.

information architecture map

Info Architecture v2.png

SKETCHES + WIREFRAMES

These sketches drove the ideas for our 1st and 2nd design iterations. I was able to explore various layouts and explain the benefits of each one.

sketch - info arch.jpg
sketch - wireframes.jpg
 
 

Mockups

— 1st Iteration of UI

 
 
 

— 2nd Iteration of UI, after user feedback

 
new version.png
 

Visual Design

Style Guide-01.png