Project Title: Global Corporate Platform – Diageo Role: Frontend Engineer

Project Title: Global Corporate Platform – Diageo Role: Frontend Engineer | Team: IDX (Investis D...Project Title: Global Corporate Platform – Diageo Role: Frontend Engineer | Team: IDX (Investis D...

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

Jainil Panchal

• 9h

Project Title: Global Corporate Platform – Diageo Role: Frontend Engineer | Team: IDX (Investis Digital) Live Link: https://www.diageo.com/ 🚀 Project Overview

Collaborated as a core member of the IDX (Investis Digital) engineering team to transform high-fidelity Figma wireframes and designs into a fully functional, global corporate platform for Diageo. My role focused on the "design-to-digital" pipeline, ensuring that the visual vision was translated into a high-performance, Sitecore-integrated reality. 🛠 Technical Stack & Tools

Design-to-Code: Figma (Asset Extraction & UI Specs)

Systems Architecture: Storybook (Component-Driven Development)

CMS Integration: Sitecore Experience Platform

Frontend Core: HTML5, CSS3 (SCSS), Modern JavaScript (ES6+)

Libraries: Bootstrap, GSAP (GreenSock) for interactive animations

Compliance: WCAG 2.1 Level AA Accessibility 🛠 My Key Contributions within the Team

Figma-to-Digital Implementation: Led the technical translation of complex Figma designs and wireframes into responsive, pixel-perfect frontend code, ensuring brand consistency across all breakpoints.

Component Development (Storybook): Built and documented modular UI components in Storybook, creating a "living" design system that served as the bridge between the design team and Sitecore developers.

Sitecore Integration: Collaborated with the engineering team to build "Sitecore-ready" modules, ensuring that the high-fidelity designs remained intact when managed by content editors.

Interactive Features: Implemented specific high-end interactions using GSAP, including scroll-triggered animations for the "Spirit of Progress" ESG sections.

Accessibility Standards: Ensured all UI components met WCAG 2.1 AA standards, focusing on inclusive design and screen reader compatibility. 📈 Team Achievement

Successfully launched a multi-region corporate platform that perfectly mirrors the original Figma design intent.

Contributed to a modular, scalable codebase that enabled the agency to manage global content updates efficiently for the client.