Zurich North America
Roles
Take ownership of the Zurich Design System, overseeing its continuous refinement to maintain consistency, scalability, and alignment with business and user needs.
Zurich Design System
Prototypes
Create high-fidelity, interactive prototypes that bridge the gap between design and development, streamlining workflows and enabling iterative improvements.
Develop dynamic, responsive, and visually engaging web pages using advanced front-end technologies, including HTML, CSS, and JavaScript, while adhering to industry best practices.
UI Development
Zurich Design System
How we build up webpages
Zurich North America operates multiple web portals for various customer segments. My role is to maintain these portals and ensure a consistent look and feel across them.
Assets
Hamburger menu icon
We design individual assets that will be part of a components
Components
Header
We create reusable design components based of design assets
Page
MyZNA Home Page
we build webpages with a consistent look & feel.
Prototypes
I work closely with Product Owners and Business Analysts to craft exceptional digital customer experiences. My key responsibility is to design seamless, user-friendly experiences across various devices.
Our standard framework is a 12-column layout, structured around four adaptive viewports recommended by the Salesforce Design System. These breakpoints are fully customizable, allowing us to tailor the experience further by adding additional breakpoints as needed.
Responsive Design
We craft customer experiences through a continuous iteration process, ensuring seamless navigation through the complexities of the insurance system and making it more intuitive and user-friendly.
Digital Experience Design
Figma Links
UI Development
As a User Interface Developer in an agile team, I design interactive components and refine digital experiences to ensure usability and consistency. My role involves collaborating with designers and developers to create seamless interactions while maintaining a cohesive visual language. A key focus is addressing accessibility issues across entire portals, ensuring compliance with WCAG standards for an inclusive user experience. By optimizing design systems and enhancing user interactions, I contribute to creating intuitive, efficient, and accessible digital solutions. My work blends creativity and problem-solving to improve usability and ensure a seamless experience for all users.
How we style components
Accessibilities
We leverage the Siteimprove Chrome extension to meticulously identify accessibility issues across web pages. Each issue is documented in a structured spreadsheet, complete with captured screenshots for clarity. We then address and resolve these A11y concerns directly within VS Code, ensuring compliance with accessibility standards and delivering an inclusive digital experience.
Master Builders Risk (MBR 360)
Zurich Insurance’s comprehensive insurance solution is designed specifically for large and complex construction projects. It covers a wide range of risks that may arise during the construction phase, ensuring protection for builders, project owners, contractors, and other stakeholders involved.
Key Challenges in the Existing System
The key stakeholders — underwriters, brokers, insured companies, and agents (ASA) — currently rely on multiple disconnected tools (Outlook, Cobra, comments on Word or PDF files) to communicate throughout the claims process. This fragmented system often leads to delays, miscommunication, and unnecessary waiting times during the workflow.
Design question
How to develop a unified policy management system that enables all key stakeholders to communicate in real time while maintaining access to the most up-to-date information?
BRANISTORMING
Key Take Aways
Identified required and optional features
Prioritized features and organized them into phased implementation
MBR Blueprint
Based on the brainstorming session, we created an MBR blueprint that outlines the roadmap, timeline, feature prioritization, and stakeholder perspectives.
Mockups
The MVP version is targeted for completion by the end of this year.
Utilize reusable components to ensure design consistency and development efficiency.
Focus on rapid iterations to accelerate progress and validation.
Maintain visual and functional consistency with other Zurich portals (MyZNA, MyZBC, Navigator).
Ensure all designed components comply with accessibility standards.