UI Design

There is a certain fluidity when it comes to these design terms, I’ve found. Ask ten different designers what each of these alphabet prefixes means and you are likely to get subtly different answers.

For me, designing interfaces was the first step down the road toward what I now think of as User Experience Design. It was the first design process that prompted me to ask more questions about function rather than questions about aesthetics.

My first introduction to these concepts was all the way back in the late 1980s, after I had gotten out of the Air Force. I found that my fascination for personal computers translated into a salable skill in the workplace. Rather than dreading the growing presence of computers, I loved them and was ready, willing, and able to mess with them to do basic business office tasks.

One of my first gigs was almost solely based on my willingness to wrangle a piece of software (now I’m wracking my brain, trying to remember which one…PageMaker? Quark?) to design and layout forms. Not online forms, mind you, but printed forms based on a set of business requirements. I learned later that the client was having trouble keeping temps in that role because most of them found it too boring. This was not the “sexy” design realm of a magazine ad or a brochure, this was skinny boxes and type, font sizes and columnar layouts. I actually enjoyed it, and I realize now it was because it presented a new set of questions, a new set of more subtle challenges.

UIs — shortened from GUIs (which you really don’t hear anymore, huh?) — are places where the user is given the opportunity to do something. As such, they prompt questions that require the designer to put themselves in the user’s shoes and anticipate their needs. Even something as simple as a printed form began to spark my awareness of this new way of looking at things.

Granted, in this case, I had been suitably prepared by the scores of horribly designed forms I had filled out during my time in the military. Those of us old enough to remember the pre-digital era have all probably experienced the unique heartbreak of a badly designed form. The DMV, the post office, the HR department at your new job…it wasn’t hard to find them in the wild back then.

How large must a label be to be readable? How big must a form box be to accommodate a last name? (And what if the individual filling it out has a really long last name?) Should the box provided for a phone number be split out to provide a separate box for the area code? Do all of these input fields have to be crammed into as tight and as small of a space as possible? (Really?!)

That early computer job that prompted me to think about printed forms led to ever-more complex and engaging sets of similar problems as the notion of what an interface was and could be evolved over the years.

I’ve worked on many kinds of interfaces over the years, but never as many or at the same breakneck pace as when I performed a stint in e-commerce back in the mid 2000s. No big surprise, since shopping is almost entirely transactional — browsing, selecting, comparing, purchasing. These tasks are all addressed via an interface and it was fun (and instructive) working on these patterns as they were taking hold within the ever-expanding web space.

Oh, hey, look! A form…

This piece is representative of the type of stuff I churned out all day, every day during my stint in e-commerce. I kind of cringe now when I look at that header; we had ongoing battles with the business when it came to those headers. Everyone had something that they wanted included in the header!

Should the product matrix on a search results page be three columns wide (larger images) or four columns (more products)? Unlike the Tootsie-Pop owl, the answer (according to business) was four. More products!

When I transitioned from e-commerce to the Financial Services sector, the bedrock commonality of the interface had been firmly established. We had all begun to talk about the User Experience by that time. But an experience is often built on interfaces, right?

How to present additional information related to specific years on a timeline? Expanding and collapsing buttons seemed the best way to go, since they gave over control to the user.

Ah, now that’s a header I can live with..! Clean, with manageable nav options. Let’s give ’em a slider to ease them into the application process, too.

Don’t get me wrong. I have always enjoyed the more aesthetic aspects of all of these pages — I love picking colors and fonts and background textures as much as any designer. (I fell in love with that little girl’s sweet face in the Springleaf banner! Springleaf does a lot of auto loans and I really responded to the sheer happiness of the folks in this image when I found it. “Yay! We got a new car!”)

Designing interfaces helped me learn that we are all trying to accomplish some task when we turn to the web, we are trying to do something. That knowledge expanded my design thinking. I also found that coming up with solutions and testing them out to help create interfaces that make user options easier to understand and easier to accomplish can be a deeply rewarding process.

--

--

--

Lifelong reader and lover of the arts. Came to Medium for the long-form online pieces, stayed to help strengthen my own writing and to share more.

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Scott Lindsten

Scott Lindsten

Lifelong reader and lover of the arts. Came to Medium for the long-form online pieces, stayed to help strengthen my own writing and to share more.

More from Medium

Checked In Baggage

To Leonard Bernstein