On this pageOverview
Pocket Patterns
A self-directed UI study exploring how components, tokens, and feedback states can make everyday tasks feel calmer and more predictable.
Design question
Small interface details can leave people unsure what changed, what failed, or what action to take next.
I mapped common form and feedback states into a compact component set, exploring how type, color, and motion clarify what happens next.
Context
A small study of everyday product feedback
Pocket Patterns is a self-directed design exercise. I used a simple planning task to explore what a person sees before, during, and after an action, rather than designing isolated components without context.
The goal was to make the system legible at a glance: what can be edited, what has changed, and when an action is complete. It is a concept study, not a shipped product.
System
A compact set of states, built from shared rules
I grouped the interface around a small set of reusable decisions: type hierarchy, warm neutral surfaces, a restrained accent, clear field labels, and visible confirmation after saving.
The board shows the relationship between a form, its primary action, and the feedback that follows. Each state uses the same spacing and visual language so the next step remains easy to find.
Interactive study
Plan a small moment.
Try saving a plan, leaving the field empty, or simulating a failed save. This demo stays in your browser and resets when you leave.
Make the result of an action visible before asking for another one.
Next steps
What this concept still needs
The interactive study now demonstrates validation, simulated saving, failure recovery, and editing. The next step is to evaluate whether people understand these states and can recover without losing their work.
I would then test the task with people before treating the patterns as validated. This project is intentionally presented as exploration, without adoption or outcome metrics.
Continue exploring
Muse AI Companion