Vienība 7 / 11

Izkārtojums un sastāvs: izkārtojums, režģis un vizuālā hierarhija

Ieguvumi:

  • Spēja izveidot noderīgu izkārtojumu ar vizuālu hierarhiju, izlīdzināšanu, režģi, atstarpi un fokusa punkta principiem
  • Vizuālu attēlu veidošana ar atstarpēm tekstam un rediģējama teksta un precīza izvietojuma izveide dizaina programmā
  • Spēja novērst apgriešanas un lūžņu risku, piemērojot formāta noteikumus, piemēram, drošo zonu un drukas aizplūšanu

Atšķirība starp skaistu attēlu un dizainu, kas darbojas, bieži vien ir izkārtojums: elementu izvietojums lapā. Izkārtojums nosaka, kur plakātā acs vispirms vēršas, vai teksts elpo sociālo mediju kartē un kā informācija plūst brošūrā. Šajā nodaļā mēs apgūsim kompozīcijas principus (elementu sakārtošanu kopumā) un to, kur AI šajā procesā ir noderīgs un ierobežots. Kritisks fakts: AI ražo vizuālos attēlus, bet precīzs izkārtojums ir dizainera rokās, dizaina programmā.

Kāpēc mākslīgais intelekts nevar veikt izkārtojumu viens pats?

AI rada holistisku “laba izskata” attēlu; bet dizaina izkārtojums prasa pikseļu precizitāti, rediģējamu tekstu, līdzinājumu un konsekventu atstarpi. Jūs nevarat pārvietot tekstu, precīzi līdzināt logotipu vai izmērīt piemales attēlā, ko rada AI. Tātad profesionālā plūsma ir šāda: ģenerējiet fona/vizuālos elementus ar AI, iestatiet izkārtojumu (tekstu, logotipu, līdzinājumu) dizaina programmā. AI sniedz izejmateriālu un kompozīcijas ideju; Precīzs izvietojums ir jūsu lēmums.

Kompozīcijas pamatprincipi

  • Vizuālā hierarhija: elementu sakārtošana svarīguma secībā. Acs vispirms iet uz lielāko/kontrastējo elementu. Ir noteikta secība virsraksts > apakšvirsraksts > pamatteksts > informācija.
  • Izlīdzināšana: elementu sakārtošana pēc neredzamām līnijām; Tas novērš nekārtību un rada kārtības sajūtu.
  • Režģis: sistēma, kas sadala lapu neredzamās kolonnās un rindās; Nodrošina konsekventu priekšmetu izvietojumu.
  • Atstarpe (negatīvā atstarpe): tukša vieta starp elementiem; Tas ļauj dizainam "elpot" un būt lasāmam. Maz vietas = šauri un amatieru.
  • Līdzsvars: vizuālā svara sadalījums; Tas var būt simetrisks (kluss) vai asimetrisks (dinamisks).
  • Kontrasts: vērš uzmanību pēc izmēra, krāsas vai biezuma atšķirībām.
  • Fokusa punkts: pirmā vieta, kur acs iet; jāveido apzināti.
Padoms. Veidojot attēlus, uzvednē sakiet "atstājiet vietu tekstam" (piemēram, "augšējā trešdaļa ir tukša, vienkārša"). Tādā veidā jūs neiestrēgsit, vēlāk pievienojot tekstu AI vizuālajam attēlam, un jūs varat izveidot hierarhiju.

Soli pa solim iestatiet izkārtojumu

  1. Nosakiet mērķi: ko šim dizainam vajadzētu darīt? (sludinājums, izpārdošana, informācija). Nosaka prioritāšu secību.
  2. Satura krājumi: kas ir nosaukums, alternatīvais teksts, attēls, logotips, zvans (poga/CTA)?
  3. Izveidojiet hierarhiju: novietojiet vissvarīgāko elementu spēcīgākajā pozīcijā un izmērā.
  4. Atlasīt režģi: nosakiet kolonnas struktūru, kurā līdzināsit elementus.
  5. Ģenerēt attēlu, izmantojot AI: ģenerējiet fonu/elementu ar atbilstošām proporcijām, atstājot vietu tekstam.
  6. Izlīdzināt dizaina programmā: Līdzināt tekstu, logotipu, zvanu; iestatiet atstarpes.
  7. Tests: pietuviniet, skatieties no tālienes, pārbaudiet, kur acs vēršas vispirms.

