Unitate 7 / 11

Aspect și compoziție: Aspect, grilă și ierarhie vizuală

Câștiguri:

  • Abilitatea de a crea un aspect util cu principiile ierarhiei vizuale, alinierii, grilă, spațiere și punct focal
  • Producerea de imagini cu spații pentru text și realizarea de text editabil și plasare precisă în programul de proiectare
  • Capacitatea de a preveni riscul de tăiere și deșeuri prin aplicarea regulilor de format, cum ar fi zona sigură și sângerare de imprimare

Diferența dintre o imagine frumoasă și un design care funcționează este adesea aspectul: plasarea elementelor în cadrul paginii. Aspectul determină locul în care ochiul merge mai întâi pe un poster, dacă textul respiră pe o cartelă de socializare și modul în care informațiile circulă într-o broșură. În această unitate, vom afla principiile compoziției (aranjarea elementelor într-un întreg) și unde AI este utilă și limitată în acest proces. Fapt critic: AI produce imagini, dar aspectul precis este în mâinile designerului, într-un program de design.

De ce AI nu poate face aspectul singur?

AI produce o imagine holistică „arătătoare”; dar aspectul designului necesită precizie în pixeli, text editabil, aliniere și spațiere consistentă. Nu puteți muta textul, nu puteți alinia exact logo-ul sau nu puteți măsura marginea din imaginea produsă de AI. Deci fluxul profesional este acesta: generați elemente de fundal/vizuale cu AI, configurați aspectul (text, logo, aliniere) în programul de design. AI vă oferă materie primă și idee de compoziție; Amplasarea exactă este decizia dvs.

Principii de bază ale compoziției

  • Ierarhie vizuală: Aranjarea elementelor în ordinea importanței. Ochiul merge mai întâi la elementul cel mai mare/contrast. Se stabilește ordinea titlului > subtitlului > corpului > detaliului.
  • Alinierea: Aranjarea elementelor după linii invizibile; Previne mizerie și dă o senzație de ordine.
  • Grilă: Sistem care împarte pagina în coloane și rânduri invizibile; Asigură plasarea consecventă a articolelor.
  • Spațiu alb (spațiu negativ): spațiul gol dintre elemente; Permite designului să „respire” și să fie lizibil. Spațiu mic = înghesuit și amator.
  • Echilibrul: Distribuția greutății vizuale; Poate fi simetric (liniștit) sau asimetric (dinamic).
  • Contrast: Dirijarea atenției prin diferența de mărime, culoare sau grosime.
  • Punct focal: primul loc în care merge ochiul; trebuie proiectat în mod conștient.
Sfat: când creați imagini, spuneți „lăsați spațiu pentru text” (de exemplu, „treimea de sus este goală, simplă”) la solicitare. În acest fel, nu veți rămâne blocat atunci când adăugați text la vizualul AI ​​mai târziu și puteți stabili o ierarhie.

Configurați un aspect pas cu pas

  1. Determinați scopul: Ce ar trebui să facă acest design? (anunț, vânzare, informare). Determină ordinea de prioritate.
  2. Inventar de conținut: care sunt titlul, textul alternativ, imaginea, sigla, apelul (buton/CTA)?
  3. Stabiliți o ierarhie: Puneți cel mai important element în cea mai puternică poziție și dimensiune.
  4. Selectați grila: Determinați structura coloanei în care veți alinia elementele.
  5. Generați imaginea cu AI: generați fundal/element cu proporții adecvate, cu spațiu pentru text.
  6. Align in program de proiectare: Align text, logo, call; stabiliți spațiile.
  7. Test: Măriți, priviți de departe, verificați unde merge primul ochiul.

Tehnici practice de dirijare a ochiului

Compoziția este de fapt arta de a dirija ochiul. Privirea privitorului nu rătăcește la întâmplare; Urmează anumite semne și un designer bun le folosește în mod conștient. Primul este dimensiunea și contrastul: elementul cel mai mare și cel mai contrastant atrage privirea primul, așa că puneți acolo cel mai important mesaj. Al doilea este liniile directoare: liniile naturale din imagine (o cale, întinderea unui braț, marginea unei mese) duc ochiul într-un anumit punct; Plasarea produsului sau a titlului unde se termină aceste linii crește efectul. În al treilea rând, accent pe spațiu: spațiul gol mare din jurul unui element face ca acel element să iasă în evidență - un cuvânt care stă singur pe o pagină aglomerată este puternic. În al patrulea rând, direcția de citire: în majoritatea culturilor, ochiul călătorește într-un model „Z” sau „F” din stânga sus la dreapta jos; deci punerea siglei în stânga sus și a apelului (butonului) în dreapta jos creează un flux intuitiv. Puteți aduce aceste tehnici la promptul dvs. atunci când produceți fundalul cu AI: „o compoziție care direcționează din stânga jos spre dreapta sus” sau „un singur element în centru, spațiu larg în jurul ei”, etc. Astfel, imaginea devine nu numai frumoasă, ci și un instrument care transmite mesajul în ordinea corectă.

Format - atenție deosebită

Fiecare mediu are propria sa regulă: postare pe Instagram 1:1 sau 4:5, poveste 9:16, banner web 16:9. Conceptul de zonă sigură este important: păstrați elementele importante din margine, astfel încât să nu fie tăiate sau sub elemente de interfață (profil în poveste, butoane). La imprimare, este necesară o curățare: să extindeți puțin designul de la margine pentru a evita liniile albe în marginea de tăiere.

trei mini cutii

