UX/UI
Visual Design
Code
Shipped

National Roundtable on the American Dream

Elevating UX/UI and marketing for a public dialogue events platform at AllSides

The Insight newsletter shown on phone mockups

ROLES

UX/UI Design, Web Design, Graphic Design, Product Strategy

DELIVERABLES

UI Mockups, Code Updates, Components, Landing Page, Web Banners, Social Media Creative, Print Flyers, Newspaper Ads, HTML Email Templates

TOOLS

Figma, Claude Code, Mailchimp, HTML/CSS, Drupal, Github

TIME

Jun-Aug 2026

COLLABORATORS

Clare Ashcraft (PM), Evan Wagner (PM), Molly St. Louis (Creative Strategist), Tatiana Bobritsky (QA), Scott McDonald (CTO)

OVERVIEW

As AllSides’ in-house Product Designer, I supported both UX/UI updates  and marketing for the National Roundtable on the American Dream: a civic dialogue event series that recruited civic org partners and participants to firmly establish AllSides Roundtables — a public dialogue events webapp — as a community organizing tool and B2B SaaS product.

Note: AllSides Roundtables is based on a collaboration with Frankly, an open-source public dialogue platform created by Harvard University’s Berkman Klein Center for Internet & Society.

IMPACT

  • Event series secured 27+ civic org partners, including Newsweek and Nationwide Insurance
  • Marketing creative posted by external partners to promote events
  • 1000+ participant signups across 12 event times
  • First major code-shipping project; 12+ pull requests approved and merged into production code for a Flutter app with a video call interface and event signup system

Marketing

Acquiring Partners and Participants

To be successful, the event series needed a large number of participants and partners to help get the word out.

Landing Page

We needed a dedicated promotional web page we could direct partners and participants to. This needed to explain, legitimize, and generate excitement about the event.

After consulting with the marketing team through several iterations, I elevated the final content outline to a live web page.

Designing in Figma and building in Claude Code, I combined existing styles from our Brand Guidelines with a heavy use of video and images — a relatively new visual pattern for interfaces at AllSides, where content had been mostly text-based.

Once launched, the landing page played a key role in the company's efforts to partners, who in turn promoted the page to attract participants.

Marketing Creative Assets

Once we had partner organizations, we needed content for them to promote the event to their audiences. I applied the style of the landing page to create assets as the marketing team requested them, including website banners, email banners, social media image posts, newspaper ads, and more.

Empowering Partner Outreach

Using the landing page and marketing assets, the marketing team secured 27+ partner organizations for the event, many of which used these assets to promote the event to their audiences.

UI Styles

Brand-Aligned App UI

Because the AllSides Roundtables platform was based on a fork of the Berkman Klein Center's Frankly web app, it did not contain AllSides-aligned visual design patterns. My first changes to the webapp resolved this with new colors, fonts, and brand integrations.

Information Architecture

Reconfiguring Page Hierarchy

Because the original Frankly information architecture served a different use case — people potentially interacting with multiple organizations' "Spaces" — it led to dead-ends in user flows for AllSides Roundtables.

My Spaces, Spaces, Communities, and Events

When forking from Frankly, Roundtables inherited a complex information architecture meant to facilitate much more varied activity than our users needed, raising a risk of overwhelming and confusing users in irrelevant page categories. This also created redundancy with our multiple "Roundtable" naming conventions.

I simplified the user-facing information architecture, so all the users could reasonably do was 1) browse event times, 2) read event details, and 3) enter an event.

My intervention involved simplifying an unclear double-home nav into one button, in the style of a "home" button.

Concise Transparency

Assertively Transparent Privacy Awareness

Users are increasingly privacy-conscious, and AllSides wanted to be a privacy-first company. The platform and event surveys collected demographic data and video/audio recordings, so we needed to clearly communicate data privacy information without overwhelming users.

REFLECTIONS

Bridging Across Marketing, Product, & Dev

In this project, I began leveraging Claude Code to work directly with developers — testing product changes locally, pushing PRs, completing dev tickets, and joining daily standup meetings. I had never even heard of Dart before, but I successfully shipped frontend code for a Flutter webapp with 1000+ users. I wasn't yet "technical," per se, but I had entered the semi-technical twilight zone many designers found themselves in as coding agents improved.

This completed a sort of cross-functional trifecta. At this point, I had touched nearly every part of AllSides: news, editorial, marketing, analytics, compliance, design, product, and now development. This aligned me most closely with product managers, even though I was still technically an individual contributor.

This project also involved a lot of external collaboration; for instance, I designed, presented, and implemented attributions for key collaborators across several touchpoints.