The Challenge
Gensler, one of the world's largest architecture and design firms, needed a dependable development partner to bring their creative team's designs to life as fully functional websites. Their clients, New Hudson Facades (facade engineering) and Coyle Graphics (environmental graphics and signage), needed portfolio-driven websites that matched Gensler's designs with exact visual accuracy, provided non-technical editors with flexible tools to manage content, and ran on reliable hosting infrastructure. Each site needed to be built custom from the ground up, with no off-the-shelf templates or page builders that would compromise the design vision.
Our Solution
FatLab serves as Gensler's behind-the-scenes development partner, handling everything from custom website builds to hosting and ongoing support. For each client, we translated Gensler's design files into independent, custom websites with flexible content systems that editors can manage independently. New Hudson Facades now has a project portfolio with powerful search and filtering by project type, location, and engineering approach. Coyle Graphics got a 433-item visual portfolio with an interactive signage configuration tool. Both sites give their editorial teams drag-and-drop page building while maintaining the precise visual standards Gensler's designs demand.
What We Built
- Two custom websites built to match Gensler's design files with complete visual accuracy
- A searchable project portfolio for New Hudson Facades filterable by type, location, and approach
- A 433-item visual portfolio for Coyle Graphics with an interactive signage configurator
- 19 combined flexible page layouts giving editorial teams drag-and-drop page building
- A repeatable white-label process Gensler can rely on for future client projects
- Ongoing hosting, maintenance, and support for both sites
Project Overview
Gensler is a global architecture, design, and planning firm, one of the largest in the world, with offices spanning five continents. FatLab works with Gensler as a white-label development partner, translating their design team's creative vision into fully functional WordPress websites for companies within Gensler's client portfolio.
This case study covers two sites built under that partnership: New Hudson Facades (newhudsonfacades.com), a specialty facade engineering and manufacturing company, and Coyle Graphics (coylegraphics.com), a signage, experiential graphics, and environmental design firm. For both projects, Gensler led the design and account direction. FatLab handled the technical execution - custom theme development, content architecture, flexible page-building systems, hosting infrastructure, and ongoing support.
The engagement demonstrates FatLab's agency partnership model. Take polished, pixel-perfect design deliverables and implement them as custom WordPress themes with no page builders, no reskinned templates, and no compromises between the design and the implementation.
How the Partnership Works
Both sites share FatLab's standard build approach (modular functions.php, ACF Flexible Content as the exclusive page builder, custom post types for structured content, organized SCSS architecture, and Bootstrap for the responsive grid). Each theme was built independently to match its design, resulting in two distinct implementations:
| New Hudson Facades | Coyle Graphics | |
|---|---|---|
| Framework | UnderStrap + Bootstrap 4 | Bootstrap 5 |
| SCSS Files | 39 custom source files | 26 custom + 108 Bootstrap source |
| PHP Include Modules | 27 files | 11 files |
| Flexible Content Layouts | 8 | 11 |
| ACF Fields | 126 across 11 groups | 115 across 7 groups |
| Custom Post Types | 4 | 1 |
| Active Plugins | 21 | 18 |
Both themes disable Gutenberg entirely and rely on ACF Flexible Content for all page building. This was an intentional decision. Gensler's designs demanded precise layout control, and flexible content layouts provided that control without introducing the unpredictability of a block editor.
Technical Implementation
New Hudson Facades
New Hudson Facades is a specialty facade engineering and manufacturing company serving commercial construction projects globally. The site centers on a project portfolio supported by the organizations and people involved:
| Post Type | Published | Purpose |
|---|---|---|
| Project | 22 | Completed facade installations |
| Client | 21 | Organizations NHF has built for |
| Team Member | 8 | Staff directory |
| Architect | 16 | Design partners and collaborating architects |
The Project post type uses three hierarchical taxonomies for multidimensional filtering: project type (curtain wall, panel systems), location, and engineering solution. Combined with FacetWP for AJAX-powered faceted search and Relevanssi for full-text indexing of ACF custom fields, visitors can find projects by type, location, solution, or keyword.
The eight flexible content layouts emphasize large-format imagery and project storytelling: full-screen vertical sliders with video support, image carousel combinations with content, WYSIWYG blocks that auto-layout into columns based on block count, accordion and tabbed content, team member displays via relationship fields, and call-to-action strips. Every layout supports custom CSS classes, anchor IDs, and reduced spacing toggles for precise design control.
The design system uses Adobe Typekit web fonts with a dark navy, terracotta, azure, and coral palette, and 12 custom image sizes ranging from 250px thumbnails to 2000px full-height vertical slides.
Coyle Graphics
Coyle Graphics is a portfolio-driven environmental graphics and signage firm. With 433 portfolio items and 1,012 media assets, the site is image-intensive. Two taxonomies (hierarchical categories and flat tags) organize the work, and the admin interface includes a custom featured image column for visual overview when managing hundreds of items.
The 11 flexible content layouts are built for image-heavy presentation, including masonry-powered portfolio grids with automatic orientation detection (portrait vs. landscape) and responsive sizing, content galleries with large-left and large-right variants, a gallery with vertical thumbnail navigation and mobile slider fallback, mosaic sections with complex mixed-size image grids, and an interactive signage configurator tool with real-time preview.
The portfolio single template displays a thumbnail gallery with navigation and automatically surfaces 4 related items based on the primary category.
The design uses dual font systems combining Adobe Typekit with Google Font fallbacks, and 10 custom image sizes optimized for the various gallery and mosaic layouts.
Shared Architecture
Both themes follow the same modular pattern: a short functions.php loader that requires focused include modules for enqueuing, post types, menus, ACF configuration, shortcodes, accessibility, navigation walkers, and utility functions. Any developer can open either theme, scan the include list, and understand the full feature set.
Both include a custom ARIA navigation walker that outputs proper WAI-ARIA attributes on all dropdown menus, alongside a Bootstrap navigation walker for responsive menu behavior. Semantic HTML5, proper heading hierarchy, and form label associations are built into both themes.
Plugin Stacks
New Hudson Facades (21 plugins):
| Category | Key Plugins | Role |
|---|---|---|
| Content | ACF Pro + 3 add-ons, Classic Editor | 126 fields, 8 flexible content layouts |
| Search | FacetWP, Relevanssi | Faceted project filtering + full-text search with ACF indexing |
| Forms | Gravity Forms | Contact and whitepaper request forms |
| SEO | Yoast SEO with ACF integration | Search optimization with custom field awareness |
| Performance | Breeze, Imagify | Caching + image optimization |
Coyle Graphics (18 plugins):
| Category | Key Plugins | Role |
|---|---|---|
| Content | ACF Pro + 3 add-ons, Classic Editor | 115 fields, 11 flexible content layouts |
| Forms | Gravity Forms | Contact form |
| SEO | Yoast SEO | Search optimization |
| Social | Instagram Feed Pro (Smash Balloon) | Live Instagram integration for visual design firm |
| Performance | Breeze, Imagify | Caching + image optimization |
Security and Infrastructure
Both sites are hosted on FatLab's white-label hosting infrastructure, giving Gensler a single point of contact for development, hosting, and ongoing support. The stack includes Breeze with Varnish page caching, Imagify image optimization with WebP/AVIF conversion, and Cloudflare Enterprise WAF. Both themes use filemtime() timestamps for all enqueued assets to automatically cache-bust on deployment.
| New Hudson Facades | Coyle Graphics | |
|---|---|---|
| Region | East Coast (New York) | Southeast (Miami) |
| CSS Payload | 188 KB (minified) | 176 KB (minified) |
| JS Payload | 103 KB (minified) | 80 KB (minified) |
Results and Impact
These two sites demonstrate FatLab's agency partnership model at its best. Gensler handled the design. FatLab handled everything else - custom theme development, content architecture, flexible page-building systems, hosting infrastructure, and ongoing support. The result is two purpose-built themes, each translating Gensler's design language into clean WordPress architecture that their clients can maintain without ongoing involvement from the design agency. It is a repeatable process. The design firm provides the creative vision, FatLab provides the technical execution, and the client gets a site that performs well and is simple to manage.
Results
- Two pixel-perfect custom themes built from Gensler's design files
- 433 portfolio items managed through custom post type with masonry grid display
- Faceted search across project type, location, and engineering solution taxonomies
- 19 combined flexible content layouts giving editorial teams drag-and-drop page building
- 241 ACF custom fields across both sites ensuring content stays structured and consistent
- Repeatable white-label process that Gensler can rely on for future client projects