What is PSP XMB?

PSP XMB in brief

The PSP XMB style is built on the XrossMediaBar, the main menu that Sony Computer Entertainment shipped with the PlayStation Portable in December 2004. It is a navigation structure with a very simple geometry: one horizontal row of category icons is crossed by one vertical column of items, and the two lines together form a cross. Everything floats over a background gradient that sinks from deep navy into cyan while soft white light waves drift slowly across it.

The style keeps that grammar rather than copying the surface. Navigation is a cross instead of a grid of cards. The focused item grows where the two axes meet, option panels are translucent and slide in from the right edge, and the background never stops moving. White line icons and white type are the only foreground voices, so the system looks luminous rather than boxed in.

For many people it was the first time a handheld system looked quiet. There were no button frames and no plastic texture, only white type, light and empty space. That calm is the lasting appeal of the style.

See the PSP XMB design system

Where does PSP XMB come from?

The XrossMediaBar belongs to the mid-2000s, a period when handheld consoles, music players, phones and cameras were converging into single portable media devices. The PSP, which went on sale in Japan in December 2004, was designed to play games, music, video and photos and to connect to a network. A device that did all that needed a menu that treated each medium as a peer rather than as a sub-folder of games, and the cross answered the need: categories along one axis, the contents of the selected category along the other.

The interface had an earlier life. The record notes a debut on the PSX in 2003 before the PSP Home menu arrived in December 2004, and the visual period it covers runs from about 2004 to 2010. Ken Kutaragi is the figure named in the source in connection with this lineage of PlayStation hardware and software. The record does not credit specific interface designers, so the safest account is that the menu emerged from Sony's console and media-device culture of the time rather than from a single named author.

Stylistically the XMB sits between two eras. It inherits the glossy, luminous system interfaces of the Y2K period, with their enthusiasm for gradients, soft glow and translucent layers. Yet it is far more restrained than most of them. Where contemporary software often used chrome buttons and drop shadows, the XMB used almost nothing but light and white line drawing. That is the reason it has aged better than many of its peers.

The third current is cross-axis menu navigation. By putting category and content on perpendicular axes, the menu lets a user keep a sense of position in two dimensions with only a directional pad. The focus always sits at the crossing, so the eye never has to hunt. The background adds a gentle sense of time. In the original system a setting could change the hue of the waves according to the month, so that January was grey and December red, turning the passing of the year into a quiet visual event.

What defines the PSP XMB look?

See the PSP XMB design system

Who shaped PSP XMB?

How do you use PSP XMB today?

For slides, the style is strongest on covers, section breaks and keynote-like openings. Use the navy-to-cyan gradient as the full-bleed background and set a single white title on it, perhaps with a few light waves behind. Content slides should keep the foreground sparse: white type, line icons and plenty of dark space. Data slides work when charts are drawn in white lines and translucent fills instead of solid bars.

For web interfaces, it suits media players, game launchers, dashboards for entertainment or streaming, kiosks and settings screens. A cross layout can replace a conventional sidebar and tab bar: categories run across the top and items run down from the focused category. Detail panels should be translucent and enter from the right. Keep focus expressed by scale and brightness, and avoid adding button frames.

For editorial and marketing work, the style evokes a specific moment in consumer technology, so it fits retrospectives, nostalgia campaigns, music and gaming features and product stories about convergence. Pair it with photography that is dark and atmospheric. The tone should be calm and slightly futuristic in the way the mid-2000s imagined the future.

The most common mistake is to keep the gradient and drop the cross, which leaves only a generic blue background. The grammar is the point. Another frequent failure is to fill the foreground with heavy buttons, strong shadows or saturated accent colours, which destroys the quiet. Finally, avoid making the waves loud or fast. They are ambient, and when they compete with the content the interface stops feeling calm.

See the PSP XMB design system

PSP XMB — FAQ