Building a Scalable & Modular Website
2023
Project Overview
As Cosm's audience grew, the website needed to evolve into a flexible, scalable platform that could adapt to new content for venue launches. The redesign introduced modular components, responsive layouts, and intuitive navigation, making it easier for users to explore content while maintaining a cohesive and visually engaging brand presence.
As the lead designer, I oversaw the full redesign, from structure and navigation to visual direction and component documentation, ensuring the final system supported both immediate needs and long-term scalability.
My Role
Product Designer
Collaborators
Ethan Paulson, Director of Product Design
Marcus Valverde, Senior Software Engineer
Mike Schiro, Web Product Manager
The goal of this project was to evolve Cosm’s pre-launch site into a fully functional digital hub supporting ticketing, event updates, and content discovery. As the brand’s audience expanded, the site needed to match the venue’s energy while remaining visually engaging and easy to navigate.
By collaborating with stakeholders and developers, we built a scalable, dynamic platform that allowed users to find key information effortlessly while setting the stage for future growth.
Defining Core Design Features
I collaborated with product and marketing teams to identify the website’s core needs, analyzing user behavior, content strategy, and business goals to guide the redesign. Together, we defined three primary objectives:
- Create reusable modules that allowed teams to build new pages independently without relying heavily on developers.
- Align with the new brand system to ensure consistency across all digital touchpoints.
- Redesign navigation to prioritize event discovery and ticket purchasing.
This redesign focused on scalability and autonomy, enabling teams to update content easily, improving SEO visibility, and delivering a more engaging experience for users.
01 Establishing a Modular Design System
To meet the growing needs of multiple teams, we developed a scalable design system that balanced structure with creative flexibility. Instead of designing each page individually, we created a library of reusable components that empowered marketing, content, and product teams to build new pages quickly while keeping visuals consistent.
The system was built around adaptable building blocks including banners, CTAs, content sections, and headers, all designed with responsive breakpoints in mind. This approach ensured a smooth experience across devices while providing the flexibility to support evolving content and business needs.
02 Balancing Modularity with Customization
While modularity improved efficiency, we also prioritized moments of visual distinction to express Cosm’s brand personality. Key sections of the site were custom-designed to create standout experiences that felt immersive and premium.
I combined structured modules with dynamic, content-rich compositions for interactive elements and feature pages. To enhance engagement, I integrated prototyping and motion design into select components, ensuring smooth transitions and a cohesive sense of energy throughout the site.
03 Enhancing Site Navigation for Clear User Journeys
The original navigation emphasized education, but as events became the core focus, a shift was needed. I partnered with the product and design teams to audit the existing site map, uncovering pain points such as dead links, missing pages, and content that could be moved to other platforms.
With a clear understanding of user needs and business goals, I led the redesign of the site’s navigation to better support event-driven interactions. Key updates included:
- Consolidating educational content into a unified section about venues, making space for a more prominent events area.
- Prioritizing ticket purchases with a visually distinct button that drew users directly to events.
- Introducing a profile section so users could access their account details and tickets from their web application.
The redesigned website transformed how users engaged with content and navigated the platform. Streamlined navigation created a clear, intuitive structure that improved event discovery, ticket purchasing, and profile management.
The refined site map and prioritized actions simplified the overall journey, increasing engagement and user satisfaction. Meanwhile, the modular component system enabled scalable page creation, giving teams the flexibility to grow and evolve the site with future needs.
With a strong foundation in place, the next phase focuses on continuous improvement driven by real user feedback:
- User testing and performance tracking to refine the website’s information architecture, navigation, and overall usability.
- Introducing interactive elements to increase engagement across key pages.
- Expanding the design system across additional Cosm platforms to create a unified experience
This project demonstrated how a well-structured design system can drive efficiency, maintain brand integrity, and deliver digital experiences that evolve alongside the company.