Vier Seiten Modell
Categories
School
·
Prototype
Year
2023
Duration
2 Week
Client
GBS
Overview
“Vier Seiten Modell” (Four-Sides Model) was a small prototype I created during my time at GBS to explain the four communication sides through an interactive, easy-to-use example. We were free to try anything we wanted, so my first idea was to experiment with something I was just getting to know: the hover effect in Figma.
What is the Four-Sides Model?
The Four-Sides Model explains that every message carries four layers at once: the factual information, what the speaker reveals about themselves, how they feel about the other person, and what they want to achieve or trigger with the message. It shows that communication is never just about words, but also about relationships, intentions, and self-expression.
Wireframes
For the wireframes, I created a few variants on how to display the four cards I wanted to work with, always trying to integrate an explanation alongside them. I experimented with layouts, sizes, and positions to see which arrangement made the interaction most intuitive. The goal was to make the user understand each layer of the Four-Sides Model without feeling overwhelmed, while keeping the design clean and interactive.
Interactions
For the hover effect, I designed the cards so they aren’t fully visible at first. When you hover over a card, it reveals the explanation of the layer, a matching color, and some small illustrations to help visualize the meaning. On the left side, you see the example text someone is sharing, and on the right corner, you see how the message can be understood depending on which layer is selected.
Final Visuals
The final result is a clean, interactive one-pager, designed with a dark mode to make the chosen colors pop. All elements are visible at a glance, and for more information on each layer, users can simply hover over the cards to reveal explanations and illustrations, making the Four-Sides Model both engaging and easy to understand.
Project Takeaways
Though a very short project, I was glad to experiment with new techniques in Figma and make them work effectively. I also enjoyed learning the Four-Sides Model and presenting it in a way that is intuitive and easy to understand.