How We Redesigned Our Website
By Y Combinator
Key Concepts
- YC Brand Evolution: Shifting from a utilitarian, B2B-focused website to a storytelling platform emphasizing founder journeys and inspiration.
- Founder-Centric Design: Prioritizing the stories and experiences of YC founders over solely showcasing company logos or YC’s achievements.
- Minimalist Aesthetic: Employing a clean, airy design with reduced distractions to focus on content and impactful visuals.
- Interactive Prototyping: Utilizing tools like Opus 4.5 and live coding to rapidly iterate on designs and explore interactive elements.
- "Formidable" as a Core Value: Reconnecting with Paul Graham’s original vision of YC as supporting exceptional founders.
- AI-Assisted Design: Leveraging AI tools for creative exploration and rapid prototyping.
The Old YC Website: A Design Review
The previous YC website, designed approximately four to five years prior during the “co” era, was described as “utilitarian” and resembling a “B2B SaaS template.” Key issues identified included:
- Lack of Storytelling: The site failed to inspire or convey the unique value proposition of YC beyond basic statements of success.
- Logo-Centric Approach: Emphasis was placed on company logos rather than the founders behind them, diminishing YC’s pivotal role in their journeys.
- Vague Quantifications: Claims of success (“We help founders make something people want”) lacked specific data or illustrative examples. For instance, the success rate improvement wasn’t quantified.
- Negative Framing: The “Founders Interest First” section focused on what YC doesn’t do (take board seats, long decision times) instead of highlighting positive attributes.
- Headline Ineffectiveness: Headlines like “Top YC Companies” were deemed uninformative and lacked impact.
The New YC Website: Design & Messaging
The redesign aimed to address the shortcomings of the previous site by focusing on storytelling, founder empowerment, and a minimalist aesthetic. Key elements include:
- Hero Section & "Formidable": The homepage features a minimal hero section, inspired by Paul Graham’s essays, emphasizing the concept of “formidable” founders. A footnote provides PG’s definition of the term.
- Before & After Founder Showcase: A section visually illustrates the transformation of YC-funded founders, highlighting their humble beginnings and potential for growth. The design aims to make aspiring founders see themselves in these success stories.
- Combined Valuation & Logos: The site displays the combined valuation of all YC-funded companies alongside company logos.
- Original PG Copy: The core description of YC remains unchanged from the original website created over 10 years ago, with minor updates for current program details (funding frequency, location).
- Founder Testimonials: Quotes from recent YC founders are integrated into the design, providing authentic perspectives on the YC experience. These quotes are displayed as continuous text with hover-over functionality revealing founder names and company details.
- Animated Partner Portraits: Pictures of YC partners during their own YC batch experiences are animated using AI (specifically, the tool “one”) to create a playful and relatable visual. Hovering over each partner’s card reveals their batch photo.
- Media Highlights: A section showcases recent YC videos, podcasts, startup news, and Paul Graham’s essays.
- Call to Action: The final call to action encourages early applications, dispelling the misconception that applicants need significant progress before applying.
Design & Development Process
The development process deviated from traditional methods, prioritizing rapid prototyping and interactive exploration:
- Initial Exploration (Figma): The team began with mood boards and initial frame mockups in Figma.
- Live Coding & Opus 4.5 Integration: Recognizing the limitations of static design tools, they transitioned to live coding and utilized Opus 4.5 (an AI tool) for creative exploration.
- Iterative Prototyping: The team focused on building interactive prototypes directly in code, allowing for immediate feedback and refinement.
- AI-Assisted Creativity: Opus 4.5 was used to generate design variations based on specific prompts, accelerating the creative process. For example, prompts like “Display this information creatively” were used to explore different visual approaches.
- Focus on Interactions: The process prioritized the design of meaningful interactions and animations to enhance storytelling and engagement.
Key Arguments & Perspectives
- The Power of Storytelling: The redesign emphasizes the importance of inspiring potential founders through compelling narratives rather than solely focusing on metrics or program features.
- Founder Empowerment: The site aims to position YC as a partner in the founder’s journey, highlighting their achievements and potential.
- Authenticity & Credibility: Utilizing founder testimonials and showcasing the YC partners’ own experiences enhances the site’s authenticity and credibility.
- The Evolving Role of AI in Design: The project demonstrates the potential of AI tools to accelerate the design process, facilitate creative exploration, and enable interactive prototyping.
Notable Quotes
- Ev (YC Designer): “YC is such a truly special brand where we can do so much more in being inspiring and telling a story.”
- Ev: “We wanted to put more emphasis on the founders who built these companies as opposed to just the logo.”
- YC Representative: “We wanted to not sell you a program or sell you a product, but instead make you dream.”
- YC Representative: “It’s never too early to apply to YC. You should not overthink it.”
Technical Terms & Concepts
- Figma: A collaborative web application for interface design.
- Opus 4.5: An AI tool used for code generation and creative exploration.
- Wayback Machine: A digital archive of the World Wide Web.
- B2B SaaS: Business-to-business Software as a Service – a common website template style.
- Hero Section: The primary visual and textual section at the top of a webpage.
Logical Connections
The redesign was a direct response to perceived shortcomings in the previous website. The team identified a need for a more inspiring and founder-centric approach, leading to a minimalist aesthetic and a focus on storytelling. The adoption of AI-assisted design and live prototyping facilitated rapid iteration and the creation of impactful interactive elements. The entire process was guided by a desire to reconnect with the core values of YC, as articulated by Paul Graham.
Data & Research Findings
- The combined valuation of all YC-funded companies is highlighted on the new website, though a specific figure wasn’t explicitly stated in the transcript.
- The redesign was informed by interviews with recent YC founders, whose testimonials are integrated into the site.
Synthesis & Conclusion
The new YC website represents a significant departure from its predecessor, prioritizing storytelling, founder empowerment, and a minimalist aesthetic. The project demonstrates the power of AI-assisted design and iterative prototyping in creating a more engaging and impactful online experience. By focusing on the journeys of YC founders and reconnecting with the core values of the organization, the redesign aims to inspire the next generation of entrepreneurs and solidify YC’s position as a leading startup accelerator. The emphasis on interactions and animations, facilitated by new tools, signals a potential trend in web and product design towards more dynamic and immersive experiences.
Chat with this Video
AI-PoweredHi! I can answer questions about this video "How We Redesigned Our Website". What would you like to know?