Build software with elite design principles focusing on user outcomes, trust, accessibility, and performance. Use when creating UI components, designing user flows, writing production code, reviewing code quality, or when the user mentions UX, accessibility, performance, or trust-focused development.
Build software with elite design principles focusing on user outcomes, trust, accessibility, and performance. Use when creating UI components, designing user flows, writing production code, reviewing code quality, or when the user mentions UX, accessibility, performance, or trust-focused development.
Design-Led Development
Build systems that feel inevitable, trustworthy, and delightful. Every line of code serves a human outcome.
Core Decision Framework
Before writing any feature, answer these questions in order:
User outcome: "This helps [user] achieve [outcome] by [mechanism]"
Anxiety/control: Does this reduce user anxiety or increase user control?
Simplicity: Is this the simplest solution?
Measurability: Can we measure success?
Failure mode: What's the failure mode? If catastrophic, add safeguards
Recovery: Can users recover from errors?
If you cannot articulate the user outcome in one sentence, do not code it yet.
Code Principles
Clarity Over Cleverness
// ✅ DO: Name for humans reading at 2amconst userAuthenticationStatus = checkAuth(userId);
const formattedOrderDate = formatDate(order.createdAt);
// ❌ DON'T: Clever but obscureconst x = chk(u);
const d = fmt(o.c);
Comments explain why, not what. Red flag phrases: "just", "simply", "obviously".
Explicit Error Handling
// ✅ DO: Error states as return typestypeResult<T> =
| { success: true; data: T }
| { success: false; error: UserFacingError };
asyncfunctionfetchUser(id: string): Promise<Result<User>> {
try {
const user = await api.getUser(id);
return { success: true, data: user };
} catch (error) {
return {
success: false,
error: {
message: "Unable to load user profile",
action: "Please try again or contact support"
}
};
}
}
// ❌ NEVER: Generic errors or silent failuresthrownewError("Something went wrong");
❌ Magic numbers without constants
❌ Functions over 50 lines
❌ God objects over 300 lines
❌ Mutable global state
❌ Side effects not in function name
❌ Catching errors without handling
❌ Copy-pasted code
UX Anti-Patterns (Never Do)
❌ Forced account creation before value
❌ Dark patterns (hidden costs, trick questions)
❌ Generic error messages ("Error 500")
❌ Modal dialogs for everything
❌ Destroying data without confirmation
❌ Disabling paste in password fields
❌ Auto-playing video/audio
❌ Infinite scroll without pagination option
Security Checklist
Sanitize all user input (XSS prevention)
Parameterized queries (SQL injection prevention)
Rate limit all endpoints
CSRF tokens for state-changing operations
Encrypt PII at rest (AES-256)
TLS 1.3 for all network traffic
Hash passwords with bcrypt/Argon2
HttpOnly, Secure, SameSite cookies
Quality Gates (Before Ship)
Lighthouse score > 90
Zero critical/high security vulnerabilities
Core flows work offline or degrade gracefully
Keyboard navigation works
Screen reader tested (VoiceOver + NVDA)
Error states tested
Load tested at 2x expected peak
Mobile tested on real devices
Privacy review completed
Rollback procedure documented
Final Mandate
Every piece of code should make someone's life measurably better.
If you cannot explain the user benefit, do not ship it
If you cannot measure the outcome, instrument it
If you cannot maintain it, simplify it
If it does not feel inevitable, redesign it
Quality is not negotiable. Speed is achieved through clarity, not shortcuts.
