Dobici:
- Sposobnost stvaranja korisnog izgleda s načelima vizualne hijerarhije, poravnanja, mreže, razmaka i žarišne točke
- Izrada vizuala s prostorom za tekst i izrada teksta koji se može uređivati i precizno postavljanje u program za dizajn
- Sposobnost sprječavanja rizika od izrezivanja i otpada primjenom pravila formata kao što su sigurno područje i ispisni izmak
Razlika između lijepe slike i dizajna koji funkcionira često je izgled: položaj elemenata unutar stranice. Izgled određuje gdje će prvo upasti pogled na posteru, hoće li tekst disati na kartici društvenih medija i kako informacije teku u brošuri. U ovoj jedinici naučit ćemo principe kompozicije (slaganje elemenata u cjelinu) i gdje je umjetna inteligencija korisna, a gdje ograničena u ovom procesu. Kritična činjenica: AI proizvodi vizualne elemente, ali precizan izgled je u rukama dizajnera, u dizajnerskom programu.
Zašto umjetna inteligencija ne može sama napraviti raspored?
AI proizvodi holističku sliku "dobrog izgleda"; ali izgled dizajna zahtijeva preciznost piksela, tekst koji se može uređivati, poravnanje i dosljedan razmak. Ne možete pomaknuti tekst, točno poravnati logotip ili izmjeriti marginu na slici koju proizvodi AI. Dakle, profesionalni tijek je sljedeći: generirajte pozadinske/vizualne elemente pomoću umjetne inteligencije, postavite izgled (tekst, logotip, poravnanje) u programu za dizajn. AI vam daje ideju o sirovom materijalu i sastavu; Točan položaj je vaša odluka.
Osnovni principi kompozicije
- Vizualna hijerarhija: raspored elemenata po važnosti. Oko prvo ide na najveći/kontrastni element. Uspostavljen je redoslijed naslov > podnaslov > tijelo > detalj.
- Poravnanje: Raspoređivanje elemenata prema nevidljivim linijama; Sprječava nered i daje osjećaj reda.
- Mreža: Sustav koji stranicu dijeli na nevidljive stupce i retke; Osigurava dosljedno postavljanje predmeta.
- Prazan prostor (negativni prostor): prazan prostor između elemenata; Omogućuje dizajnu da "diše" i bude čitljiv. Malo prostora = skučeno i amaterski.
- Ravnoteža: Distribucija vizualne težine; Može biti simetrična (tiha) ili asimetrična (dinamična).
- Kontrast: Usmjeravanje pažnje razlikom u veličini, boji ili debljini.
- Središnja točka: Prvo mjesto na koje oko ide; mora biti osmišljen svjesno.
Savjet: kada stvarate slike, recite "ostavi prostor za tekst" (npr. "gornja trećina je prazna, obična") na upit. Na taj način nećete zapeti pri kasnijem dodavanju teksta u AI vizual i možete uspostaviti hijerarhiju.
Postavite izgled korak po korak
- Odredite svrhu: Što bi ovaj dizajn trebao činiti? (najava, prodaja, informacija). Određuje redoslijed prioriteta.
- Inventar sadržaja: Što su naslov, alternativni tekst, slika, logotip, poziv (gumb/CTA)?
- Uspostavite hijerarhiju: Postavite najvažniji element na najjaču poziciju i veličinu.
- Odaberite rešetku: Odredite strukturu stupca u kojem ćete poravnati elemente.
- Generiraj sliku pomoću umjetne inteligencije: Generiraj pozadinu/element s odgovarajućim proporcijama, s prostorom za tekst.
- Poravnaj u programu za dizajn: Poravnaj tekst, logo, poziv; postavite razmake.
- Test: Zumirajte, gledajte izdaleka, provjerite kamo oko ide prvo.
Praktične tehnike usmjeravanja pogleda
Kompozicija je zapravo umijeće usmjeravanja oka. Pogled gledatelja ne luta nasumično; Slijedi određene znakove i dobar dizajner ih svjesno koristi. Prvo su veličina i kontrast: najveći i najkontrastniji element prvi privlači poglede, stoga tu postavite najvažniju poruku. Drugo su vodeće linije: prirodne linije na slici (put, doseg ruke, rub stola) vode oko do određene točke; Postavljanje proizvoda ili naslova tamo gdje ovi redovi završavaju povećava učinak. Treće, naglasak razmakom: veliki prazan prostor oko elementa čini da se taj element ističe - riječ koja stoji sama na pretrpanoj stranici je moćna. Četvrto, smjer čitanja: u većini kultura, oko putuje u "Z" ili "F" obrascu od gornjeg lijevog do donjeg desnog; tako da stavljanje logotipa u gornji lijevi i poziv (gumb) u donji desni kut stvara intuitivan tijek. Možete unijeti ove tehnike u svoj red kada stvarate pozadinu pomoću AI: "kompozicija koja usmjerava od donjeg lijevog do gornjeg desnog" ili "jedan element u sredini, širok prostor oko njega", itd. Tako slika postaje ne samo lijepa, već i alat koji prenosi poruku u pravom redoslijedu.
Format - posebna pozornost
Svaki medij ima svoje pravilo: Instagram objava 1:1 ili 4:5, priča 9:16, web banner 16:9. Koncept sigurne zone je važan: važne elemente držite s ruba tako da ne budu podrezani ili ispod elemenata sučelja (profil u priči, gumbi). U ispisu je potreban bleed: da se dizajn malo produži od ruba kako bi se izbjegle bijele linije na rubu rezanja.
tri mini kućišta
Slučaj 1 — Prozračni dizajn. Kartica kampanje jednog dizajnera bila je skučena; naslov, tekst i logotip bili su pomiješani. Reproducirao je sliku s "gornjom trećinom praznom" i smjestio tekst u taj prostor u hijerarhiji. Stopa klikanja značajno se povećala u testnoj skupini; došla je "čitka" povratna informacija.
Slučaj 2 — pogreška sigurnog područja. U dizajnu priče, važan slogan je bio na dnu; Bio je skriven ispod gumba "scroll" u prijenosu i nije se pojavio. Uz pravilo sigurnog područja, slogan je postavljen gore iu sredini. U kampanji koja je uslijedila poruka je bila jasna i redizajn nije bio potreban.
Slučaj 3 — Razmak ispisa. Brošura je tiskana bez rubova; na rubovima su se pojavile tanke bijele linije i 300 komada je rashodovano (otprilike 1200 TL izgubljeno). Sljedeći posao dodao je 3 mm izrez na dizajn; Posjekotina je ispala čista.
Predlošci koji se mogu kopirati
1) Generiranje pozadine s razmakom za tekst:
Generirajte pozadinsku sliku za [medijski] dizajn. Omjer: [1:1 / 9:16 / 16:9]. Neka gornja trećina bude čista i prazna (za naslov). Ton marke: [pridjevi]. Stavljanje čitljivog teksta/loga. Boje odgovaraju paleti: [boje].
2) Hijerarhijski plan:
Napravite vizualni hijerarhijski plan za sljedeći dizajn. Svrha: [najava/prodaja/informacija]. Elementi: [naslov, alternativni tekst, slika, logotip, oblačić]. Dodijelite svakom elementu redoslijed važnosti, predloženi položaj i relativnu veličinu. Opišite put kojim će oko slijediti (žarište → sekundarno).
3) Preporuka za rešetku i poravnanje:
Predložite jednostavnu rešetku i shemu poravnanja za sljedeći sadržaj: [popis sadržaja], omjer [x]. Koliko stupaca trebam koristiti, kako trebam poravnati elemente, koliko prostora (margine) trebam ostaviti? Neka bude jednostavno i uravnoteženo.
4) Kontrola izgleda:
Procijenite sljedeću izjavu o dizajnu u smislu kompozicije: je li hijerarhija jasna, je li poravnanje dosljedno, ima li dovoljno bijelog prostora, uklapa li se u siguran prostor, je li žarišna točka jasna? Odgovori kao prijedlog. Opis: [zalijepi]
Slab upit / Jak upit
Slab: Napravite banner sliku popusta i recite 50%.
Rezultat: AI piše oštećeno "50%", elementi su raspoređeni nasumično, ne možete uređivati tekst; ne može se koristiti.
Snažno: Napravite pozadinsku sliku za prodajnu kampanju: omjer 4:5, topli energični tonovi, veliki običan prostor za tekst u gornjem lijevom kutu, proizvod u donjem desnom kutu. Stavljanje čitljivog teksta; Poravnat ću naslov, informaciju "50%" i gumb u programu za dizajn.
Rezultat: hijerarhijska pozadina koja se može uređivati i ostavlja mjesta za tekst.
Razlika: snažan pristup odvaja tekst od umjetne inteligencije, planira razmake i proporcije, a izgled prepušta dizajneru.
Tablica principa sastava
princip
Što pruža
Praktičan savjet
hijerarhija
Redoslijed čitanja
Neka najvažnije bude najveće/kontrast
usklađivanje
smisao za red
Poravnajte nevidljive linije
rešetka
Dosljednost
Koristite sustav stupaca
prostoru
Čitljivost
Kompresija, oslobađanje disanja
sigurno područje
ne isječak
Držite predmete unutra od ruba
Krvariti
čist otisak
Nosi rub za 3 mm
Uobičajene greške
- Ispis teksta u AI: oštećen tekst koji se ne može uređivati; Dodajte tekst u program za dizajn.
- Ne ostavlja prostor: skučen dizajn amaterskog izgleda.
- Nema hijerarhije: Sve je iste veličine; Oko ne zna kamo bi.
- Zaboravljanje sigurnog područja: važan element zaglavi ispod sučelja ili isječka.
- Preskakanje rubova: bijeli rub i otpad u ispisu.
Ukratko
Raspored je namjerno postavljanje elemenata i pretvara sliku u izvediv dizajn. Hijerarhija, poravnanje, mreža, prostor, ravnoteža i kontrast osnovni su principi. AI proizvodi pozadinu i vizualne elemente, daje ideje za kompoziciju; no pikselski precizan izgled, tekst koji se može uređivati i poravnanje u rukama su dizajnera u programu za dizajn. Omogućavanje prostora za tekst, siguran prostor i ispis bez ruba su pravila koja određuju upotrebljivost ispisa.
Zadatak aplikacije
Odaberite medij i svrhu (npr. rasprodaja na Instagramu). Napravite popis sadržaja, napravite plan hijerarhije. Generirajte pozadinu ispravnih proporcija s prostorom za tekst pomoću umjetne inteligencije. Zatim poravnajte i postavite naslov, alternativni tekst, logotip i oblačić u program za dizajn (ili kao skicu na papiru). Testirajte kamo prvo skreće oko zumiranjem i gledanjem iz daljine i zabilježite to.
popis za provjeru
- [ ] Odredio sam inventar namjene i sadržaja.
- [ ] Postavio sam vizualni plan hijerarhije.
- [ ] Napravio sam sliku s prostorom za tekst i ispravnim omjerom.
- [ ] Poravnao sam tekst i elemente u programu za dizajn.
- [ ] Promatrao sam sigurno područje i marginu za rub (ako se ispisuje).
- [ ] Smanjio sam ga i testirao točku fokusa.