Sample portfolio · fictional candidate · built by Fieldcraft ← All portfoliosView the CVGet yours
Fatima Al-Rashid

Frontend lead · Design systems · Sydney

Fatima Al-⁠Rashid

Seven years in design systems, component architecture and web performance — including Canva's design-token system, now used by 40 engineers across 6 product squads.

  • 7years in frontend engineering
  • 40engineers on the design-token system
  • 85%fewer UI inconsistencies
  • 92Lighthouse performance score, up from 34

Selected work

Tokens, components and the tests around them

Design-system, accessibility and performance work across Canva, Atlassian and Deputy.

Canva · Design tokens · Style Dictionary

Design-token pipeline

Figma variables flow through Style Dictionary into generated TypeScript and CSS custom properties — replacing 200+ hardcoded style values and cutting UI inconsistencies by 85%.

Adopted by 40 engineers across 6 squads within 3 months

Canva · React · TypeScript · Storybook

Canva component library

Built and maintains a library of 60+ components in React and TypeScript, documented in Storybook.

Chromatic visual regression tests catch UI regressions pre-merge

Canva · Playwright

Visual and accessibility test suite

Introduced a Playwright suite for visual and accessibility testing.

34 accessibility regressions caught in its first quarter

Atlassian · Atlassian Design System

Form and Date Picker packages

Owned the Form and Date Picker component packages in the Atlassian Design System (ADS), used across Jira, Confluence and Trello.

12M weekly impressions

Atlassian · Architecture decision record

Responsive grid system

Defined the ADR for a responsive grid system, adopted by 4 cross-functional teams.

Layout-related bugs down 41% over 2 quarters

Deputy · jQuery to React

Workforce scheduling UI rebuild

Rebuilt the workforce scheduling UI in React from a legacy jQuery codebase.

Load time from 8s to 1.4s; bounce rate down 22%

Case study

Making Canva's editor fast

A four-month web performance initiative she led on the editor's critical path.

Canva · Frontend Lead — Design Systems · 4 months

From a Lighthouse score of 34 to 92

Problem

The critical editor path scored 34 for Lighthouse performance.

Approach

Led a four-month initiative to audit, refactor and lazy-load the critical editor path.

Outcome

Lighthouse performance score up from 34 to 92, and Largest Contentful Paint down 2.8s.

Tech stack

What she builds with

  • React
  • TypeScript
  • Storybook
  • Chromatic
  • Style Dictionary
  • CSS-in-JS (Emotion)
  • Vite
  • Vitest
  • Playwright
  • Lighthouse CI
  • Figma API
  • Node.js

Talks & community

On stage and in the open

  • Talk — “Design Tokens at Scale: From Figma to Production”JSConf AU 2025
  • Talk — “Core Web Vitals That Actually Matter”CSSDay Sydney 2024
  • Maintainer of react-token-provider, an open-source project1.2k GitHub stars
  • Contributor to the WCAG 2.2 working groupAccessibility

A frontend lead specialising in design systems, component architecture and web performance — passionate about accessible, performant UI at scale.

Fatima leads frontend design systems work at Canva in Sydney, where she built the design-token pipeline and maintains the 60+ component library. Before that she was a Senior Frontend Engineer at Atlassian, owning two Atlassian Design System packages, and began at Deputy rebuilding its scheduling UI in React.

She is a Core Web Vitals advocate and a regular speaker at frontend conferences across APAC. At Canva she has mentored three mid-level frontend engineers, one of whom was promoted to senior within 14 months.

  • Based inSydney, Australia
  • CurrentlyCanva
  • FocusDesign systems, web performance
  • Experience7 years
  • EducationBSc, University of Melbourne

Experience

Seven years, three Sydney teams

  1. Mar 2022 — Present

    Frontend Lead — Design Systems

    Canva, Sydney

    Design-token pipeline, a 60+ component library, the editor performance initiative and a Playwright visual and accessibility suite; mentored 3 mid-level frontend engineers.

  2. Aug 2019 — Feb 2022

    Senior Frontend Engineer

    Atlassian, Sydney

    Owned the ADS Form and Date Picker packages; migrated legacy CSS modules to Emotion across 3 product surfaces with zero visual regression, verified by a Chromatic snapshot suite; wrote the responsive grid ADR.

  3. Jan 2018 — Jul 2019

    Frontend Developer

    Deputy, Sydney

    Rebuilt the scheduling UI in React; introduced component-driven development and Storybook, cutting onboarding for new developers from 2 weeks to 4 days.

Education

Training

  1. Feb 2014 — Nov 2017

    BSc Computer Science & Software Engineering

    University of Melbourne

    Honours First Class; Dean's Award for Academic Excellence.

Contact

Building a design system?

fatima.alrashid@email.com

  • +61 412 345 678
  • Sydney, Australia
  • linkedin.com/in/fatimaalrashid
  • github.com/fatima-frontend

Fictional candidate — contact details shown as plain text only.