Psychology principles that balancing aesthetic and usability in interface design — Part 2
If you haven’t read the Part 1 of Psychology principles that balancing aesthetic and usability in interface design, you should read it first to get the whole context.
#6: Simplicity — Human eyes tend to see elements in the simplest form.
Personally, I am a fan of simplicity design. Though at one point I realized that we couldn’t make it too simple otherwise our users will get confused. They will end up with having difficulties to understand our design.
But I always strive to put simplicity as one of my values when designing.
I ask myself how I can make it simpler for that or this section. Then the next question would be, will the reduction screw the users.
The simplest way to achieve simplicity is through thoughtful reduction — John Maeda
I am not sure this example would be proper. You know the Google Material form right? They use a line for the text field instead of a box. I think either line or box, users still see it as something where they can input texts/numbers.
A text field with a single line is the simple version of the box.
However, I always consider it first because there are some people still don’t get used with the single line text field.(seriously that happens) — And most of my projects end up with something like this…
#7 Symmetry — Human eyes see symmetrical elements as one group.
Most of the layout in interface design is always in a symmetrical balance. If we make elements asymmetrical with other elements, sure it’s because we want to separate them into different groups.
Because we are accustomed to thinking a symmetric layout so sometimes we make the elements that should be in different groups or perhaps it has a different meaning, in a symmetrical balance.
Do you see the “legal” section?
Quora is right on making the height of the section smaller. Because if they make it symmetrical like the other lists (see the right screen — edited version), that will mislead users, perhaps they think it can be pressed too.
#8 Parallelism — Human eyes tend to see that elements that are parallel to each other are more related than elements are not.
I feel that recently there are a lot of apps using not-parallel layout to separate two different contents.
If human eyes can recognize two different contents that are not parallel as different groups. I think we don’t need to give more cosmetic to make groups that are not parallel look different.
These apps give a good example of parallelism principle. They make it very simple — And it works without any additional element to separate the vertical content and horizontal one.
#9 Continuity — Human eyes tend to consider elements that are arranged in a continuous way as one group.
As far as I understand, continuity principle quite related to other principles such as symmetry and similarity. By creating elements that are similar and in a symmetrical balance, we are applying the continuity principle as well.
In continuity, even the elements are overlapped by other elements or truncated due width/height of the screen; we can still consider the truncated element as one group.
Some examples:
You notice there are truncated elements in the examples above. Even though the truncated elements are small, we still consider it as one group with other elements that are arranged in parallel.
#10 Past Experience — Human eyes tend to see elements with the previous experience they might have.
Some of the sources say that past experience principle is not included in Gestalt Psychology or some say its the weakest one. But past experience reasonably related to the user experience. This is a perception that arises due to previous experiences.
That’s the reason why some mobile apps choose to use native elements — Or they just copy design patterns from popular apps. In that way, users will have a low learning curve when they use our app for the first time.
In other cases of past experience principle, if you change an element, let say Instagram moves the upload photo button to the right end.
I know this is ridiculous. Ha!
For sure there will be some people who are still pressing the middle button for uploading photos. Some people will feel annoyed with the change, the reason is simple, not accustomed to it.
Past experience should be your consideration when you do a redesign project. Well, it’s never easy as creating a new one. Many things to consider.
One of the principles that I didn’t include is Closure principle. Closure principle states that people perceive elements as a whole when they are not complete. When there are missing elements, our perception fills the empty parts.
In my opinion, it’s more like an assumption. The Closure principle may produce 2 or more different perceptions. When designing interfaces, it should be clear enough for users. Don’t make them assume because of we design ambiguous elements.
If you have any idea about how we use closure principle in interface design, please share in the comment section below.
Thanks for reading!
Anyway, I took the app screenshots from pttrns.com. Thanks, Robin Raszka!
Like the article? Share some love 💚
