Joel Esguerra
Joel Esguerra
Menu

Design Systems

Liquid Design System

Liquid is the design system powering Milk Moovement's product suite — a set of shared tokens, components, and patterns that three React engineering teams use to build consistent, accessible, data-dense interfaces for dairy cooperative operations.

Fondations

The Foundation layer is the lowest level of the Liquid system. It contains all raw and semantic design tokens

Patterns

Patterns are compound UI solutions assembled from Liquid components. They solve recurring problems in the MM product.

Components

All components are built in Figma as published library components with token bindings, variant properties, and Dev Mode descriptions.

Governance

Governance defines how Liquid grows, changes, and stays consistent over time.

Paper – Web Design System

Coming Soon

A design system built around tangible texture as a base layered with technological elements—where surface, outline and interaction work together to create an experience that feels alive and human. Inspired by paper.design app that I use when visually working with designs while starting from code.

Fondations

The Foundation layer is the lowest level of the Liquid system. It contains all raw and semantic design tokens

Patterns

Patterns are compound UI solutions assembled from Liquid components. They solve recurring problems in the MM product.

Components

All components are built in Figma as published library components with token bindings, variant properties, and Dev Mode descriptions.

Governance

Governance defines how Liquid grows, changes, and stays consistent over time.