Bryon Urbanec — Front-End Developer & Designer

I am a Front-End Engineer with over a decade of experience crafting accessible, performance-driven user interfaces across agency, enterprise, and public sectors. My engineering philosophy centers on semantic HTML, robust CSS/SASS architecture, and strict adherence to WCAG 2.1 and Section 508 accessibility compliance.

While I work extensively within the modern Drupal ecosystem—architecting scalable design systems using Single Directory Components (SDC) and advanced Twig templating—I approach the web through a platform-agnostic lens. I specialize in bridging the gap between high-fidelity UI design and clean, compliant, and component-driven production code. Whether optimization requires tuning server-side rendering layouts or modernizing client-facing interactions, my goal is always to deliver digital experiences that are inclusive, intuitive, and built to scale.

2022 — 2026
Front-End Developer | Aten Design Group
Component Architecture: Architected and delivered scalable Drupal themes using Single Directory Components (SDC) and Twig templating across 10+ client sites, establishing a unified component framework that accelerated team development velocity.

Digital Accessibility: Remediated critical accessibility deficits across 6+ complex web properties, aligning high-profile agency, enterprise, and government client sites with strict Section 508 and WCAG 2.1 compliance standards.

Enterprise Implementations: Spearheaded full-site front-end implementations for prominent institutions, including a comprehensive component-driven rebuild of Stanford University's research administration portal and progressive UX enhancements for the City of Raleigh's municipal platform.

Open-Source Contributions: Championed open-source tooling and reusable code through active code contributions to the Drupal community via the Mercury Editor and Prototype Starterkit projects.

Core Maintenance: Managed core and contrib module lifecycle security updates for 10+ production environments, ensuring ongoing system stability within Agile CI/CD deployment pipelines.
- Drupal 10/11
- WordPress
- Twig
- HTML & SCSS
- JavaScript
- Jquery
- PHP
2018 — 2022
Front-End Developer and Web Designer | RehabCreative
End-to-End Engineering: Led front-end engineering for diverse client website deployments, prioritizing modern, mobile-first responsive design, comprehensive cross-browser compatibility, and rendering performance.

Design Systems: Translated high-fidelity UX/UI design systems into clean, semantic, and thoroughly tested front-end code while managing technical feasibility.

Cross-Functional Collaboration: Collaborated directly with developers and clients to capture technical requirements, align project scope, and deploy scalable features for established web properties.
- Drupal
- Twig
- JavaScript
- SCSS
2013 — 2018
UI/UX Design Strategist, Senior Designer, Front-end Developer | NewMedia
Product Strategy: Led front-end engineering and UI/UX design architecture for responsive web applications within Agile workflows, delivering solutions across PaaS/SaaS, B2B, and B2C sectors.

Prototyping & Development: Architected and maintained Drupal web properties alongside interactive HTML5/CSS3 prototypes, utilizing responsive frameworks (Bootstrap, Foundation) and targeted JavaScript/jQuery to validate design feasibility.
- Drupal
- Design
- UX/UI
- HTML/SCSS
2010 — 2013
Web Designer + Drupal Themer | Variant Studios
Responsive Theming: Designed and engineered responsive Drupal websites for a diverse client portfolio, leveraging semantic HTML5, advanced CSS3/SASS, and jQuery.
- Drupal
- HTML
- CSS3
- Jquery

View full resume

Stanford Do Research
A full site retheme for Stanford's research administration portal used by faculty, staff, and students across the university. I worked with a team on this one, taking the lead on several components — particularly those driving the content sections of the site.
Architecture & Scope: Executed a comprehensive, component-driven full-site retheme for Stanford University’s research administration portal within a cross-functional team.

Technical Execution: Developed modular, reusable template overrides using Twig, SCSS, and JavaScript to bridge the gap between design system fidelity and production code.
- Drupal
- Config
- Twig
- HTML
- SCSS
- JavaScript
- PHP
Raleigh
Raleigh's site serves a large and diverse population, so getting the details right really matters. The work here touched several parts of the public-facing site as well as a couple of internal city platforms.
Architecture & Scope: Implemented progressive UI enhancements and template overrides for a high-traffic municipal government web infrastructure to improve public service discovery.

Technical Execution: Optimized semantic HTML structure and responsive layouts to ensure seamless cross-browser performance and robust mobile optimization.
- Drupal
- Config
- Twig
- HTML
- SCSS
- JavaScript
San Antonio Breast Cancer Symposium
The San Antonio Breast Cancer Symposium is one of the largest breast cancer research conferences in the world. I worked with a team to build out the WordPress site, taking ownership of several components throughout.
Architecture & Scope: Engineered high-fidelity, interactive front-end elements for a high-profile enterprise medical conference web application.

Technical Execution: Developed custom UI interactions and advanced, high-performance web animations using JavaScript and the GSAP library.
- WordPress
- GSAP
- JavaScript
- SASS
- PHP
Twig Card Component - Demo
This project is a standalone Twig and PHP prototyping environment for building Drupal components without a full CMS install. The template naming, namespace structure, and Sass patterns mirror Drupal's own conventions so anything built here drops cleanly into a production theme. Built around a food card UI kit to demonstrate accessible, reusable component architecture with CSS custom properties.
Drupal-compatible from the start: I've structured templates, Twig namespaces, and Sass the same way Drupal expects them, so I'm not translating anything when it's time to ship

Custom Attribute class shim: I wrote a PHP class that replicates Drupal's native attributes object so Twig templates behave the same as they would inside a real Drupal environment

Sass design token system: Colors and typography live as CSS custom properties in their own partials, organized the same way a Drupal theme would consume them

Accessibility fixes baked in: The source UI kit had transparent labels on the star ratings and category tags, which created contrast issues over background images. I've given those elements solid backgrounds so they're actually readable

One component, two layouts: The teaser card handles both vertical and horizontal orientations from a single template using a data flag, no duplicated markup needed

Builds to static for GitHub Pages: Compiled output lives in a docs/ folder so the demo is easy to host and share without standing up a server
- PHP
- JavaScript
- Twig
- SCSS