TensionName the contradiction.
Product design that survives the build
Make the move
that makes it clear.
Drew turns tangled product tension into a decisive interaction, a reusable system, and proof the shipped interface still carries the idea.
DirectionsMake real choices.
SystemSpecify every state.
ProofCheck the actual build.
Drew · Product Design Director
Taste is a hypothesis.
The build is the test.
Drew is the constructive radical in your product room: curious enough to reject the obvious, disciplined enough to ship, and exacting about whether the experience works for people outside the happy path.
- 01
Find the tensionName what the interface must balance before choosing a style.
- 02
Make one moveChoose the interaction or visual idea everything else supports.
- 03
Prove it holdsStress the idea across content, states, viewports, access, and code.
Tension → Move → Proof
Not another moodboard.
A decision you can build.
Start with the product contradiction. Explore directions that differ in hierarchy and behavior—not just hue. Then carry the chosen move all the way into code.
Dense enough for experts.
Calm enough to trust.
Drew names the contradiction in one sentence, identifies whose task decides the hierarchy, and marks every assumption that still needs evidence.
- Primary task: isolate revenue risk
- Pressure: 38 metrics, 4 audiences
- Unknown: how analysts compare periods
Let the comparison
be the navigation.
One dominant move: the table is not a report below the page—it is the page. Every supporting card points back to a row, period, and decision.
- Hierarchy: evidence before summary
- Interaction: pin, compare, explain
- Motion: rows reorganize, never dissolve
Same move.
Real states.
Drew separates what the artifact proves from what it only suggests, then checks semantics, keyboard use, reflow, reduced motion, and token fidelity in the frontend source.
- Observed: focus order follows rows
- Derived: 4.8:1 minimum contrast
- Unknown: screen-reader announcement
Design Studio · inside Zimac
One brief.
Three real choices.
Drew turns a screen or flow into distinct visual concepts, recommends one without hedging, then compiles it into a reusable design contract.
- ✦
Directions with consequencesComposition, hierarchy, type, interaction, and motion—not palette swaps.
- ✦
A system, not a screenshotTokens, components, content rules, states, and responsive behavior.
- ✦
Local-first project historyThe brief, decisions, and build checks stay together on your computer.
Choose the behavior,
not the decoration.
3 directionsSignal Table
Comparison becomes navigation.
Fault Line
Risk splits the page in two.
Proof Ledger
Every claim opens its source.
RECOMMENDATIONFault Line makes the one costly exception impossible to miss.
The chosen direction, made durable
A point of view
with rules.
Drew translates the concept into the exact primitives and behaviors a team can carry across the product.
Name the job, not the hue.
signal.decision survives a redesign. magenta.500 does not.
Hierarchy under real content.
A scale with line lengths, wrapping rules, and fallback behavior—not a specimen sheet.
Designed past the happy path.
Empty, loading, error, overflow, keyboard, touch, and reduced-motion states belong in the contract.
Ship after 2 tunesThe signature comparison holds. Restore visible focus and announce the sorted period.
Sort state is visual onlyRevenueTable.tsx:84 · add aria-sort to the active header.
Focus ring loses the fuchsia edgerevenue.css:219 · use the semantic focus token at 2px.
Comparison survives at 320pxRows stack into named pairs without hiding the source period.
Design-to-code review
The handoff ends.
The idea doesn't.
Give Drew a Figma frame, screenshot, Storybook, frontend file, or pull request. Drew checks the strongest artifact available and keeps observation separate from inference.
- Observed
- What is actually present in the frame or source.
- Derived
- What a deterministic design check can calculate.
- Unknown
- What still needs a running interface or human evidence.
Drew lives in the Zimac desktop app
Bring the brief.
Keep the system.
Work with Drew in chat or open the dedicated Design Studio. Connect Figma and GitHub read-only when the evidence lives there.