Skip to main contentSkip to footer
    National Dental Association logoNational Dental Association

    Rebuilding the NDA Ecosystem with AI-Powered Member Platform

    From WordPress to Webflow and launching an AI-powered member platform with advanced interactive features including the 100 Day Presidential Plan Tracker and animated US practice maps.

    Project Start: 2024 — Ongoing
    2+ Years
    Project Duration
    Member Portal
    Platform Type
    5+
    Interactive Features
    Nationwide
    US Coverage

    Context

    In 2024, Frenchy began working with the National Dental Association to modernize their digital presence and expand what "membership" can look like online. The work built directly on the success and learnings from the SNDA platform, then pushed further with more advanced NDA member experiences and leadership storytelling features, including the 100 Day Presidential Plan Tracker on the NDA Our President page.

    This engagement blends a public website rebuild, a member-only platform, billing and data integrations, and an experience layer that feels modern and alive through animation, interactive maps, and product-style iteration.

    NDA 2025-2026 Membership Drive Campaign Graphics

    2025-2026 Membership Drive Campaign

    NDA Dental Clinic Community Service

    Community dental care in action

    NDA Presidential Gala Event

    Highlights from the National Dental Association's annual gala celebration

    What NDA Needed

    The organization needed a stronger foundation for three audiences at once.

    Public Visitors

    Clarity on mission, programs, events, and leadership

    Members

    Secure portal with personalized tools and resources

    Communities

    Finding dental practices and local societies across the US

    At the same time, the legacy setup required a clean ownership transition, secure access control, and a path away from fragile, plugin-heavy workflows.

    Outcomes We Aimed For

    Modern UX and design system that improves trust and conversion
    Scalable CMS that makes publishing easy and consistent
    SEO-first structure supporting discoverability and growth
    Member-only platform that feels like a product, not a page library
    Billing and membership state tied to reliable payment infrastructure
    Connected community and discoverable directory experience
    Advanced interactive storytelling for leadership initiatives

    Stack and Collaboration

    Communication

    SlackEmail

    Design & Feedback

    FigmaMarkup.io

    Website & CMS

    Webflow

    Member Platform

    LovableClaude CodeGitHubSupabaseResend

    Community & Billing

    DiscourseStripeInternal APIs

    Project Phases

    A 12-phase approach from secure transition to ongoing optimization

    0

    Secure Off-Boarding and Ownership Transfer

    Before rebuilding anything, we ran an off-boarding process with the prior agency aligned with HIPAA-style software development standards.

    Documented every platform and access point including websites, domains, CMS, billing, and third-party tools
    Transferred admin-level ownership to ensure Frenchy could operate without blockers
    Rotated credentials and secured delivery of access details
    Backed up WordPress files, databases, and media before changes
    Updated internal documentation and created a transition plan with responsibilities and timelines
    Verified access end-to-end and revoked old admin access
    Completed a security audit to confirm no unauthorized access remained

    Result

    A clean, secure baseline that reduced risk before the WordPress to Webflow rebuild began.

    1

    Discovery and Alignment

    We started with an onboarding process that captured goals, constraints, and what success looks like across public visitors and members.

    Stakeholder discovery sessions to define priorities, must-haves, and constraints
    Content inventory of the legacy site and identification of SEO priority pages
    User journey mapping for discovery, joining, renewals, resource access, and directory usage
    Technical mapping of integration touchpoints and data consistency requirements

    Deliverables

    • Project brief and success criteria
    • Sitemap draft for the new Webflow build
    • Legacy URL inventory for redirect planning
    • Member platform requirements outline
    2

    SEO-First Information Architecture and GEO Readiness

    We treated SEO structure as a primary build requirement so the redesign supports discoverability, not just aesthetics.

    Designed a keyword-aligned sitemap and page hierarchy
    Planned pillar pages and supporting pages to build topical authority
    Standardized URL conventions for clarity and crawlability
    Defined internal linking patterns that support both users and search engines
    Structured templates to support location-aware content when needed
    3

    Wireframing and UX Planning in Figma

    We wireframed the public site and the member platform experience to lock structure before visual design.

    Wireframed core templates: home, programs, membership, resources, events, leadership
    Designed navigation connecting public pages to member value paths
    Prototyped key flows so stakeholders reviewed behavior, not just layout
    Captured decisions in a structured log to prevent rework

    Deliverables

    • Wireframes and clickable prototypes
    • Information hierarchy decisions for each template type
    4

    Visual Design System and Iteration

    We designed a component system first, then applied it to the most important pages for long-term iteration.

    Built a design system for typography, spacing, buttons, cards, form patterns, navigation, and content modules
    Designed responsive behavior intentionally for consistent cross-device experience
    Used structured iteration rounds to incorporate feedback while keeping scope controlled

    Deliverables

    • Validated UI system ready for Webflow implementation
    • Component inventory mapped directly to build blocks
    5

    WordPress to Webflow Rebuild

    The outdated WordPress environment was replaced with a Webflow CMS foundation that is faster to maintain and easier to scale.

    Audited WordPress environment to identify content priorities and consolidation needs
    Rebuilt key templates in Webflow using reusable components
    Created CMS collections and templates for safe content publishing
    Optimized assets and page structure for performance
    Mapped legacy WordPress URLs to Webflow destinations
    Implemented 301 redirects to preserve rankings and backlinks
    Validated internal links across navigation, CMS templates, and contextual content

    Result

    A modern public website foundation supporting ongoing growth, including leadership content like the Our President page.

    6

    Live Staging Feedback with Markup.io

    Once the Webflow staging site was ready, feedback moved onto the real interface instead of static screenshots.

    Stakeholders commented directly on the live page where changes were needed
    Feedback grouped by UX, content, SEO, and visual polish
    Revisions executed in controlled cycles for clean approvals

    Result

    Faster decisions and less ambiguity during build and refinement.

    7

    Member-Only Platform Build

    The NDA member experience required more than gated pages—it required a platform.

    Lovable accelerated initial scaffolding of member portal screens and interaction patterns
    Claude Code accelerated custom coding and finishing work across routes, components, and form logic
    GitHub repositories ensured clean version control, code review, and reliable releases
    Supabase provided a strong base for data and authentication
    Resend supported transactional emails: verification, onboarding, and system notifications
    8

    Advanced Leadership Feature: 100 Day Presidential Plan Tracker

    A standout public-facing product-style feature on the Our President page.

    Presents objectives and progress in a structured, transparent way
    Breaks initiatives into phases across the first 100 days
    Creates an interactive accountability layer that is easy to understand
    Rapid iteration on UI states and layout logic with AI assistance
    Shorter build-test-adjust cycles while maintaining design system consistency
    9

    Animated Maps Connecting Practices Across the United States

    Directory experience enhanced by interactive mapping for member practices and districts.

    Map-driven exploration of member practices and districts
    Filtering and discovery patterns that feel modern and fast
    Animation used intentionally to make navigation clear and engaging
    Lovable helped scaffold interactive surfaces quickly
    Claude Code supported targeted refactors and interaction improvements
    10

    Billing, Integrations, and Community

    NDA's ecosystem includes billing and data workflows across systems.

    Stripe-based billing flows tied to membership state
    API-connected logic for consistent status and user experience
    Discourse community forum integration for ongoing engagement
    11

    Testing, QA, and Launch Operations

    We treated QA as a continuous practice and also ran formal test cycles for major releases.

    Responsive behavior across devices
    Cross-browser compatibility
    Performance and asset optimization
    Member access edge cases and authentication behavior
    Billing lifecycle flows and expected states
    Email delivery flows
    Redirect behavior and internal link integrity
    GoDaddy domain management with controlled cutover planning
    12

    Ongoing Program Since 2024

    The NDA website and member platform are treated as living products with continuous iteration.

    New pages and SEO expansion through Webflow CMS growth
    Continued portal enhancements and member value features
    Performance improvements and UX refinement
    New leadership and storytelling experiences like the tracker
    Improvements to directory and map experiences as the network evolves
    Featured Interactive Experience

    100 Day Presidential Plan Tracker

    A standout public-facing product-style feature on the Our President page that presents objectives and progress in a structured, transparent way.

    NDA Member Dashboard - AI-powered member platform interface

    Structured Progress

    Objectives presented in a clear, trackable format

    Phased Initiatives

    Breaks down the first 100 days into actionable phases

    Interactive Accountability

    Easy-to-understand progress visualization

    Interactive Directory

    Animated Maps Connecting Practices Across the US

    A directory experience enhanced by interactive mapping, helping connect members and communities to dental practices and local societies nationwide.

    NDA Districts Map - Interactive US map showing dental practice locations

    Map-Driven Exploration

    Visual way to explore member practices and districts across all states

    Modern Filtering

    Fast, intuitive filtering and discovery patterns

    Intentional Animation

    Motion used to make navigation clear and engaging

    AI-Accelerated Build

    Lovable and Claude Code enabled rapid iteration

    Building on SNDA Success

    SNDA proved the value of a modern, community-forward experience and served as a blueprint for what could work at scale.

    How We Applied SNDA Learnings to NDA:

    • A familiar, clean UX model that supports growth and engagement
    • Stronger operational structure for publishing and iteration
    • A more advanced member platform with richer features and a broader audience

    Ready to Transform Your Association's Digital Experience?

    Let's discuss how we can modernize your member platform with AI-powered features, seamless billing integration, and engaging interactive experiences.