If you’re a designer who spends any amount of time on social media following others in the design industry (and we’re assuming this would include pretty much every person reading this right now) then you likely know about User Inyerface. The “world’s worst UI,” as Fast Company described it, the User Inyerface was a devious experiment dreamed up by Bagaar, an Antwerp-based design agency.
What Beggar was trying to accomplish—or, rather, the point it was trying to prove—was simple: There are certain design elements that have been so ingrained in how we navigate any website that when you take those away, or redesign them in a way to make those prompts user-unfriendly, you’re going to end up with a website that is nearly impossible to find your way around.
User Inyerface, then, is painfully difficult to navigate because Bagaar took a blowtorch to all those design elements that make a website easy to navigate.
“We created a simple interface, that isn't your friend,” Bagaar explained in a statement. “An interface that doesn't want to please you. An interface that has no clue and no rules.”
While design innovation is of course a good thing, it’s also important to remember that a “user assumes certain actions to be in a certain place or color because interface designers worldwide have been collaboratively educating users and feeding them these design-patterns.” This means that rather than spending a lot of time studying your UI, “users tend to act instinctively and take 90 percent of an interface for granted.”
To put it another way: If a user is taking your UI for granted, it only means that you’ve most likely created a first-rate user experience. It’s why those elements that have become second nature to users—like dropdown menus or the homepage icon—should be left alone, while you innovate in other ways.
As Fabricio Teixeira, Design Director at Work & Co and founder of UX Collection, told Fast Company:
It's a powerful exercise to pinpoint where you can push and where you might be disorienting users with something new. That fine line between these two worlds is exactly where I want to walk as a designer.
Whatever website or app you’re tasked with designing is obviously going to have a lot of stuff on it. And this stuff can all be filed under content, such as blog posts, case studies, infographics, videos, etc. But content can really be thought of as anything you find on a landing page, even if it doesn’t contain content in the way we think of content; for instance, it could be a product page or job openings.
And so, when you visit a site that has a lot of content, it’s like entering a subway station in New York City (or a subway station anywhere in the world): You need to know how to get to where you want to go. If a subway station had no signs directing commuters to specific platforms where they can catch their train, the station would be a chaotic mess of people going this way and that, stampeding over the poor tourists who would be even more lost than everyone else.
While not reaching the level of chaos that you’d experience in this hypothetical unmarked subway station, a website that doesn’t direct a user on how to find the content he or she is looking for would be a rage-inducing experience for anyone. (Which Bagaar helped prove with its User Inyerface experiment). This is where your information architecture (IA) comes in: IA can be thought of as part of the foundation upon which you build your entire design strategy, providing your UI with a structure that organizes all the content in a way that makes it easy for a user to find.
If UX design is ultimately the driver steering everything for users, IA is the roadmap that will help them get from point A to point B. Rebeca Costa, a writer at Justinmind.com, notes that while there’s a “strong connection” between UX and IA, your UX is going to be “much broader, and includes several aspects of the user’s experience that AI never touches—such as making sure the interface is pleasant, and responds to certain psychological needs of the user.”
Information architecture, on the other hand, “is much more focused on the user’s goals and cognitive effort usage.” Although UX (for good reason) gets talked about more than IA, the IA is an extremely important component in your overall design.
“Here [are] how the two concepts are closely linked: without good IA there is no logical and effective user experience,” Costa explains. “It works as a foundation on which the interface can be developed, opening the door to all the other aspects of UX design we all know and love.”
UX Collective’s Fabricio Teixeira pointed out the “fine line” that exists in design between innovation and “disorienting users,” which is why Costa notes that by building a solid IA, it will open the door for your design team to innovate in other areas that creates an optimal user experience.
“AI needs to be a solid base on which you can build the user experience, but it cannot work as the whole project,” Costa says. “Once you know how you can take the user by the hand around your product, you need to add flare and work on other things, such as interactions that combined with your IA, can deliver an amazing experience.”
If the goal of AI is to build “a solid base” that will enhance the overall user experience, the question then is what goes into this structure? A good place to start, as noted in this blog post published by UX Planet, is with Peter Morville and Louis Rosenfeld, two pioneering information architects who literally wrote the book on IA with Information Architecture for the World Wide Web: Designing Large-Scale Web Sites, which is in its fourth edition and was originally published in 1998.
Morville and Rosenfeld identified four main units that make up an IA strategy: organization systems, or how you categorize your content; labeling systems, or how you represent the content; navigation systems, or how you users will browse through the content on a website or app; and searching systems, or how users will search for and find content on a website or app.
Morville and Rosenfeld also created a Venn diagram (below) that forms “the basis of our model for practicing effective information architecture,” which includes context, content and users. They refer to these three components as an “information ecology” that exist in an “interdependent nature.”
Moville and Rosenfeld note that digital products “are not lifeless, static constructs,” but instead “there is a dynamic, organic nature to both the information systems and the broader environments in which they exist.” What this means is that the IA of one website or app will not necessarily resemble that of another website or app; a social media website like Facebook, for instance, will have a very different IA than that of a retail site like Etsy.
Per Morville and Rosenfeld’s book:
In short, we need to understand the business goals behind the web site and the resources available for design and implementation. We need to be aware of the nature and volume of content that exists today and how that might change a year from now. And we must learn about the needs and information-seeking behaviors of our major audiences. Good information architecture design is informed by all three areas.
Design blogger James Pikover argues that “the most important factors to building your IA are where individual components of the architecture are placed (hierarchically), and how they’re labeled and displayed.” When you build a visual hierarchy, you’re taking into account “features, functions, and behavior,” Pikover explains; and when labeling your IA, you’re “creating a legend for displaying different types of features, interactions, and flows.”
“Displaying visual hierarchy is a valuable asset to IA, not only because it provides better context for the reader, but also generalizes key regions of the product,” Pikover explains. “If your app’s most significant feature is ordering a ride (a la Uber or Lyft) which can be done from the homepage, then that page will have the most touch points and the most value to the product. The same will be true for the visual hierarchy.
As a UX designer, it’s understandable if IA is a little bit out of your comfort zone; as we’ve explained, UX design and IA are very closely linked, but they aren’t the same thing. With that in mind, Pikover created useful video where he reverse engineers the construction of IA as a basic tutorial on how to build your strategy. You can check it out here.