HBCUs Outside

Client: HBCUs Outside is a nonprofit connecting HBCU students, alumni, and supporters to outdoor activities and community events

What they needed: The original site didn’t reflect their brand and made it hard for people to understand who they were, find events, or get involved. The navigation was confusing and event registration was fragmented with no unified flow.

What I did: Lead Designer & Developer — interaction design, UX/UI, and frontend. Mapped user journeys for students, alumni, and supporters. Explored two creative directions (clean/minimal vs. outdoorsy/scrapbook-inspired) through weekly workshops with their main stakeholders, landed on the scrapbook direction with layered textures and rich imagery. Built the site with Shopify integration, so when they’re ready to sell merch they can surface product pages, a cart, and collection pages, and hide that part of the site entirely when they’re not. Built a modular CMS letting the client build new pages independently. Redesigned the mobile menu after usability testing showed the original was too bare, adding optional submenus and clearer CTAs.

Stack: Figma, Next.js, TypeScript, Tailwind, Sanity CMS, Shopify API

Process: Started with user journey mapping across each audience, then two rounds of creative direction testing before committing to the visual style. Built custom components for image optimization, lazy loading, and the site’s “ripped border” visual signature, using server-side rendering and static generation for speed and SEO. Ran continuous audits with Lighthouse and Vercel Analytics through development.

Outcome: Lighthouse scores above 95 at launch. The HBCUs Outside team praised the clarity and flexibility of the new site. The unified event registration flow reduced user confusion, and the modular component system let the client keep building pages without needing a developer.