IBM iX Site Design

Background: iX is IBM’s technology consultancy and design studio for external clients including Audi, Campari and the U.S. Open.

Objective: Design a new website to better showcase its work and expertise and to reinforce its branding as a design-first business.

My Role: Lead Visual Designer

Tools used: Sketch, Photoshop

Impact: Because this was IBM’s design agency website it was a rare, unique custom design. The rest of IBM.com was templated using different branding guidelines and managed with a content management system. Eventually IBM.com would adopt much of the iX site’s design and elements here would be present in the new company-wide design system.

The Homepage

Perhaps my greatest design challenge was how to present the website in a way that was, for lack of a better word, new and “cool” while still accurately representing IBM (“corporate.”) I couldn’t go crazy and expressive with the design because that wasn’t the iX brand which was more pragmatic--“smart in business and design.”

iX’s visual branding had three basic design elements: Geometric block patterns, high quality photography including portraits with a plain grey background, a color palette of black, white, and dark grey with blue for links. All pages had a large hero space with either a photo, a block pattern or video. I used a four column grid and designed the site to be modular and was deliberate about the use of imagery including its relationship with surrounding elements.

Interior Page

Before I worked on this it was a long page of unorganized client logos. The business asked to change this in part because legally client logos could not be used. I took this opportunity to organize the clients in such a way that users receive more useful information. I recommended adding the industries of the clients as well as their locations to show off the business’s range of expertise and global reach. In addition to this, I suggested adding some featured clients in part to add a more visual element to what is otherwise a pretty stark, mostly text page. (I also thought the featured clients should go at the top but the business owners wanted the branding message there.)

Impact

At the time we had a design system called Northstar. Actually, to call it a design system akin to today’s Google Material Design would be generous; it was more like a set of design guidelines. While I had existing brand assets to use I was free to come up with something different from the rest of IBM.

While the iX site eventually went away—the last of its custom kind before the entire company website became templated and managed by a content management system—you can still see its impact on IBM.com today. The short bursts of large type on ample white space, the modular content boxes, the use of the grey isolated background in the portrait photographs of IBM leadership (though not everyone, alas; it looks a bit inconsistent now), and the intentional design of vertical space between elements. On this last point, before it was only horizontal space that mattered but now explicit guidelines for vertical space are in Carbon, IBM’s own modern design system.