Design Tips / How to master visual hierarchy in UI Design
Resource slide 1
Resource slide 2
Resource slide 3
Resource slide 4
Resource slide 5
Resource slide 6
Resource slide 7
Resource slide 8
Resource slide 9
Resource slide 10
How to master visual hierarchy in UI Design
How to master visual hierarchy in UI design 💥 --- Regardless of your expertise level, knowing basic design principles is a must. Back at the beginning of my studies, I was annoyed that we were concentrated so much on "theory stuff". But, of course, I later found out that without those basic principles good design cannot be achieved. 🙊 --- What is visual hierarchy? 👀 - Simply put, It is the way of organizing content in such a way that a consumer can easily comprehend the level of importance of each element. It is how we visually rank the design elements. Its also in what order we want users to see the information. 👓 --- Why is it important? 👀 - Without proper visual hierarchy, users will follow a predictable path and will potentially miss some important pieces of information. By assigning different visual characteristics to different objects, we can influence what users will perceive as more important. 💣 --- Importance of Gestalt psychology. 👀 - Visual hierarchy is initially based on Gestalt psychological theory which pays attention to the user's visual perception of elements. The theory proposes that the whole of an object or scene is more important than its parts. Gestalt was founded in the twentieth century by Max Wertheimer, Wolfgang Köhler, and Kurt Koffka. --- Visual hierarchy mostly (but not only) depends on the following 5 principles: - 1️⃣ Color 2️⃣ Size 3️⃣ Contrast 4️⃣ White space 5️⃣ Repetition --- What is your favorite design principle? Write your thoughts in the comment section below! 🙇 --- Follow @ognjen.cirovic for more UX/UI design tips! 💪