Cazul 1 — Design respirabil. Cartea de campanie a unui designer era înghesuită; titlul, textul și sigla au fost amestecate. El a reprodus imaginea cu „treimea de sus goală” și a plasat textul în acel spațiu într-o ierarhie. Rata de clic a crescut semnificativ în grupul de testare; A venit feedback „lizibil”.

Cazul 2 — Eroare zonă sigură. Într-un design de poveste, sloganul important era în partea de jos; A fost ascuns sub butonul „defilare” din difuzare și nu a apărut. Cu regula zonei sigure, sloganul a fost plasat sus și la mijloc. În campania ulterioară, mesajul a fost clar și nu a fost necesară o reproiectare.

Cazul 3 — Print bleed. O broșură a fost tipărită fără sângerare; Pe margini au apărut linii albe subțiri și au fost casate 300 de bucăți (aproximativ 1.200 TL pierdute). Următoarea lucrare a adăugat 3 mm de scurgere la design; Taietura a iesit curata.

Șabloane copiabile

1) Generarea unui fundal spațiat pentru text:

Generați o imagine de fundal pentru un design [media]. Raport: [1:1 / 9:16 / 16:9]. Păstrați treimea superioară simplă și goală (pentru titlu). Tonul mărcii: [adjective]. Pune text/logo lizibil. Culorile se potrivesc cu paleta: [culori].

2) Planul ierarhic:

Creați un plan de ierarhie vizuală pentru următorul design. Scop: [anunț/vânzări/informații]. Elemente: [titlu, text alternativ, imagine, logo, înștiințare]. Dați fiecărui element o ordine de importanță, poziția sugerată și dimensiunea relativă. Descrieți calea pe care ochiul o va urma (focal → secundar).

3) Recomandări de grilă și aliniere:

Sugerați o grilă simplă și o schemă de aliniere pentru următorul conținut: [lista de conținut], raport [x]. Câte coloane ar trebui să folosesc, cum ar trebui să aliniez elementele, cât spațiu (marja) ar trebui să las? Păstrați-l simplu și echilibrat.

4) Controlul aspectului:

Evaluați următoarea declarație de design în ceea ce privește compoziția: este ierarhia clară, este alinierea consecventă, există suficient spațiu alb, se încadrează în spațiul sigur, este clar punctul focal? Răspundeți ca sugestie.Descriere: [paste]

Prompt slab / Prompt puternic

Slab: faceți o imagine banner cu reduceri și spuneți 50%.

Rezultat: AI scrie corupt „50%”, elementele sunt aranjate aleator, nu puteți edita textul; nu poate fi folosit.

Puternic: produceți o imagine de fundal pentru o campanie de vânzare: raport 4:5, tonuri energice calde, spațiu mare simplu pentru text în stânga sus, produs în dreapta jos. punerea textului lizibil; Voi alinia titlul, informațiile „50%” și butonul din programul de design.

Rezultatul: un fundal editabil, ierarhic, care lasă loc pentru text.

Diferență: Abordarea puternică separă textul de AI, planifică spațierea și proporția și lasă aspectul în seama designerului.

Tabelul principiilor de compunere

principiu

Ceea ce prevede

Sfat practic

ierarhie

Ordinea de citire

Faceți cel mai important cel mai mare/contrast

aliniere

simțul ordinii

Aliniați linii invizibile

grilă

Consecvență

Utilizați sistemul de coloane

spatiu

Lizibilitate

Compresie, eliberare de respirație

zonă sigură

nu tăierea

Păstrați obiectele din margine

Sângerează

imprimare curată

Are marginea cu 3 mm

Greșeli comune

  • Imprimarea textului către AI: text corupt, needitabil; Adăugați textul în programul de proiectare.
  • Fără a lăsa spațiu: design înghesuit, cu aspect amator.
  • Fără ierarhie: totul are aceeași dimensiune; Ochiul nu știe încotro să meargă.
  • Uitarea zonei sigure: elementul important rămâne blocat sub interfață sau tăiere.
  • Omiterea sângerării: marginea albă și resturile la imprimare.

Pe scurt

Aspectul este plasarea deliberată a elementelor și transformă o imagine într-un design viabil. Ierarhia, alinierea, grila, spațiul, echilibrul și contrastul sunt principiile de bază. AI produce elemente de fundal și vizuale, oferă idei de compoziție; dar aspectul precis la pixeli, textul editabil și alinierea sunt în mâinile designerului în programul de proiectare. Permiterea spațiului pentru text, spațiul sigur și curgerea tipăririi sunt reguli generale care determină capacitatea de utilizare a rezultatelor.

Sarcina de aplicare

Alegeți un mediu și un scop (de exemplu, postarea de vânzare pe Instagram). Faceți un inventar de conținut, faceți un plan ierarhic. Generați un fundal proporțional corect cu spațiu pentru text cu AI. Apoi aliniați și plasați titlul, textul alternativ, sigla și înștiințarea într-un program de proiectare (sau ca o schiță pe hârtie). Testați unde ajunge ochiul mai întâi mărind și privind de la distanță și observați-l.

lista de verificare

  • [ ] Am stabilit scopul și inventarul de conținut.
  • [ ] Am stabilit un plan de ierarhie vizuală.
  • [ ] Am produs imaginea cu spațiu pentru text și proporția corectă.
  • [ ] Am aliniat textul și elementele din programul de proiectare.
  • [ ] Am observat zona sigură și marginea de sângerare (dacă se imprima).
  • [ ] L-am făcut mai mic și am testat punctul de focalizare.