StartupHoyas Web Experience Overhaul

StartupHoyas is the club name of the Georgetown Entrepreneurship Initiative, supported by Georgetown University’s McDonough School of Business. We’re a relatively young organization but quickly developing presence in the Georgetown and greater DC entrepreneurial community. Given the large amount of resources and events StartupHoyas has to offer, our website is often the first place interested students are directed.

As the design and front-end web manager of our tech team, I worked with the back end developers and content manager to plan and execute a complete website overhaul. We worked with the CEO of a local boutique tech consulting firm and followed an agile project management process. Over the course of the fall 2015 semester, we defined and executed tasks for each team member and rotated through the role of scrum master for weekly sprints.

Goal

StartupHoyas has 4 driving pillars: inspire, teach, connect, launch. That’s pretty high level stuff. Translating this into a more concrete goal for the website:

To present information to motivate action.

Problem

Over the years, the website became an increasingly crowded database of info, info, and more info (events & programs, jobs, news, tips & tools). Information was tacked on as quickly and efficiently as possible, and users brought up unclear organization when interviewed on tips for improvement.

a) Unclear content divisions and a messy structure detracted from smooth presentation of information.

Additionally, with no defined aesthetic identity or standards (besides a logo and color palette), visual design and UX/UI suffered. As phrased by a user, the website was not “enticing to look at.” (Just bein’ real, an understatement in my opinion.) Page depth averaged only 1–2 pages and session duration per user short as well.

b) Poor design led to low interaction levels which hindered motivation to take action.
Therefore, the website did not fully embody the spirit of StartupHoyas.

It had been neglected as a product of StartupHoyas and its pioneering position in the growing DC tech community.

Our target users are also tech-inclined themselves, so a quality web experience would allow us to connect more deeply with them. An informational website that inspires action would thus help Startup Hoyas establish a reputable and engaging presence on campus and bring more people into the entrepreneurial community.

Solution

Time to get sketching!

Design

As with reevaluating many things in life, pen and paper work wonders. Oh, the possibilities! A new template and visuals galore!

I wanted to create a website with clean navigation and aesthetics, inspiring curiosity and lingering. This meant using clear structural divisions and abounding visuals to shape a fluid UX. Sounds simple, but it was something our previous template lacked. I also recognized that as one person dealing with multiple design elements (visual, UX, UI, content), I had a lotta learning and brainstorming to do.

First, I did a deep dive into inspirational sources collected from myself, the team, and users. To name a few:

Organizations: up.co, 1776.vc, creativemornings.com, capitalfactory.com, magazine.good.is

Educational institutions: dschool.stanford.edu, marriottschool.byu.edu/cet

The mockups were based off a new Wordpress theme that we purchased. I experimented with Photoshop, InVision, and Balsamiq, ultimately settling on Photoshop. It’d paint a more direct & accurate picture for presenting to the tech team and our program directors, and in this case I was willing to trade efficiency for accuracy. Looking at analytics, students usually website looking for specific resources, so I decided to keep the homepage simple (more as a jumping point to further information).

An initial homepage mockup

The top navigation bar stayed similar to its existing version. I did away with the previous left sidebar of resources, choosing a homepage template with a sliding header to showcase current events and programs. Each background graphic would include people from our events. I placed the 4 driving goals immediately below (embodied by visuals for a reader to more quickly process). This would a) communicate the goals of StartupHoyas and b) add credibility & a sense of establishment to the user’s first impression of the website.

The purpose of the subscribe button was two-fold: research showed that users were more likely to subscribe after seeing it (a business goal), and it served as a content divider.

Articles came up next to instill a feeling of connectivity—for users to see active other users and find helpful tips. Categories were displayed to help differentiate between news and blog articles. The next event countdown contributed to a sense of urgency and a call to action. The footer acted as an anchor of information.

Style guide as a visual standard

Content Strategy

Content was crafted to deliver straightforward messages with a positive tone, packed with implicit calls to action.

Action verbs (find, connect) & concrete results (mentor, today)

Typography

Oswald was chosen for page titles and nav bar heading, as a skinny typeface was needed to fit in all the words in the nav bar and for potentially long page and article titles. Caps maintained a tone of authority. Montserrat was chosen for header (bold) and body text, as the rounder body of the type maintained a friendly mood. Sans serif fonts kept the vibes “modern, direct, and clean.” Both were Google fonts to ensure compatibility across platforms.

Now what?

We relaunched just as I left to study abroad in Copenhagen, but next steps include constantly iterating based on feedback we receive from users.

While I’m happy we vastly improved on the old ghost of our website, I feel like we’re back at the beginning again. But that’s the whole point, right? Continuous improvement and innovation: what entrepreneurship itself thrives on.

Additionally, I would consult more with the other members of the team to glean more input and perspective on the different elements (a lot for one person to adequately address). I’d work on decoding designer-speak and justifying design decisions clearly and simply. Next time, I’m also bringing coworking fuel (aka hearty morning fats aka doughnuts) more often to Saturday morning weekly sprint meetings. A team that eats well together, works well together — am I right?

This was fun, especially since it was my first ever exposure to a project that incorporated so much: design, strategy, back-end, multidisciplinary collaboration, etc. I learned that intentionality is everything. That creation is one thing and strategy another and yet they’re inextricably intertwined. That from the big picture to the details, it’s all part of a greater system.

Update: The website overhaul resulted in a 32% increase in user engagement over 2 months and a 3x increase in event and competition participation. The site reaches 2.5K users and ~7K pageviews/month.