Ceci's Portfolio

OVERVIEW

Crocs is a globally recognized footwear brand known for its bold and playful identity.

PROBLEM

Crocs’ current website:

feels generic and template-based, lacking the brand’s personality
struggles with poor responsiveness on smaller screens
doesn’t reflect the brand’s message of individuality

SOLUTION

Proposed design introduces:

a visual design system aligned with Crocs’ playful identity
a layout that works smoothly across all screens sizes
customization features as an expression of “Come As You Are”

MY ROLE

UI Design,
Art direction

TEAM

Ceci Garcia

TOOLS

Figma, After Effects, Spline

DURATION

3 months

TABLE OF CONTENTS

01

CASESTUDY

01

CASESTUDY

02

RESPONSIVE DEISGN

02

RESPONSIVE DEISGN

03

DEISGN SYSTEM

03

DEISGN SYSTEM

01/CASESTUDY

02/RESPONSIVE DESIGN

With most shopping happening online, the website is now the main way customers experience Crocs. The redesign makes the digital journey as engaging as shopping in-store, with responsive layouts and playful interactions across all devices.

-> If the website is the store, it has to feel just as fun as walking into one.

HIGHLIGHT 1

Drag it. Spin it. Love it

3D interaction replaces static imagery, letting users rotate and explore Crocs from every perspective within a responsive, dynamic interface.

Drag it. Spin it. Love it

3D interaction replaces static imagery, letting users rotate and explore Crocs from every perspective within a responsive, dynamic interface.

Drag it. Spin it. Love it

3D interaction replaces static imagery, letting users rotate and explore Crocs from every perspective within a responsive, dynamic interface.

highlight 2

Add a little you to your Crocs

The new customization tool lets users mix and match Jibbitz charms in real time, celebrating creativity and reinforcing Crocs’ message of self-expression.

Add a little you to your Crocs

The new customization tool lets users mix and match Jibbitz charms in real time, celebrating creativity and reinforcing Crocs’ message of self-expression.

Add a little you to your Crocs

The new customization tool lets users mix and match Jibbitz charms in real time, celebrating creativity and reinforcing Crocs’ message of self-expression.

HIGHLIGHT 3

Turn down the lights, keep the fun

Dark mode enhances comfort and accessibility while introducing a fresh, modern look that stays true to Crocs’ bold and playful identity.

Turn down the lights, keep the fun

Dark mode enhances comfort and accessibility while introducing a fresh, modern look that stays true to Crocs’ bold and playful identity.

Turn down the lights, keep the fun

Dark mode enhances comfort and accessibility while introducing a fresh, modern look that stays true to Crocs’ bold and playful identity.

03/DESIGN SYSTEM

The design system builds on Crocs’ bold visual identity, using playful gradients, clear type scales, and a consistent icon set to create a more immersive experience. It keeps navigation simple and intuitive while maximizing the brand’s personality online.

-> A welcoming, lively interface keeps people curious and engaged.