Skip Nav

Revolutionizing Berxi.com with a Tailored Design System

Company website

Visit https://www.berxi.com

Project Overview at Berxi.com

As the principal design engineer at Berxi.com, part of Berkshire Hathaway Specialty Insurance, I spearheaded the transformation of the website and insurance application interface by developing a bespoke design system. This initiative was centered around elevating usability, accessibility, and brand unity, catering to the multifaceted needs of our users, the business, and our development team.

Design and Development Contributions

Balancing Stakeholder Needs

  • Challenge: The primary challenge was devising a design system that aligned with user expectations, supported business growth, and facilitated developer adoption.
  • Solution: Utilizing Tailwind CSS and Vue.js, I engineered a design system that underscored flexibility, scalability, and accessibility, ensuring adaptability for future growth and ease of integration for developers.

Tech Stack Optimization

  • Challenge: Choosing a technology stack that would boost developer productivity while meeting project objectives was essential.
  • Solution: After a comprehensive assessment, I selected technologies known for their user-friendliness, extensive documentation, and enhancement of developer experience, thereby nurturing an environment ripe for innovation.

Interdepartmental Collaboration

  • Challenge: Achieving a unified user experience that seamlessly integrates marketing initiatives and backend functionalities.
  • Solution: I facilitated close collaboration between the design, UX, and marketing teams to ensure brand consistency, working alongside backend developers to ensure smooth implementation of the design system.

Enhanced User Data Insights

  • Challenge: Implementing user data tracking without compromising performance or functionality.
  • Solution: In partnership with the UX, product, and marketing teams, I established a tracking framework that delivered insightful data for ongoing refinement, all without detracting from site performance.

Content and Marketing Empowerment

  • Challenge: Empowering content and marketing teams to manage campaigns and content effectively without over-reliance on the engineering team.
  • Solution: I implemented solutions that granted these teams autonomy in content management and marketing campaign tracking, significantly enhancing their operational efficiency.

UI Component Library Development

  • Challenge: Maintaining UI consistency across the platform while pushing forward web accessibility goals.
  • Solution: I created a UI component library that standardized design elements, bolstering developer confidence and accelerating the development workflow.

Impact

The creation of a comprehensive, user-focused design system for Berxi.com has profoundly reshaped the company's approach to digital product development. By putting accessibility at the forefront, improving the developer experience, and encouraging cross-team collaboration, we've laid a robust foundation for ongoing innovation and excellence. This strategy not only streamlined our internal workflows but also significantly enhanced the user experience, positioning Berxi.com as a forward-thinking leader in the digital space.

Relevant Tools & Technologies

  • Adobe CS

  • Contentful CMS

  • Figma

  • Git/Github

  • Google Tag Manager

  • Heap Analytics

  • HotJar

  • Jira

  • Segment Tracking

  • Tailwind CSS

  • Various Social Media Tracking Services

  • Vue/Nuxt.js