Luna vs Windows 95 Interface
ルナ / Windows 95 インターフェース
Both sit in Microsoft UI, so the question is not what they belong to but how they behave. Both are read here as style. They are reached for with some of the same intent, which is where they get confused.
Luna
Windows XP's look: blue taskbar, green Start button, rounded windows and a meadow wallpaper repainting the gray office machine as household optimism.
Windows 95 Interface
The screen language Microsoft set down in its 1995 handbook for software design. Gray panels are carved with a doubled outer and inner edge, so the direction of the shadow alone says what can be pressed. A bar sits permanently along the bottom, and every application is assembled from the same system parts.
| Luna | Windows 95 Interface | |
|---|---|---|
| Era | 2001–2006 | 1995–2001 |
| Family | Microsoft UI | Microsoft UI |
| Kind | Style | Style |
| Cues | The blue taskbar / The green Start button / Rounded frames / Meadow-and-sky optimism | Gray panels framed by a doubled edge, one light line and one dark line, outside and inside / A bar pinned to the bottom of the screen with a single square button at its left end / A flat navy title bar with three small squares grouped at its right end / Small bitmap text with no antialiasing, one letter underlined to mark the keyboard shortcut |
| Best used for | Using early 2000s PC culture as a device for nostalgia · Assembling a bright, friendly home facing screen through saturation | Laying out a list or settings screen for business software at a fixed pixel size that never has to scale · Rebuilding the look of a 1990s personal computer for an exhibition or a video |
| Type | Bold sans in white, contrasted hard against the blue ground | Set a bitmap sans at its native size with antialiasing off. Use one size, reserve bold for emphasis, and underline the single shortcut letter. |
| Composition | A horizontal bar along the bottom, one primary control at its left | Split the screen into a permanent bottom bar and a work area. Pack controls about four pixels apart, and put confirm and cancel in a row at the lower right of a dialog. |
| Material | Saturated blue and green, frames swelled by rounding and gradient | Carve everything from four values: the gray face, a white highlight, a mid gray shadow, a black outline. Build relief from an outer and an inner line, and swap light for dark on press. |
| Caution | Copying only the palette while dropping the rounding and swell leaves the colors floating, and none of the optimism arrives. | Copy the gray and the doubled line but add rounded corners or soft shadows, and the direction of the carving stops reading, taking the hardness that defined the original with it. |