As more designers stop turning their noses up at the interactive medium, it becomes more important to know how to integrate web design into your work. Learn the theory and principles behind the best interactive projects in the HOW U course Principles of Web Design.
Contemporary interactive designers are tapping into the 80s design aesthetic. This means vibrant colors, pixelated imagery and New Wave typography.
Anyone who experienced the ’80s and lived to tell the tale knows the era of boomboxes and break-dancing was defined by neon shades and 8-bit arcade games. Similarly, graphic design was as colorful as it was coarse during the 1980s. Although Adobe’s PostScript technology would eventually give designers the ability to render smooth vector graphics, viewers became accustomed to seeing “stair-stepped” edges on computer displays and televisions, and in magazines such as Emigre. Colorful and hard-edged graphics also plastered MTV in between its music videos, and gamers saw them on consoles that they’d hook up to multichannel and cable-equipped televisions.
Fast forward to today, when consumers of visual culture can still find low-fi graphics on websites, microsites and games. Consider the success of the world-building game “Minecraft,” and its less-than-high-resolution graphics, whose coarse pixels make the perfect building blocks for those keen on creating their own environment through the comfort of their personal computer, tablet, iPod or phone. If you regard games as just for kids, think about the last time you played with a Google Doodle or stumbled upon an interactive—and very game-like—website. Both brand strategists and graphic designers know what works, and integrating low-fi or hi-def video games into online media not only attracts users, but also gets them to come back for more.
Today’s interactive designers—especially the “children of the ’80s”—revisit the visual culture they grew up with by introducing outmoded and stair-stepped graphics into their personal work or using nostalgia to help their clients connect with consumers. And color can be a powerful ally in that endeavor. The radiant hues that became popular with “Asteroids” and “Pac-Man” are alive and well in interactive design, as evidenced by the high-saturated tiles used in Microsoft’s new operating system, and the pastels and bright colors found in Apple’s cheery iOS 7. Web designers have also used brightly toned hues for full washes of color that span much—if not all—of a site’s background in the spirit of early Sega and Nintendo games, such as the classics “Out Run” and “Super Mario Brothers.”
The wildly popular iOS 86 is Anton Repponen’s nod to the 1980s. Created as a joke, he continues to receive inquiries about his design.
Revisiting ’80s Design Aesthetic
Design-wise, Nathalie Lawhead, the founder and creative force behind Tetrageddon Games, looks back on the 1980s with admiration and nostalgia. “There was always a computer in the house when I was growing up, and I spent most of my time behind it,” she says. “I played games from a floppy disk, printed art from a dot-matrix printer and made strange block-like animations using the keyboard on that strange block-like CRT monitor. This is the part of the ’80s that I admire and celebrate in my work, while taking things further.” The 1980s aesthetic of bitmaps, bright colors and angular polygons shows no sign of disappearing despite today’s high-definition displays available on not only televisions, but also on personal computers andmobile devices.
The influences Lawhead recounts have been (and continue to be) building blocks to assemble a pixelated playground, where past visual aesthetics fuse with present-day interactive design. Who says a sleek iPhone has to have the latest-and-greatest operating system? Or even the latest-and-greatest display technology? Take one look at iOS 86 by Anton Repponen to experience the 1980s in all of its gruff digital glory. Repponen conducted thorough research into everything about the outmoded ’80s, taking care to reproduce an iOS interface that mimicked the lines, scroll bars and panels as they’d have been rendered back then. With 10 years of interface design experience, including seven spent at the New York agency Fi, Repponen has worked on interfaces for Google, Microsoft, Sony, Wacom and USA Today, among others. Working in a low-fi capacity isn’t something Repponen does in his day-to-day work, but iOS 86 was done on a lark, as a campy experiment that eventually generated a widespread reaction. “I look at iOS 86 as a piece of artwork or even a parody,” Repponen says. “I posted this on my blog not taking it seriously, and it went viral. I still get emails and tweets about it. Why is that?”
When corporate giants like Apple and Microsoft incorporate past aesthetics into contemporary solutions, they’re celebrating their legacies. These throwback looks remind consumers of how far they’ve come and how much further they expect to go in the future. For tech companies, or any company for that matter, staying power is a must. The decision to remind users of the past helps customers identify the brands as more than companies that provide products, services or solutions—it makes them legendary. Nostalgia can help foster that mentality.
Perhaps this turn toward the past also has something to do with the ever-changing nature of people’s contemporary digital lifestyles and the interfaces on their devices. We’re almost constantly prompted to update programs or settings, and if our device is out of date, we’re stuck. Change is difficult, especially if it forces users to fork over more money for something they already have. So why not stay stuck in the past? Rewinding to an older aesthetic or, in the case of iOS 86, an older operating system, allows users to remain comfortable in their skin. No need to change, no need to spend money and no need to worry.
In iOS 7, you can choose from colorful wallpaper to give your phone a bright pastel background akin to what you might find in 1980s fashion and interior design.
Tech Companies Embrace the Past
During the past year, users had to contend with plenty of change-related issues as both Apple and Microsoft underwent big transformations, notably with their operating systems. Apple customers continue to remain divided about the iOS 7 changes that replaced leathery and metallic digitally rendered surfaces with flat, colorful icons and graphics. But Apple’s iOS evolution was as much about moving forward as it was about paying tribute to the past. When considering iOS 7 chromatically, Apple, as led by Sir Jonathan Ive’s design team, harkened back to the company’s rainbow-striped logo in use from 1976 to 1999, designed by Rob Janoff of the Regis McKenna Agency. Dig beneath the surface to the iOS 7 wallpaper and you’ll find backgrounds with a slight resemblance to the visual language that the Memphis Group incorporated in its interior and product designs
from the 1980s. It’s as if one of Ettore Sottsass’ cabinets has been flattened, filled in and placed in the palm of your hand. Or maybe it’s a graphic pattern that April Greiman would have created during her early digital experiments using a Macintosh Plus or Quantel PaintBox.
Big brands are especially aware of how paying tribute to the past can be an asset. Drawing connections between the past and present, and even a possible future, also demonstrates that the brand has been—and will continue to be—successful, forward-looking and profitable. And it’s not just Apple that’s gone back to the future. Microsoft has not only unified the look and feel of its Windows operating system by incorporating its flatly colored, tiled start screen across phones, tablets, laptops and desktop computers, but it’s also managed to—if only moderately—recall early iterations of Windows, such as versions 1.0 and 2.0, when the operating system was hard-edged with colorful headers and scroll bars.
Following the praise Repponen received for iOS 86, he also sees nostalgia as a powerful agent. He presumes that his black-and-white user interface surrounded by the contemporary hardware of an iPhone gave the overall design an old-school cachet that he has seen used in places outside the digital design realm. “Look at Fuji—they’ve been making cameras for the past 10 years, and no one was taking them seriously,” Repponen says. “But the day they release their Fuji X100, which looks like it was designed 30 years ago, everybody is talking about them. Car manufacturers have also been making similar retro designs. So there’s that weird feeling of nostalgia with people saying, ‘This camera looks like the one my dad had,’ or ‘This interface looks like my very first Mac.’”
Similarly, even though he only developed two screens—a lock screen and home screen—iOS 86 quickly became popular. Repponen saw people using it without permission, going so far as to jail break iPhones in order to apply an iOS 86 skin. For all of the positive response iOS 86 has had due to its clean and minimalist aesthetic, Repponen is a realist: “Apple did a fantastic job with iOS in general,” he says, admitting that his iOS 86 interface is “quite unusable.”
Nathalie Lawhead’s Tetrageddon Games and personal website elicit a 1980s vibe, all the way down to small details like the green pipe that echoes “Super Mario Brothers.”
Old-School Style with New Age Tools
Recalling the past has as much to do with entertainment as celebration, especially when one hybridizes many differing periods, “-isms” or stylistic tendencies. Artists and architects have been remixing and layering one form factor on top of, beneath or besides another for decades. In some cases, they celebrate the materials used; in other cases, they celebrate the surroundings. But what about the tools used?
With interactive design, it’s purely hypertext, a series of markups accompanied by classes and styles. For a designer who witnessed the birth of desktop publishing, however, the layout program takes precedent, and those tools become a form of self-expression. When smashLAB’s creative director Eric Karjaluoto set out to create his blogging platform Ideas on Ideas, he lent a “bitmap-y” aesthetic to his website that was influenced by layout software.
“I started by designing the blog to look like it was within layout software like Quark or InDesign,” says Karjaluoto of the project’s genesis. “Given that the layout-software motif already used a number of pixel-based treatments, I decided to carry this approach through to the small illustrations that kicked off each story. I played with various subject matter in these small blocks, but I always maintained that hard-edge pixel technique—mostly to maintain consistency. In time, the blog was redesigned, and then redesigned again; however, those pixel treatments became a part of that site’s visual DNA.” Karjaluoto admits that the approach he began with and carried throughout the lifespan of the blog was “largely accidental,” and as a self-proclaimed pixel lover, he “just liked how those visuals made otherwise dry content a little more fun.”
Low-resolution digital renderings show no sign of disappearing—despite the fact that another digital revolution is upon us. We’re surrounded by high-definition screens, 3D televisions, retina display Apple products, super-high-resolution Google Chromebook laptops, and uber-high-definition 4K televisions. And while it’s ironic that designers are using hi-fi technology to produce low-fi results, they seem to be addressing the “always on” digital nature of our lives by revealing a simulacrum of our digital devices. Not even a trained eye can see pixels on an iPhone’s Retina Display unless they’re rendered large enough for us to perceive.
Like what you’ve read? Download the entire article at MyDesignShop, or get the entire June 2014 issue of Print Magazine and more innovation and entrepreneur inspiration!