Relaunching Cogo Labs

The challenge

Cogo Labs is a startup accelerator that launches, grows and accelerates internet companies. Fostering the next generation of leaders at the forefront of consumer technology is essential to their mission.

However, their flagship site no longer reflected how we talked about the company internally, or with applicants and potential partners. The website was also hard to maintain and update. And, the company was projecting significant growth in the coming year.

I led the effort to redesign the Cogo Labs site and align the company's digital presence to it's current vision.

My role

I was the lead designer for the effort, and owned visual design, content design, interaction design, and research tasks (#smallteam). I created a new style guide for the brand, designed responsive layouts and UI patterns, and supported front-end implementation.

I worked closely with internal stakeholders and web engineers.

Approach

The first step was to align on the goals of the redesign. I audited the current content of the site, reviewed current web metrics, and met with a number of key people at Cogo to understand target markets. I also did a full design review of our current site and of other startup incubators and accelerators.

From this internal research, we defined a set of goals for the redesign:

• Serve job seekers: Large scale hiring was on the horizon and metrics showed significant traffic to job pages, but we observed job seekers often were unsure how accelerators operated.
• Show off the culture: Accelerating the careers of employees was one of Cogo's key values, and it offers early career technologists a lot of freedom to explore and experiment. We wanted the site's style and content to put these values front and center.
• Strengthen design and content hierarchy: The old site had very limited typographic and design hierarchy, with overpowering graphics pulling attention away from key content. I wanted the new design to have a strong typographic and color system that gave structure to the page, in addition to a refreshing look and feel.
• Lean into responsive design: The old site used an ExpressionEngine template that had limited responsive styles, and exacerbated hierarchy and readability concerns on mobile devices. We wanted to create flexible templates that would have an impact on any device.

Supporting front-end implementation

Once we defined key visual elements, we moved on to development. The site was built using Express.js for a web framework, Keystone.js as our CMS, and Jade and Stylus on the front-end to create cohesive, clean styling.

I worked closely with our web engineers to build the CSS theming and define page layouts. I also implemented certain features on the site, like job filtering, to deepen my Javascript skills.