Rebuilding District 3’s site and design system post-rebrand
How a complete organizational rebrand led to rebuilding Montreal's innovation hub from the ground up - breaking free from vendor lock-in while creating a digital experience that inspires Canadian entrepreneurship.
brand transformation
The Catalyst: A Digital Revolution
"Our digital presence doesn't match our ambition. We're trying to build the future of Canadian innovation on a 10-year-old website that we can't even update."
- A sentiment echoed across the District 3 team
This project was born from a fundamental disconnect. District 3 had just completed a massive rebrand, redefining itself as a bold, ambitious innovation ecosystem. Yet, its digital front door was a decade-old WordPress site - a relic built by an external agency, tangled in proprietary plugins and impossible to update without a support ticket.
The vendor lock-in was a constant source of frustration, but the bigger problem was strategic. How could D3 inspire the next generation of entrepreneurs when its own technology was stuck in the past? The new brand was ready to fly, but the old website was an anchor. It was time for a revolution, not just a redesign.
before and after
The Journey: 12 Months of Transformation
Brand Transformation
Months 1-3District 3 completed a massive organizational rebrand, redefining itself from a simple incubator to a comprehensive innovation ecosystem. Paul Geiben developed the new brand identity with four key personality axes.
Research & Planning
Months 4-7Extensive user journey mapping, audience research, and technical architecture planning. We identified the vendor lock-in problems with the old WordPress site and designed integration strategies for D3's operational stack.
Design Development
Months 6-8Paul and I collaborated on translating the bold brand vision into feasible web layouts.
Development Phase
Months 8-12Built the site on Webflow with Client First framework, implemented the Podio-Zapier-Webflow automation pipeline, and created the dynamic portfolio system for 1200+ startups.
Launch & Iteration
December 2024 - PresentLaunched at D3's 10-year anniversary event. Continued refinement based on user feedback, performance optimization, and feature additions as the organization evolves.
The Design-Development Partnership
This project's success hinged on the tight collaboration between design and development. Paul's vision was ambitious and brand-driven; my role was to make it technically feasible without compromising its integrity.
The SVG Typography Solution
Paul's design featured massive, "brash and busy" typography that was central to the new brand. Using standard web fonts for these hero elements would have been a disaster - creating inconsistent sizing, unpredictable line breaks, and a responsive nightmare.
The solution was to treat the typography as art. I converted each headline into a lightweight SVG, giving us perfect visual fidelity and responsive scaling across all devices. It was a technical solution driven entirely by a design need.
svg typography system
Complex Layouts at Scale
The design also called for full-bleed layouts with very little horizontal padding (Except on ultrawide screens), with an entirely different design for mobile and desktop, meaning every section had have two versions. To solve this without building every page from scratch, I developed a system of flexible parent components with children mobile and desktop variants, that could adapt to Paul's vision while remaining maintainable.
component diagram
component comparison
An Architecture of Liberation
The core technical goal was to break free from vendor lock-in and build a site that integrated with D3's "Zapier-glued" operational stack. This meant choosing tools that were flexible, powerful, and maintainable by future teams.
Platform Choice: Webflow + Client First
I chose Webflow for its powerful CMS, visual development interface, and seamless integration capabilities. It was the perfect fit for D3's philosophy. By building on top of the Client-First naming convention, we ensured the project would be scalable and easy for future team members to understand and extend, even without deep coding knowledge.
The 1200+ Startup Portfolio Challenge
For the first time, D3 needed an online, public-facing portfolio of its 1200+ startups. Manually managing this would be impossible. I designed and built a full data pipeline to automate the process from end to end.
automation architecture
The Automation Flow
- Trigger: A startup completes a key program, and their status is updated in our Podio CRM.
- Request: An automation creates an "Information Request" and emails the startup a custom form to collect public-facing data.
- Submission: When the form is submitted, the data is linked back to the startup's profile in a "Website Database" workspace in Podio.
- Quality Control: The marketing team gets a notification to review the submitted content for quality and brand alignment.
- Publication: With one click on a "Publish to Site" button, the marketing team triggers a Zapier workflow that instantly sends the approved data to the Webflow CMS, publishing the startup's profile live.
A Site to Create Entrepreneurs
Our mission was bigger than just serving existing entrepreneurs; it was about inspiring a new generation. Canada suffers from "brain drain" to the US, and D3's goal is to build a culture that can compete globally. The website is a key tool in that fight.
We conducted extensive user journey mapping for our three key audiences-startups, investors, and the general public. The information architecture was designed to guide each of them through a tailored journey, but the underlying goal was the same: to convey the energy, ambition, and possibility of the entrepreneurial path. Content that inspires a student to start a company also serves as a proof point for a potential investor.
Launch & Impact
The new site launched at D3's 10-year anniversary event in December 2024, marking both a celebration of the past and a declaration of future ambitions. The response exceeded expectations across all metrics.
Measurable Improvements
anniversary launch
Reflection: Brand-First Development
This project demonstrated how brand transformation can drive technical innovation. Rather than treating the website as a separate digital presence, we integrated it deeply with D3's operational systems and cultural mission.
The collaboration between Paul and me proved that design-development partnerships can achieve solutions neither discipline could reach alone. Technical constraints shaped design decisions while brand vision pushed technical boundaries.
Most importantly, understanding D3's broader mission - inspiring Canadian entrepreneurship to compete globally - influenced every UX decision. The site needed to create entrepreneurs, not just serve them. This mission alignment guided everything from information architecture to automation workflows.