Praktiski paņēmieni acs virzīšanai

Kompozīcija patiesībā ir māksla virzīt aci. Skatītāja skatiens neklīst nejauši; Tas seko noteiktām zīmēm, un labs dizainers tās apzināti izmanto. Pirmkārt, izmērs un kontrasts: lielākais un kontrastējošākais elements vispirms piesaista uzmanību, tāpēc ievietojiet svarīgāko vēstījumu. Otrais ir vadošās līnijas: attēla dabiskās līnijas (ceļš, rokas stiepiens, galda mala) ved aci uz noteiktu punktu; Produkta vai nosaukuma novietošana vietā, kur beidzas šīs līnijas, palielina efektu. Treškārt, uzsvars uz vietu: liela tukša vieta ap elementu izceļ šo elementu — vārds, kas stāv viens pārpildītā lapā, ir spēcīgs. Ceturtkārt, lasīšanas virziens: lielākajā daļā kultūru acs pārvietojas pa "Z" vai "F" modeli no augšējās kreisās puses uz apakšējo labo pusi; tāpēc logotipa ievietošana augšējā kreisajā stūrī un zvans (poga) apakšējā labajā stūrī rada intuitīvu plūsmu. Veidojot fonu ar mākslīgo intelektu, varat izmantot šādus paņēmienus: "kompozīcija, kas virza no apakšējās kreisās puses uz augšējo labo pusi" vai "viens elements centrā, plaša telpa ap to" utt. Tādējādi attēls kļūst ne tikai skaists, bet arī rīks, kas nodod vēstījumu pareizajā secībā.

Formāts - īpaša uzmanība

Katram medijam ir savs noteikums: Instagram ziņa 1:1 vai 4:5, stāsts 9:16, tīmekļa reklāmkarogs 16:9. Drošās zonas jēdziens ir svarīgs: turiet svarīgus elementus no malas, lai tie netiktu apgriezti vai zem saskarnes elementiem (profils stāstā, pogas). Drukāšanā ir nepieciešama noplūde: lai zīmējumu nedaudz pagarinātu no malas, lai izvairītos no baltām līnijām griezuma malā.

trīs mini futrāļi

1. gadījums — elpojošs dizains. Viena dizainera kampaņas karte bija šaura; nosaukums, teksts un logotips tika sajaukti kopā. Viņš atveidoja attēlu ar “augšējo trešdaļu tukšu” un ievietoja tekstu šajā vietā hierarhijā. Vidējais klikšķu skaits testa grupā ievērojami palielinājās; nāca "lasāmas" atsauksmes.

2. gadījums — drošās zonas kļūda. Stāsta noformējumā svarīgais sauklis bija apakšā; Raidījumā tas bija paslēpts zem pogas "ritināt" un neparādījās. Izmantojot drošās zonas noteikumu, sauklis tika novietots uz augšu un pa vidu. Nākamajā kampaņā vēstījums bija skaidrs, un nebija nepieciešama pārprojektēšana.

3. gadījums — drukāšanas noplūde. Brošūra tika izdrukāta bez noplūdes; uz malām parādījās plānas baltas līnijas un 300 gabali tika sagriezti metāllūžņos (aptuveni 1200 TL zaudēti). Nākamais darbs dizainam pievienoja 3 mm noplūdi; Griezums iznāca tīrs.

Kopējamas veidnes

1) ģenerējiet tekstam atdalītu fonu:

Ģenerējiet fona attēlu [multivides] dizainam. Attiecība: [1:1 / 9:16 / 16:9]. Augšējā trešdaļa turi būt vienkārša un tukša (virsrakstam). Zīmola tonis: [īpašības vārdi]. Salasāma teksta/logotipa ievietošana. Krāsas atbilst paletei: [krāsas].

2) Hierarhijas plāns:

Izveidojiet vizuālo hierarhijas plānu šādam dizainam. Mērķis: [paziņojums/pārdošana/informācija]. Elementi: [nosaukums, alternatīvais teksts, attēls, logotips, norāde]. Norādiet katram elementam svarīguma secību, ieteicamo pozīciju un relatīvo izmēru. Aprakstiet ceļu, kuru acs ies (fokālais → sekundārais).

3) Režģa un izlīdzināšanas ieteikums:

