Design System

Org: Kwalee

Kwalee's internal design system powers many projects from game developer onboarding platform to Kwalee's very new main website (not out yet).

UI Design System

Role:
Creator

Highlights

  • Laid the foundations with a monorepo(turborepo) consisting packages like react components, centralized tailwind-config, linter(biome) configs etc.
  • Integrated this system in two projects enhancing developer efficiency and reducing designer/developer workload by 60-70%.
  • Wrote dev scripts to propagate local changes over all host apps from local dependencies using chokidar and concurrently.

Technologies

  • TypeScript
  • React
  • Storybook
  • Tailwind CSS
  • AWS Amplify
  • Turborepo

Infrastructure

Role:
Maintainer

Highlights

  • Implemented build scripts in Node.js for automatic react component generation for SVGs from hundreds of SVG files.
  • Established automated deployment and npm release using AWS Amplify and Bitbucket pipelines

Technologies

  • TypeScript
  • React
  • Storybook
  • Tailwind CSS
  • AWS Amplify
  • Turborepo

Documentation

Role:
Author

Highlights

  • Documented the technical design and usage guidelines for the design system as well for ease of integration with future applications.
  • Developed storybook app for easy component navigation and documentations.

Technologies

  • TypeScript
  • React
  • Storybook
  • Tailwind CSS
  • AWS Amplify
  • Turborepo
Thanks for visiting!