Jak łamać zasady kompozycji?

Kompozycja - łączenie odrębnych elementów w spójną całość (nie skupiamy się na poszczególnych elementach.

ZASADY KOMPOZYCJI

1. Hierarchia - uporządkowanie obiektów w taki sposób, aby odbiorca widział je w odpowiedniej kolejności. Oparta na naturalnych schematach poznawczych np. czytamy od góry do dołu, od lewej do prawej (w kulturach zachodnich) albo od prawej do lewej np. mangi. Nasz mózg skanuje treści, nie czyta ich liniowo, dlatego tworząc hierarchię, szybciej naprowadzamy go na sens. https://www.canva.com/learn/visual-hierarchy/

Bardziej kontrastowy jest ważniejszy.

2. Równowaga i proporcje.

Mózg preferuje wizualny spokój, równowagę kojarzy z naturalnymi zjawiskami, zmysły nie są przeciążone. Brak równowagi powoduje niepokój, czasem dezorientację, ale także wprowadza wrażenie dynamiki.

Foundational UX Design Principles | Adobe XD Ideas

From foundational concepts to emerging trends, stay current on UX principles for app design, web design, and hci at Adobe XD Ideas.

IdeasNick Babich

Równowaga - takie rozłożenie elementów o podobnym ciężarze wizualnym, aby kompozycja nie była przeciążona na jednej stronie.

Warzywa na stole i w garnku – równowaga kompozycyjna - Warzywa na stole i w garnku – równowaga kompozycyjna - zpe.gov.pl

Materiał zawiera: scenariusz lekcji dla nauczyciela; cele w języku ucznia; informacje dotyczące: zasad równowagi kompozycyjnej, równowagi symetrycznej, równowagi asymetrycznej, przykładów działania różnych środków wyrazu i ich roli w tworzeniu kompozycji harmonijnych, ilustracje przedstawiające przykładykompozycji, w których równowagę uzyskano stosując takie elementów, jak: kształt, wielkość, położenie, kolor, faktura; 16 ilustracji obrazujących różnorodne układy kompozycyjne; 6 ćwiczeń interaktywnych (1 – polega na ułożeniu czterech jednoelementowych kompozycji w kolejności od tej, która zawiera element najlżejszy do tej, która zawiera element najcięższy; 2 – polega na zaznaczeniu jednej prawidłowej odpowiedzi spośród trzech i wybraniu kompozycji, która zwiera najwięcej najlżejszych elementów; 3 – polega na zaznaczeniu jednej prawidłowej odpowiedzi (spośród trzech), dotyczącej wskazania takich cech figur, które decydują o tym, że kompozycja z nich złożona wydaje się najlżejsza; 4 - polega na zaznaczeniu jednej prawidłowej odpowiedzi (spośród trzech), dotyczącej wskazania takich cech figur, które decydują o tym, że kompozycja z nich złożona wydaje się najlżejsza; 5 – polega na wybraniu (spośród 10) warzyw, z których można sporządzić zupę, ułożeniu ich na stole w taki sposób, aby kompozycja była zrównoważona pod względem układu i kolorystyki; 6 – polega na rozpoznaniu rodzaju równowagi przedstawionej na ilustracji i wskazaniu właściwej odpowiedzi; 7 – polega na uzupełnieniu tekstu dotyczącego postrzegania kolorów); 3 polecenia (1 – polega na przyjrzeniu się trzem pracom Izabelli Retkowskiej i zastanowieniu się, dlaczego te dzieła możemy uznać za kompozycje zrównoważone; 2 – polega na stworzeniu kompozycji symetrycznej korzystając z aplikacji Minipaint w taki sposób, aby elementy najcięższe znalazły się w centrum pracy, a najlżejsze najwyżej; 3 – polega na dodaniu do ilustracji dzieła nowych elementów w taki sposób, aby kompozycja nie była zrównoważona (przy pomocy aplikacji MiniPaint); słownik 2 pojęć (faktura, kompozycja);

zpe.gov.pl

Rodzaje równowagi:

SYMETRYCZNA (formalna) elementy po obu stronach są identyczne lub bardzo podobne.

ASYMETRYCZNA (dynamiczna) elementy są różne, ale zrównoważone wizualnie.

kolory ciepłe > barwy chłodne

kolor ciemny > barwa jaśniejsza

figura wypełniona wzorem > figura jednolita

Proporcja - wzajemna relacja wielkości między obiektami.

3. Kontrast i powtórzenie.

Foundational UX Design Principles | Adobe XD Ideas

From foundational concepts to emerging trends, stay current on UX principles for app design, web design, and hci at Adobe XD Ideas.

IdeasNick Babich

Kontrast (jasne - ciemne, duże-małe, cienkie-grube, nowoczesne-klasyczne fonty) - podkreśla różnice, używany jest do uwydatniania ważnych informacji. Przyciąga uwagę i tworzy strukturę.

Powtórzenie - wzmacnia spójność, porządek i rozpoznawalność w projekcie. Daje poczucie estetyki, rytm i przewidywalność.

—Z—A—D—A—N—I—E---

Twoim zadaniem jest zaprojektowanie lekkiego, bąbelkowego logotypu inspirowanego projektem PAKT dla Kobiet. Ma on oddawać radość z nauki, wspólnotę i energię grupy.

4. Punkt centralny - miejsce gdzie najpierw zatrzymuje się wzrok, element najbardziej przyciągający uwagę. Mózg odruchowo szuka punktów odniesienia, bez punktu centralnego mózg się "błąka" między punktami równoważnymi. Może być osiągnięty przez:

• rozmiar (największy element)
• kolor (kontrastowy do tła)
• nietypowy kształt
• pozycję centralną lub złoty podział

5. White Space - pusta przestrzeń wokół i między elementami graficznymi, pozwala na oddech i skupienie uwagi. Nasz mózg lepiej przetwarza informacje pogrupowane, oddzielone pustką. Pusta przestrzeń poprawia czytelność, daje wrażenie elegancji.

Ciekawe wykorzystanie white space.

Można wykorzystać do marginesów, odstępów między paragrafami, przerw między ikonami, tekstami, blokami.

6. Zasada trójpodziału - na siatce 3 na 3 najważniejsze elementy kompozycji powinny się znajdować na liniach podziału lub w punktach ich przecięcia.
7. Złoty podział (phi=1,618) - podział przestrzeni w obrazie, Witruwiusz.