Iesakiet vienkāršu režģi un izlīdzināšanas shēmu šādam saturam: [satura saraksts], attiecība [x]. Cik kolonnu vajadzētu izmantot, kā izlīdzināt elementus, cik daudz vietas (maržas) atstāt? Saglabājiet to vienkāršu un līdzsvarotu.

4) Izkārtojuma vadība:

Novērtējiet šādu dizaina apgalvojumu attiecībā uz sastāvu: vai hierarhija ir skaidra, vai izlīdzinājums ir konsekvents, vai ir pietiekami daudz baltās vietas, vai tas iekļaujas drošajā telpā, vai fokusa punkts ir skaidrs? Atbildiet kā ieteikumu.Apraksts: [ielīmēt]

Vāja uzvedne / spēcīga uzvedne

Vāji: izveidojiet atlaides reklāmkaroga attēlu un sakiet 50%.

Rezultāts: AI raksta bojātu "50%", elementi ir sakārtoti nejauši, jūs nevarat rediģēt tekstu; nevar izmantot.

Jaudīgi: izveidojiet fona attēlu izpārdošanas kampaņai: attiecība 4:5, silti, enerģiski toņi, liela brīva vieta tekstam augšējā kreisajā stūrī, produkts apakšējā labajā stūrī. Lasāma teksta ievietošana; Noformēšanas programmā sakārtošu virsrakstu, "50%" informāciju un pogu.

Rezultāts: rediģējams, hierarhisks fons, kas atstāj vietu tekstam.

Atšķirība: spēcīga pieeja atdala tekstu no AI, plāno atstarpi un proporcijas un atstāj izkārtojumu dizainera ziņā.

Kompozīcijas principu tabula

principu

Kas nodrošina

Praktisks padoms

hierarhija

Lasīšanas secība

Padariet svarīgāko par lielāko/kontrastāku

izlīdzināšana

kārtības sajūtu

Sakārtojiet neredzamās līnijas

režģis

Konsekvence

Izmantojiet kolonnu sistēmu

telpa

Lasāmība

Saspiešana, atlaidiet elpošanu

drošā zonā

negriežot

Glabājiet priekšmetus no malas

Asiņot

tīra druka

Tas nes malu par 3 mm

Biežas kļūdas

  • Teksta drukāšana AI: bojāts, nerediģējams teksts; Pievienojiet tekstu dizaina programmā.
  • Neatstāj vietu: šaurs, amatieriska izskata dizains.
  • Nav hierarhijas: viss ir vienāda izmēra; Acs nezina, kur iet.
  • Aizmirstot drošo zonu: svarīgs elements iestrēgst zem saskarnes vai izgriezuma.
  • Izlaižot noplūdi: mala balta un drukas lūžņi.

Rezumējot

Izkārtojums ir apzināta elementu izvietošana un pārveido attēlu praktiski izmantojamā dizainā. Hierarhija, izlīdzināšana, režģis, telpa, līdzsvars un kontrasts ir pamatprincipi. AI ražo fona un vizuālos elementus, sniedz kompozīcijas idejas; bet pikseļu precīzs izkārtojums, rediģējams teksts un izlīdzināšana ir dizainera rokās projektēšanas programmā. Vietas atļaušana tekstam, droša vieta un drukas aizplūde ir īkšķa noteikumi, kas nosaka izvades lietojamību.

Lietojumprogrammas uzdevums

Izvēlieties līdzekli un mērķi (piemēram, Instagram izpārdošanas ziņa). Veikt satura inventarizāciju, sastādīt hierarhijas plānu. Izmantojot AI, ģenerējiet pareizi proporcionālu fonu ar vietu tekstam. Pēc tam izlīdziniet un ievietojiet virsrakstu, alternatīvo tekstu, logotipu un norādi dizaina programmā (vai kā skici uz papīra). Pārbaudiet, kur acs iet vispirms, tuvinot un skatoties no attāluma, un atzīmējiet to.

kontrolsaraksts

  • [ ] Noteicu mērķi un satura inventarizāciju.
  • [ ] Es izveidoju vizuālo hierarhijas plānu.
  • [ ] Es izveidoju attēlu ar vietu tekstam un pareizo proporciju.
  • [ ] Es saskaņoju tekstu un elementus dizaina programmā.
  • [ ] Es novēroju drošo zonu un noplūdes robežu (ja tā bija drukāšana).
  • [ ] Es to samazināju un pārbaudīju fokusa punktu.