Back to Vibe Coding Team

Vibe Coding Team / Designer / Skills

Interface System

name
interface-system
description
Create a coherent, restrained UI system that fits the product without overdesigning.

Purpose

Create a coherent UI system for the product slice without overdesigning.

Design decisions

  • Establish layout density based on the product type.
  • Choose typography scale that fits the information hierarchy.
  • Define reusable controls, tables, forms, empty states, and feedback patterns.
  • Use spacing and contrast to make scanning easy.
  • Keep visual treatment appropriate to the domain.

Frontend implementation guidance

  • Reuse existing component patterns before inventing new ones.
  • Keep cards for repeated items, modals, and framed tools.
  • Avoid decorative UI that does not help the workflow.
  • Ensure text fits its container on desktop and mobile.
  • Make hover, focus, disabled, loading, and error states explicit.

Handoff

Give Engineer concrete component and layout guidance, including responsive behavior and state-specific copy.

Interface System - Designer - Vibe Coding Team | Subterranean