Principles of UX UI

Thuong To
3 min readNov 14, 2023

--

This reading recaps some of the key concepts explained previously in relation to the principles of UX UI. It guides developers on the basic rules of designing good interfaces for apps.

Following these guidelines ensures that you approach designing apps correctly. And with imagination and creativity, you’ll develop apps in no time.

Digital Device Interfaces

Recall that a mobile user interface is a graphical surface, generally sensitive to touch, allowing the user to interact with the device. In terms of interfaces, devices are divided into two categories:

  • Standard computers that use non-touch interfaces and a mouse as a controller.
  • Touch devices that have touch interfaces and use the user’s finger as the controller.

Non-touch interfaces, such as standard computers, are generally larger in size compared to a touch interface. Using a mouse as a controller increases precision, compared to the user’s finger navigating a small interface.

For that reason, the first rule for designing good interfaces for touch screens is that all controls such as buttons, sliders, and checkboxes, have to be bigger in size because they are controlled by fingers. Apple, for example, recommends that the target area of controls must be no less than 44x44 points.

Because touch interfaces are smaller, a golden rule of good UX UI design is to use the space wisely. The focus is to display just the essential information. Do not cram the interface with a lot of controls and text.

Breaking Down UI of an Example App

To help you understand what makes for good UI in an app, consider what professional and aspiring audio engineers would need from a digital audio workstation.

While engineers may do much of their work on a computer or laptop, it’s also quite common that they’d like to get things away from the studio, which typically means shifting their productivity over to a mobile device.

In this case, an example of poor UI practice would be porting the desktop app directly over to a tablet as-is. This is because audio editing software is often complex in a way that works with the larger screens and multiple modes of interaction offered by a computer, but does not lend itself well to the smaller, touch-based interface of a tablet.

So what would be a good solution to this? A well-designed app might drop certain features for the mobile version, particularly those which are cumbersome on a touchscreen. This means the mobile app wouldn’t have 100% of the functionality of the desktop app, but it would keep the core experience intuitive and enjoyable.

This is how you create a good user experience. When designing for different devices, it is important to note that a key consideration is not just screen size, but also factors such as processing speed and memory capabilities.

So what should you keep in mind when incorporating color into your app design?

Color combinations should enhance the user’s experience by making the content legible and easy to interact with. Avoid color combinations that conflict with one another or strain the eye. The color selection must suit the operation the user should complete. It is preferable to color a destructive operation red instead of green, for example.

Interface Guidelines

Apple created a document called Human Interface Guidelines that cover the key aspects of creating interfaces that can adapt to a variety of sizes and for controlling devices. It outlines best practices for good user experience and user interface design.

On the other hand, Android created an open-source set of guidelines for user interfaces called Material Design. It highlights a design system used to build beautiful, aesthetic products.

Conclusion

In this reading, you’ve recapped the key aspects of good interface design that ultimately offers users a good user experience.

By adhering to the guidelines, you can apply the best approach to start creating apps that users find easy, clear and enjoyable to use.

--

--

Thuong To
Thuong To

No responses yet