McChillin

Case Study

DCVC

DCVC is a venture capital firm focused on backing brilliant entrepreneurs who address the hardest, highest-stakes problems in the world.

View Website
└──
A tour of the homepage

The Project

DCVC partnered with One Design to design and build a publishing platform, which would clearly position them as leaders in the deep tech venture capital space. They had gone to another agency and were disappointed with the work they produced. As such, we were tasked with course correcting and building them a platform that allows them to publish a wide variety of content about any of their companies.

My Role

As the design engineer and lead developer, I worked closely with a content strategist, project manager, designers, and developers throughout the course of the project.

  • Led a workshop to identify DCVC’s publishing and content needs

  • Worked with a content strategist to wireframe the website and architect an editorial taxonomy that would boost SEO and surface relevant content

  • Collaborated with other designers during art direction and throughout the development process to ensure brand consistency

  • Created an extensive design system that included typography, cards, quotes, buttons, tags, stats, and more — all with subtle elements of animation and interaction

  • Built a flexible editorial platform using Craft CMS, where users can tag articles and easily surface relevant content

  • Built a filtering mechanism to allow users to filter by different verticals to see the many companies that DCVC invests in

  • Collaborated with other developers and devops specialists to build out the publishing workflow to ensure the site has no backend dependencies

The about page showcases the art direction we landed on — a nod to swiss design with a modern, technical twist
└──
The about page showcases the art direction we landed on — a nod to swiss design with a modern, technical twist
This page showcases the 200+ companies DCVC has invested in
└──
This page showcases the 200+ companies DCVC has invested in
Articles allow for multiple authors, multiple vectors of categorization, and any amount of rich content
└──
Articles allow for multiple authors, multiple vectors of categorization, and any amount of rich content

The Design System

I created a design system to ensure consistency, improve development velocity, and true-up the art direction. The system included tokens for color, typography, spacing, and motion. On this site, I used fluid typography & fluid spacing to make the design feel more immersive and responsive. It also greatly reduced the need for variations around different breakpoints.

We knew that highlighting text was a big part of their brand, so I experimented to make sure we could animate it in a flexible way. During our art direction exploration phase, we got very particular about making sure we could keep 1px gap between lines, all while using fluid typography. These small front-end experiments were pivotal in ensuring our design system could support the art directions we presented.

└──
I used Vue to provide a filtering mechanism for users on the Companies page. The filter is accessible by keyboard as well to comply with AA accessibility standards.

The Outcome

The new website enabled the DCVC team to easily publish new content. Since launch, they’ve written over 200 articles on the system. They’ve also expanded their brand assets by using the design system I created outside of the web, on printed materials, emails, and various marketing assets.