Pixel UI

Pixel UI is the visual pixelated aesthetic associated with early graphical user interfaces from the 80s and 90s, and it is the counterpart to the gaming-focused 8-Bit aesthetic. The common graphical elements of these interfaces arose from the limitations of computer display capacities at the time, both in software and hardware. Many of the UI elements developed at the time such as the top menu, the task bar, and moveable palettes, have persisted to this day in many applications.
Unlike Aero, the design language of the time never had a formal designation as it was literally developing with each implementations and technological innovations—no formal design took place in Windows until Windows 95. The name is thus taken from the fact that pixels were often the basic unit of these designs because individual pixels were still easily distinguished on display technologies of the time.
== History ==
MS-DOS and early first- and second-generation video games gave rise to the early 8-Bit aesthetic. In parallel, with the arrival of LisaOs in 1983, immediately followed by Classic Mac OS and Windows 1.0, a new UI language began to appear. That language became solidified with the consumer release of systems like Windows 3.0 in 1990, then Windows 95 in 1995. Pixel UI carried over certain elements of MS-Dos interfaces such as highlighting of selected menu options (whereas 8-Bit and Pixel Medieval Fantasy usually featured a blinking marker), but also introduced a variety of new conventions.
The earlier versions of these systems were monochrome or extremely colour-restricted, with more developed colour spaces arriving later. Nonetheless their improved graphical capacities allowed a much broader use of outlines, where 8-Bit graphics often could not afford or had not figured out how to do so. With Windows 95 came a more subtle look that took advantage of this flexibility to introduce a bevelled or embossed look to some of the graphical elements. Due to comparable limitations, the aesthetics was also encountered in some video games of the era, although HUD-type interfaces tended to be more common.
Low bandwidth and lack of subpixel rendering capabilities in many legacy systems also limited graphical options considerably in the contemporary Old Web. In the home computing sphere, Pixel UI design all but disappeared in 2001 with the arrival of Windows XP on PC and Mac OS X 10.0 on Mac, paving the way for the Frutiger Aero era. It maintained a presence in various elements of web design throughout the early and mid-2000s.
== Visuals ==
*Monochrome or nearly-monochrome palette (especially in earlier forms)
*Grey as the main default UI color, with blue or teal as a major secondary
*Unaliased text, usually without block shadows
*Patterned dithers
*Sprite-like icons with limited palettes
*Blue links
*Window-like elements (i.e. boxes with headers and backgrounds) used to structure web pages
*Simple 3-d effects on UI elements, such as drop shadows and sunken or embossed effects
*Menus with inverted color on the hovered element
*Popups windows as web design elements
*Direct reuse of system UI for design of software or webpages
*Contrasting single-pixel strokes around elements
*Untextured UIs
*Complex web or software forms
== Media ==
;Operating systems
*Early Linux Windows Management systems
*AmigaOS 1-3 (1985-2003)
*Macintosh System 1-6 (1984-1988)
*Windows 3.x (1990-1993)
*Mac OS 7-9 User Interface (1991-1999)
*Windows 95 (1995)
*Windows 98 (1998)
*WIndows ME (2000)
*K Desktop Environment 1 (1998)
;Games
(These games are mostly 8-Bit, but their UI borrows from Pixel UI)
*Tetris (1984)
*Super Mario Bros 3 (1989)
*Sim City (1989)
*Windows 95-included games:
**Mahjong
**Minesweeper
**Solitaire
*Wolfenstein 3D (1992)
*Paranoid (1993)
*Sim City 2000 (1993, with Pixelscape)
*SimTower (1994)
*Clockwerx (1995)
*Worms(1995)
*Tom Clancy's Rainbow Six (1998)
*Worms Armageddon (1999)
== Gallery ==
File:Direct Access 4.x-1988.png|
File:DOS interface.png|
File:computer-graphics-in-dos-menu-driven-interface-dos-navigator-tetris.webp|
File:menuworks.jpg|
File:Dos menus.png|
File:Pplware windows31 00.jpg|Windows 3.x (1990-1993)
File:Windows 95 Screenshot.png|Windows 95 (1995)
File:1986 Mac System Software 0.7 29.webp|Macintosh System 1-6 User Interface (1984-1988)
File:Mac OS 8.1 emulated inside of SheepShaver.png|Mac OS 7-9 User Interface (1991-1999)
File:Windows-95-icons-png-98 ME .gif|Windows 95 icons
File:Amiga-workbench-dos-10.gif|Amiga Workbench 1.x (1985)
File:IMB_ICONS.png|IBM OS/2 icons (year unknown)
File:Magic_Cap_MS_Dos_core_.png|Magic Cap for DOS (year unknown)
File:MAGIC_CAP_MS_DOS_DESKTOP.png|Magic Cap for Windows (year unknown)
File:MacOScontrol_Macintosh.png|MacOs 1 (1984)
File:simcity-1989.jpg|SimCity (1989)
File:DOS-sc2k_001.png|SimCity 2000 (1993)
File:5278364.png| Solitaire
File:intermediate.png|Minesweeper
File:i-DaBj4RZxIL6vjgRXO1n3Is8dYCUG7We8sWbR6v1gs.webp|Mah Jong
File:apple-1996.png|Apple Website (1996)
== References ==
category:1980scategory:1990scategory:visualcategory:electronic
Category:Grey
Category:Teal
Category:Blue
Category:White