Sector(s)
Bayer Becker is an interdisciplinary consultancy firm with a focus on civil engineering, transportation engineering, landscape architecture, planning, and land surveying.
Operating since 1968, it has engaged in the delivery of consulting services to the private and public sectors within the US. To maintain its reputation of being innovative and community-centered, the consultancy needed a digital turnaround.
The expansion of the team and services made it a necessity to renew its Digital Experience to more effectively promote its strengths, internal workings, and interaction through improved UX/UI design and SEO.
The Challenge
The previous digital experience was burdened with quite a few challenges that limited its use and growth potential.
- Old UX/UI Design: The site lacked a modern visual identity, confusing the visitors and limiting interaction.
- Complex User Flow: It was difficult to locate important web pages since navigation was confusing.
- Inefficient Editorial Workflow: Updates were too slow, time-consuming, and non-optimized for different stakeholders.
- Poor SEO Performance: The site had poor page speed and performance, impacting its ability to attract talent and clients.
Bayer Becker didn't need a facelift but, instead, an expandable digital experience that would redefine the boundaries of storytelling, increase accessibility, and help the business grow.
Back to topThe Solution
The backbone of this project was the discovery and analysis stage, one that shaped all the design and development choices.
Before any wireframe was sketched, our team conducted deep-dive discovery workshops with Bayer Becker to understand the business needs, user behaviors, and industry context. This helped uncover not only pain points, like poor content discoverability and outdated aesthetics, but also opportunities to elevate the digital experience in ways that aligned with Bayer Becker’s reputation and goals.
These observations directly impacted our UX/UI strategy. The design team conducted competitive market analysis, studied successful digital examples, and worked closely with Bayer Becker's stakeholders to reach a consensus on two likely design directions. Both directions are given high priority:
- Project storytelling through impactful visuals
- Streamlined navigation and service availability
- Frictionless lead generation through clear CTAs
The Approach
The implementation of the design was founded on an atomic design system, which allowed every component to be reusable, consistent, and centrally maintained. Strategic organization simplified visual coherence throughout the site and facilitated design scalability in anticipation of future growth.
When the design direction was signed off, the transition to development was seamless. The developers were provided atomic-based components to be converted into Storybook libraries and synchronized with designers via real-time feedback and review loops.
The website was purposefully built on Drupal for long-term performance and editorial agility.
Highlights included:
- Custom UX/UI Design: Built from scratch with user-centric design and brand-forward user interface.
- Responsive Architecture: Optimizing the best experience on devices and screen sizes.
- SEO Optimization: Enhanced with schema-rich metadata, alt text, and lightning-fast page loads.
- Streamlined Workflows: Editor-centric CMS experience with scheduling, permission control, and fewer publishing paths.
At Vardot, we always choose Drupal for its scalability, security, and advanced content management capabilities. It's ideal for dynamic publishing needs. With robust user permissions and integration support, Drupal provided the flexibility needed to future-proof the site.
Technical Specifications
Drupal version:
