Democratic National Convention
The first-ever virtual convention
With the eyes of the country on Milwaukee, we created a visual identity and interactive website that leaned into the unique advantages of a virtual convention and launched the Democratic Party’s ticket to electoral success.
My role as designer included information architecture sitemaps, building and ideating wireframes, website design, and accessibility design.
Democratic National Convention
Agency
Wide Eye Creative
Zero Studios
My Role
IA, UX/UI Design, Prototyping
Awards
Webby Award Honoree
Fast Company Innovation in Design
The Brief
Leading up to a momentous election, the DNC Convention in Milwaukee was a key moment on the path to electoral success. Our goals for our website redesign were as follows:
Create a digital home for an unexpectedly virtual convention
Support virtual viewership of the convention programming
Design digital toolkits to increase engagement with the convention
Feature resources for delegates and virtual attendees
Achieve WCAG AA 2.1 compliance for web accessibility
Challenge
When we began this project the convention was going to be in person, the COVID-19 pandemic was hardly a blip in the news yet, and we were strategizing for a very different website. Our team pivoted, stayed inventive, and ultimately designed a site that would be as flexible as the times called for.
The virtual nature of the convention gave us the opportunity to fuse web accessibility with the now accessible-to-all nature of the virtual convention. The four-day national event needed a website that would support:
A live feed of all four days of programming
Hosting to accommodate anticipated spikes in traffic
High levels of security
The highest levels of accessible design to support the wide range of audiences who would be using the site to participate in the event
Phases
Phase 1 focused on brand design in partnership with Zero Studios and the design of the homepage.
Phase 2 focused on the interactive schedule, live streams, and additional support templates.
Phase 3 included additional features such as digital toolkits and a profile generator tool to round out the digital home for the convention.
The Event Schedule
This part of the website was a particularly important piece of the puzzle because a virtual event only works if people know when the event is. We wanted to be sure that people could quickly and easily find programming and add it to their calendars in their respective time zones. Through ideation, research of common calendar layouts, and dozens of wireframes we landed on a layout that leaned into accessibility, flexibility, and share-ability.
Achieving Accessibility
Based on research, we knew that more than 25% of all eligible voters are people with disabilities. A guiding goal of this project was accessibility and removing barriers to participation in the virtual convention. The website was designed with a commitment to the Web Content Accessibility Guidelines (WCAG 2.1 AA), which are focused on high usability for everyone.
Our team partnered with Beyond Vision, a Milwaukee-based firm, to run accessibility user testing on the site. With their partnership, we ensured that the site was grounded in WCAG 2.1 AA standards. Using a custom-designed and custom-built accessibility toggle, website users were able to toggle between color contrasts and increased text size. They were also able to opt-in for CART Live caption and audio descriptions of live streams, and use assistive technology on the site.
Interactive Engagement
To translate the excitement of an in-person convention to a virtual one, we designed and built a profile photo generator with a series of custom-branded backgrounds.
This toolkit was used by delegates, political leaders, attendees, and influencers creating hundreds of thousands of impressions across social platforms.
Impact
National Viewership
The website had 3.3 million unique visitors, over 8 million page views during the convention week, and gracefully handled the large spikes in traffic.
WCAG 2.1 AA Accessibility
The website was also awarded a WCAG 2.1 Level AA badge of approval by Beyond Vision after extensive accessibility user testing.
Award Winning
Our team was incredibly proud to earn a Webby Award and a Fast Company Innovation in Design Award for the 2020 DNC Convention website and branding.
Next Steps
Audience Feedback
Because of time constraints, we had to work quickly to pivot to support a virtual convention. In hindsight, it would have been helpful to connect with users after their virtual convention experience.
Future Hybrid Conventions
To continue offering accessibility to all audiences, how might future conventions be available online and in person? How might we need to change the website to support that?
Up Next