How to Use Bad User Interface to Drive Creativity and Collaboration—and Improve User Experience

Kyle Ahlstrom

How to Use Bad User Interface to Drive Creativity and Collaboration—and Improve User Experience

In 2017, before I joined Credera, a post appeared on the subreddit /r/ProgrammerHumor titled “Who can make the best volume slider?” It was accompanied by a GIF of a volume control (i.e., the control you use to increase and decrease the volume in an application with sound) that was purposefully created to be barely usable, in the most hilarious way.

In the weeks that followed, this subreddit would be filled with some of the most ridiculous volume controls ever created. One of the first terrible volume controls looked like your typical volume control. It was a tall rectangle, and the user would assume you click somewhere between the top (100%) and bottom (0%) to set your volume.

However, instead of choosing a point between the top and bottom, the selection range was actually horizontal with the left being 0% and the right being 100%. The rectangle was so thin that it was almost impossible to get a precise volume level. It was hilariously frustrating.

Over those few weeks, my co-workers and I would gather for a few minutes every day and look at all the top posts to get a kick out of these ridiculous volume sliders. After a few days of this, I realized these ideas were, in a way, reshaping the way I thought about user interfaces (UIs)—and how good (and bad) UI influences the user experience.

Volume level is a personal thing. It’s almost like water temperature—we all have a personal preference for how hot or cold is ideal for us. If you don’t give users the tools or ability to adjust their preferences precisely to their liking, the overall experience can become deteriorated or all-out broken.

Going back to the example above, the seemingly minor decision of transforming the selection range from vertical to horizontal could have made a world of difference in improving the UI.

It’s small decisions like these that we always need to be thinking about when designing and building experiences for users. Small decisions cascade. If you make enough good decisions, you get a sleek, easy-to-use product, whereas enough bad decisions result in a clunky, unintuitive mess.

Bringing Bad UI into a Hackathon—on Purpose

Fast forward to 2022: I was now at Credera, and a few team members and I were brainstorming ideas for our team’s quarterly event, which we wanted to be some sort of hackathon; but not just a normal hackathon—something fun and different.

“What about some sort of bad UI thing?” one of my co-workers suggested. Immediately, I flashed back to 2017 and those terrible volume sliders. I quickly dug up an article that went over the highlights of the “Volume Slider Saga” and shared it with the team.

After tossing around other possible ideas for a little bit, we decided to go with the “Intentionally Bad UI” hackathon idea titled, “Nailed It” (like the Netflix show).

How Bad UI Helps Produce Good UI

Some of you might be a bit skeptical. How can making something intentionally bad teach you anything important? I thought about this for a little while but realized that often, when I’m stuck on a development problem, I try to keep chiseling away until I strip it down to the point where the cause of the issue at hand is easily identifiable.

The same can be done with designing and understanding UIs. For example, in development, if I find a visual bug and I can’t quite figure out what element is causing the issue, I start just working up the DOM tree, div by div, until I get to the source of the problem.

With UI, if something’s not working or feeling right, you can start by analyzing the smallest, most basic part of the user’s experience and work your way up until you find the source of the problem.

We figured that bringing this bad UI concept into a hackathon could be a good way to do some reverse engineering of UIs. By using good UIs as examples and then doing the opposite, we can start to fully understand how certain decisions might affect a user’s experience.

The worse we can make an experience, the better we understand why it’s bad and how we would make it better for the user. A sort of “reverse–reverse engineering,” if you will.

Plus, yeah, it’ll be fun and I’m sure we’ll see a lot of cool, creative ideas.

How Focusing on Bad UI Helps Drive Creativity

During the kickoff for the hackathon, a few days prior to the event itself, we revealed our “bad UI” theme. Everyone seemed to love the idea of getting to make something super creative and intentionally terrible or silly. We split into six teams of four with each team consisting of approximately three developers and one designer.

Oftentimes, in creative meetings, people can be hesitant to share ideas at the risk sounding dumb or uninformed. In fact, research suggests making use of activities that can help people feel less inhibited around others can improve the outcomes of brainstorming sessions.

Something similar was happening in this instance: We were having no issues cranking out ideas and features to build upon because the whole concept of the hackathon was to make a bad product. It was really easy—and fun—for everyone to spit ball and feed off of each other’s energy and ideas. Even though most of us had just met, we were collaborating really well.

Bad UI Also Releases Stress and Pressure

As we got along further in the day, I noticed something else: We weren’t stressed about finishing everything. For as fun as they can be, hackathons are often stressful. There’s usually a lot to do in a little amount of time.

However, with the nature of this hackathon, our base idea was already a terrible UI, and the more features we were able to get done in the day, the worse it became. If we didn’t finish everything, the project wasn’t incomplete or didn’t feel that way—it was just worse (or better?). In the back of our minds, I think this was a relief and allowed us to blow through the features we had laid out with no pressure.

When all was said and done, all six teams had incredibly creative and ridiculous ideas. In our wrap-up meeting, you could feel the eagerness (even over Teams) of everyone wanting to show off their project and see what other teams had come up with. Some of the highlights included:

1. A “press-the-button” 90s arcade-game-style navigation.

2. A “Hamburglar” navigation, where the user had to find various ingredients of a hamburger on the page before they were able to choose where to navigate to.

3. Various mini-games that you had to complete before navigating to a page—including scrolling through the entire Bee Movie script (this was my favorite).

Overall, all six teams delivered something awesome or hilarious (or both), and it felt like everyone walked away from the day having had a fun, unique experience that hopefully helped shift the way they look at and analyze user interfaces.

Building Great UI for Organizations

As much as we love a good laugh and to poke fun at bad UI, we’re passionate about helping organizations create and build experiences that make a difference in their users’ lives. If you’re interested in talking with us about how we can collaborate on great UI for your organization, please get in touch with us at findoutmore@credera.com.