How to Design Like You’re Not a Software Engineer: For Software Engineers

Anthony
5 min readFeb 28, 2019

--

Ten useful tips for software engineers who want to make user-friendly products, befriend individuals of the designer species, or avoid shunning and disappointment from whole teams expecting too much out of you yet again.

Consistency is king.

Establishing your brand or product is already tough enough, especially when thousands of dollars get poured into marketing and sales. What’s often overlooked, however, is how integral consistent UI design is to establishing a connection within the customer’s mind between an app and the brand it represents. The colors, fonts, and arrangements of views should transition as smoothly as seasoned writers and speakers transition from one thought to the next.

“onetwo go” by Deniz Kurtcepe

Your content does not live in a New York City apartment.

Everything on your page, from images and icons to text, needs to be easily digestible. In fact, it’s usually not a bad idea to take up more space for the same amount of information, solely because it will make that information feel less daunting to consume. This is a big one, especially since software engineers tend to pack as much as they can in as little space as possible.

“Knowledge Base” by UI8

Unless you’re Picasso, don’t make your users interpret anything.

For groundbreaking and merely usable designs alike, familiarity must be the most important character trait persistent throughout your product. This is self-explanatory for many, but for the select few that like to experiment, my helpful advice is: don’t. The risk of creating a new design that turns out to be unusable is much greater than creating a familiar-looking app with “average Joe” UI.

“Welcome to friday wizard” by Gustavo Zambelli

Sit down, be humble.

I hate to say it and I cannot stress this enough, but no one cares about the tech you coded behind the scenes. If your data is on the blockchain and your network transfer speeds are competitive with Richard Hendricks’ New Internet, it will all go to waste if your customer’s experience is nothing more than mediocre. If you’re creating a complicated software architecture, try to put a third of your total development effort into client-side work. Oh, and don’t make it feel overwhelming like this.

“Block chain page” by zhenzhen

Wireframe your app for squirrels.

Squirrels have an attention span of 1 second, and so do your users. Hide the long reading and skimp on the onboarding flow. If you can’t summarize your entire app in seven steps, then your app is already too complicated. Retain users by giving them streams of content, one at a time. Instagram keeps people hooked with its endless photos and videos coupled with a seemingly endless news feed. Finally, if you don’t have a lot of content, make it seem like you do by taking up a lot of space! Users probably won’t mind.

“Daily UI Day 23 Onboarding” by Marin Begovic

Remember to count in octal.

Consistent apps are also consistent in layout. To make it easier on yourself and on future designers, make the sizes of all your UI components multiples of a certain number. For instance, using multiples of 8px lets you make margins between text fields 16px and buttons 40px in height, both of which are common sizes. More advanced designs utilize the “columns” feature of major design tools like Sketch and Figma, where designers can partition their designs into subsections with equal padding. Bottom line is, don’t pull random numbers out of your rear end.

“Grid System” by Adrian Myburgh

Show leniency, not latency.

Allow users to make a lot of mistakes and handle such errors with popups and tooltips. Also, combat latency and slow internet connection with loading spinners and text. Make sure users are constantly exposed to new visuals, or else their squirrel-like attention spans might just run out.

“Calculating Loading Icon” by Hoang Nguyen

Befriend your users.

Use friendly language such as “hi” and “welcome” to establish a connection to your users. Also, if you’re a bit more experienced: use inviting colors, transitions, and visuals to make the individual feel right at home.

“Mindie” by Slick Red

Give some feedback.

Provide haptic or visual feedback whenever the user makes an interaction. For instance, lessen the shadow and decrease the scale of a button on click. Perhaps, display a toast message when a transaction has been made. This goes hand-in-hand with reducing wait times for certain functionalities and producing a friendlier user experience.

“Activate Button” by Aaron Iker

Ask for feedback.

There’s no better way to improve your design than to step back and ask those around you for their opinions. Whether it means posting it on an online forum, sending it to design-minded coworkers, or showing it to a potential user/unbiased spectator, you will begin to unravel quite a few issues that would have went over your own head. This seems obvious, but it’s imperative.

“UX Design” by Parham Marandi

Finally, if you’re following all the above tips and your UI still looks like Friendster in 2002, then design might as well not be your thing.

About Me

I’m currently a full stack software engineer for BarCard, Inc. with experience as a product/UX designer at NBC and in a few of my own startups. I love creating beautiful interfaces equally as much as I love data classification and efficient algorithms. So, I figured, why not share some design advice to my fellow nerds?

All content courtesy of Dribbble Holdings Ltd.

--

--

Anthony
Anthony

No responses yet