The use of psychology in UI/UX design

Written by Yiling 2022 Cohort

On the first day, I self-studied in UI/UX; I looked through many guidelines and standard websites like Mobbin and Material Design to learn how to adjust line space, design a button, organize form questions and decide the most readable text size. Back then, UI/UX was more about guidelines, specification and pixel-perfection. While these parts are still vital, some knowledge is even more essential, for instance, behaviour patterns of users, psychology and implementation, business sense and professional ethics etc. In this journal, I would like to talk more about the use of psychology in UI/UX design and provide some examples to support these theories.

When we design a vital button or any interactive element, we always make it larger and closer to the user since it feels more reachable. It does sound like common sense or basic human instinct, but designers need to remember it frequently. Sometimes we make the call-to-action button small and further since it is more visually appealing. However, according to Fitts’s Law, which states that the time to acquire a target is a function of the distance to and size of the target, a critical button should be as large and as close to the user as possible.

Another example is the cascading menu, a long list menu with many subcategories and complex hierarchies. Users should navigate precisely to get to their destination, and usually, it is frustrating and tricky. The Steering Law, a movement prediction model, explains why this happens.  The theory shows that it takes us more time to move a pointer, for example, a mouse through a narrow tunnel, so the relationship between the tunnel’s width and the movement’s time is inverse. Therefore, to practically implement this theory, when we design a cascading menu, use padding to make the channel wider and introduce a slight delay before opening up a subcategory.

The final psychological fact is using animation cautiously. Since human pays much more attention to moving objects for a revolutionary reason, it means that whenever a moving object shows up in your design, it would attract users’ attention and distract them from the current task flow, so determine how important the information is conveyed by animation and use animation wisely.

These are a few typical psychological fun facts implemented in UI/UX design, and we can tell how theories influence design decisions. It solidifies the foundation of UX design thinking.