UI and UX for engineers
Most engineer-built interfaces fail in the same few ways: everything has the same weight, spacing is random, states are missing and nobody compared the screen with a product people actually like. Each of those has a learnable fix.
このページの本文は英語です。
コースを始める
レッスン
How to judge an interface against good references
Pick the products people already admire for the job, capture them beside yours and close the differences one at a time.
Visual hierarchy, spacing and layout
Decide what matters most on the screen, then use size, weight, color, position and space to say so.
Typography for interfaces
Type scales, line length, line height and weight, and how to pick one or two fonts that work.
Color, contrast and dark mode
Build a small palette, meet WCAG 2.2 contrast requirements and make dark mode a second palette rather than an inverted one.
Loading, empty, error and success states
Design every state a screen can be in, so people always know what happened and what to do next.
Forms and multi-step flows
Labels, validation timing, error messages and recovery, plus how to walk a task from entry to completion.
Motion, keyboard access and accessibility
Use animation to explain change, respect reduced motion, and support keyboards and screen readers.
Interview Prep パス · プランを比較