UI design isn’t simply putting icons, buttons, and menus together to make a beautiful app or website. It serves a purpose in user experience (UX), making it more functional and usable. Different experts know this to be true. But what else do they have to say in creating a good UI design?
In this article, check out what UI and UX experts and designers have to say. Plus, know how Penji can help your business with designs.
What Experts Say on Good UI Design
1. Keep the user in mind
According to Nick Babich, a software developer, and UX expert, the key to good UI design is to let users control the interface. He shares this bit on the Adobe XD Ideas site.
Since users are the ones benefiting from your app or website, you want to make sure they have the driver’s seat. Always keep the user in mind. After all, you want them to keep using your app or browse your website without difficulty.
Babich further enumerates five additional points:
- Reversibility (allowing the user to undo actions)
- Acknowledgment (letting the user know their action)
- Navigation (browsing freely without any difficulty)
- Visibility (making sure the user knows the status of their action)
- Accommodation (providing different skill levels [e.g., tutorials, shortcuts] to all users)
2. Take inspiration from design sites
Jane Portman, the co-founder of Userlist and a UI/UX consultant, shares this tip in most of her blogs or interviews. Get inspiration on sites like Dribbble or Behance for the latest trends.
To know the latest UI/UX design trends, designers could check out what their peers have created. Portman mentioned in her Invisionapp blog post that it could enable designers to produce better and beautiful projects.
You could follow Portman’s tip if you’re undecided about what type of design you want for your website or app. You can find design inspirations from the websites she mentioned.
3. Design based on your audience
Best practice does dictate that you should always keep the target audience in mind.
UI/UX and branding designer Stef Ivanov writes in his blog you need to consider the preferences for different age groups. Consider it part of your research as you start designing your website or app for users or visitors. Plus, it’s also a factor in creating a responsive website design.
Even if most of the users online are Millennials and Gen Z, you need to consider Gen X and Baby Boomers. Statista reveals that their demographic combined makes up for at least 30% of all internet users in 2019.
Keep in mind how your audiences would respond to different design elements. For example, Ivanov says using large fonts for older generations. As for Millennials, they want to accomplish a task in a few clicks.
4. Use icons to represent text or function
Illustrator Manuela Langella emphasizes the importance of using icons on the web or app design in her article on Smashing Magazine. Langella mentions that it contributes to an easier understanding of concepts on a global scale. It will also make the UI design intuitive and functional.
Plus, make sure that it’s “finger-friendly.” You don’t want users zooming in on the app to click a button. Or you don’t want them to click the wrong button if it’s bigger than usual.
Not to mention, don’t forget to make your icons consistent too. Tim Pleiko-Izik shares in a Dribbble article that you want them to have the same width and style to avoid confusing your users.
You won’t experience this problem when you subscribe to Penji. Rest assured that Penji designers will apply a user-friendly and compelling design on your app or website. Explore what Penji designers have produced for clients.
5. Stay consistent
Graphic designer Tomáš Čakloš highlighted that consistency is an essential factor to good UI design. In his article, he suggests using the 8-pixel grid on all design elements (ex. grids) on the app or website. He explains that eight has a “sufficient minimum jump” and can be resized to whole numbers when adjusting.
Another way to make the design consistent is through fonts. He recommends designers use a “geometric progression” in scaling fonts. It’s how you can play with sizing as well.
6. Use appropriate typography
It may be safe to use the typography or font choice based on your brand style guide. However, you may need to follow elements of typography that will contribute to a compelling UI design.
Dorjan Vulaj, a UI/UX designer, stressed the importance of typography to convey your messaging. One way to do this is to observe hierarchy. As Vulaj wrote, in UI, you will apply display, overline, heading, and body. Plus, you need to take into account white space. Balance is key in ensuring that copy is readable on a page or the app.
Since Čakloš previously mentioned font scaling, one other thing to consider with typography is contrast. Vulaj says to use opacity because reading on screen can get tiring if it’s full-on contrast. That’s why you’ll see shades of black or grays on screen. It looks pleasing to the eyes.
7. Limit the use of colors
UI/UX designers would give different tips on how many colors you can have on a UI design. Čakloš mentioned that nine is a solid number because you can play with the main (base) color’s light and dark hues. Meanwhile, Daniel Schwarz, designer and developer, recommends using only three colors.
Too many colors can overwhelm a visitor or user. Schwarz mentions to use colors for the following elements of your app or website:
- CTA button (brand color)
- Text content (neutral or lighter color based on the brand color)
- UI elements (neutral or darker color based on the brand color)
Also, make sure to prepare a palette and use contrast when necessary.
8. Prioritize mobile design first
In his article on the Creative Bloq, web designer Joss Cook shared designing for mobile first. Most UI designers would design for websites then proceed to mobile. However, Cook reveals you can prioritize the tasks or functions needed only on mobile. From there, designers can include additional elements necessary for website experience.
Do you want to receive a well-designed website optimized for desktop and mobile? Watch a 10-minute video demo how you can get one for your business today.
9. Observe design patterns
Here’s another website UI design tip. Product designer, Jeff Wang wrote on the Marvel blog to follow design patterns when necessary.
Design patterns like Z or F patterns are still significant. Sure, you may want to divert from the norm to stand out. It doesn’t hurt to follow these design patterns that would help users navigate and browse. This is much better than changing what’s established which might make users or visitors confused while visiting your site.
10. Keep it simple
John Moore Williams, a UX writer at Google, emphasized the value of simplicity in the UI design. You don’t want to overcomplicate decision-making processes on the app or website. As Williams states, apply only one call-to-action (CTA), if possible. You don’t want to overwhelm the visitor or user.
Remember the goals you might have for the website or app. For instance, you want them to sign for a newsletter or buy your product on the landing page. Make sure that the CTA button reflects that.
11. Conduct a stress test
Before launch, the UI design undergoes a stress test. It’s not a physical stress test. According to software engineer George Ombo, a stress test will determine a site or app’s usability. Ombo lists different ways of conducting a stress-test. Here are the top three things to remember.
For one, he emphasizes the need to have outside help like friends and family and your user base to assess the UI. It’s good that you have an objective eye to test out your design. From there, see how else you can improve the design to fit your target audience or user base.
Secondly, he recommends that you take into account what tasks the users or visitors should undertake when on the site. Typically, users or visitors need around 3 to 4 tasks.
Finally, view the site without images or styles. This way, you can further evaluate how you can check what other tweaks you need to make on the site or app.
12. Apply shadows and blur
For most graphic designers, drop shadows may no longer hold any significance in design. However, the trend is staying in UI design. You’ll see it applied on buttons so that you can draw the user or visitor’s attention to it.
Michael Malewicz writes in his ebook that shadows play a huge role in UI because it establishes hierarchy. The best practice in using shadows is to lighten the base color instead of using black. It puts too much contrast, and it won’t blend well. UI designers don’t commonly apply inner shadows, but it’s best to use for forms.
On the other hand, designers can employ different types of blurs. Malewicz enumerates four of them:
- Gaussian
- Motion
- Zoom
- Background
Gaussian is the widely used blur, while the Zoom one is rare.
13. Overlap elements
Designer Steve Schoger wrote a series of UI tips on his Twitter account. And one that stands out is overlapping elements and images. The reason he encourages this is for depth.
It will enable users to scroll more on the page. As for the images, he adds that a designer should include a border. He mentioned that it would look clean and distinctive.
14. Design in grayscale
To emphasize, you should always keep your users in mind. Not everyone sees color well. So, you have to bear in mind that some users are colorblind, as designer Lizzy Hillier wrote on eConsultancy. One way to address it is through contrast. She even listed resources to help designers:
- Color Oracle
- No Coffee
- Userway Contrast Checker
Another solution she provided was by substituting color with symbols or letters. To embellish an earlier tip in this article, icons would be the best alternative for scenarios like this.
Designing in grayscale can guide you in modifying elements like size, color, and text. Designer Erik Kennedy suggested that tip because it will help clean the website or app design.
15. Consider adding a search option
A search option would be helpful on any app or website. After all, even if users want to explore a site or app, a search field can guide them to a page they need to go to. UX expert Andrew Kucheriavy recommends that on websites, you should have the whole search box available. But on the app, the icon would do just fine.
16. Know when to break or group elements
You don’t want clutter on both website or app designs. And sometimes, you have to decide whether to include certain elements together or break them apart. UX Consultant Paul Boag suggested becoming mindful of that on any UI design. It’s to avoid overwhelming them or confusing them.
He presented an example by breaking text or categories. You can’t expect users to take in all information at once, especially when reading something through their smartphone or an app. Sure, you may have limited space and want to maximize it, but seek to simplify always.
You can expect that our designers will apply this tip and the others mentioned in this article. Check out what previous clients have said about the quality of work Penji provided for their business.
17. Use white space
UX experts Jerry Cao, Kamil Zieba, and Matt Ellis remind designers not to forget white space in UI design. They share their insights on a Fast Company article, saying it increases comprehension rates, clarifies relationships between elements, and catches user attention.
It improves comprehension because of text, in particular. To emphasize an earlier point in this article, you want to make sure that users won’t read a full block of text. White space goes further because it doesn’t take into account only the spaces between text, but the margins, columns, and graphics.
As for clarifying relationships, you can refer to breaking and grouping elements. Aside from that, it also relates to forms. For example, you have a form on the app or website, you want the relevant information near the forms. This way, it’s easier for the user to fill out a form or make some changes if necessary.
Finally, to catch user attention, white space can emphasize some elements (such as icons and graphics) and colors. This way, users will interact with buttons or other website elements.
Now you’ve read what experts say about UI design, check out this exclusive guide on how to request a design when you subscribe to Penji.
Requesting UI Design Through the Penji Platform
By subscribing to an unlimited graphic design service like Penji, you won’t waste time finding designers to fulfill your design projects. Upon sign-up, you get access to the Penji platform and submit your requests straight away! Follow this three-step process on requesting and receiving your designs on the all-in-one Penji platform.
Step 1: Create a Design Project
On the Penji platform, click on the New Project button. There, you’ll see a form where you need to fill in details of your project. Let’s go through this one-by-one.
So, you need to provide a Project title and select a Design category.
Tip: Type either App Design or Web Design on the Title, and a design type will pop-up. All you need to do is click on it.
So, let’s say you’re requesting a website design. You can choose among the available web pages. But if you can’t see the page you need, click on Custom page. Remember, you can only make one request per website or app page.
Once you choose a page, here’s where you can write your design project in detail. Make sure to follow the What to Include guidelines. This will help our designers understand your project and would reduce delays. Feel free to upload Attachments, if needed.
Once you’re done with that, click next, then choose Level of Customization, File Deliverables, and Associated Brand.
After that, click Create Project, then you’ll have your first active project on the Penji platform!
Penji then assigns a designer to work on your project. They will read about your design request and start working on it right away. You will then receive a draft within 24 to 48 hours.
Step 2: Review the Design
The designer will submit their first draft on the Penji platform for you to review.
On any Penji plan, you have unlimited revisions. Yep, you read that right. Unlimited revisions. Most graphic design services don’t offer that. Some would even charge a fee. Here at Penji, it’s part of your plan, so revise until you’re satisfied! You won’t pay extra. It’s why many brands love Penji.
Plus, we make it easy for you to point out revisions. Use the handy point-and-click feature. So, your designer will know how they can improve their work.
Step 3: Download the Design
Love the design? All you have to do is download it. Click the blue Download button, and it’s saved on your computer. That’s it! No need to access it from an external source or email.
Plus, you won’t have to worry about losing files too. Penji stores your designs on a cloud, so you can download it anytime you need it.
Wrap Up
The tips from the UI experts have guided designers to produce a usable and functional app or web design. It may seem overwhelming if you’re a non-designer. But you don’t have to stress over making the designs yourself. Penji has got your back. Subscribe to a Team plan for only $499/mo. Get access to ALL design projects such as illustrations, branding, advertisements, and more! No hidden fees. Request all you need for one affordable price. Sign up now and try the Penji platform 100% risk-free for 15 days!
