7 principles of design1

8/7/2019 7 principles of design1

1/8

Copyright 2010-- Asist. Univ. Matei Stoicovici


2/8

Rul e 1: Limit yo u r f o n t sNOT A: aceste reguli POT fi incalcate ele nu sunt legi, ci doar principii generale de ghidaj

Un aspect general-valabil pentru un design reusit este CON SISTENT A. Aceasta se realizeaza prin limitareasau reducerea stilurilor si temelor grafice abordate . LESS is MO R E ! Font-urile sunt o variabila foarteimportanta in aceasta ecuatie . Limiteaza-te la 2 - 3 tip u ri, in functie de design .

Prim ul font poate fi unul artistic sau special . Acesta va aduce un plus de accent, personalitate si va spargemonotonia . Folositi pentru tit lu ri sau texte sc u rte , cu format de litera mare . Acesta va fi centrul de interes altextului, locul unde cade privirea intai .

Al doi lea font trebuie sa fie unul cat maisimp lu . Lizibil, curat si simplu, nu trebuiesa agreseze vizualul . Folositi pentrucorp u ri de text lu ngi . Functionalitate nuextravaganta!

Al trei lea font trebuie sa fie tot basic,simplu, insa se poate folosi in aspect b o ld ,italic sau underline, pentru a scoate inevidenta subtitluri, intertitluri sau alteinformatii scurte de context . Se folosestein calupuri de cateva cuvinte, de obiceiamplasat mai izolat, intr-o anumita zonadin pagina (footer, side-bar, casete grafice,sub fotografii)


3/8

Rul e 2: Limit yo u r co lorsO alta variabila importanta pentru un design CON SISTENT este culoarea . Reducand sau limitand numarul

de culori folosite atingem o estetica si o compozitie mai bune . Practic, totul trebuie sa para ca se leaga . Aplica o strategie a culorilor care sa avantajeze design-ul ,nu sa-l distruga!

Color Va lu e (intensitatea) = cat de aprinsa sau intunecata este o culoare . Se calculeaza in functie decantitatea de ALBsau NEG R U care o compune . Spre ex . ga lb en este o culoare cu o intensitate mare (mu lt alb) , mov are o intensitate scazuta (mu lt negr u ). Evident ca fiecare culoare poate avea mai multe nu ante .

O reg ul a de b aza este sa folositi o paleta de

culori cu intensitati variate, adica de nu antediferite , astfel incat sa existe un contrast intreele . Aseaza culori inchise pe suprafetedeschise si vice-versa . Variaza cald cu rece .

Temperat u ra de c ul oare Culorile din spectrulvizibil merg de la `cald` la `rece` . Astfel, ros u ,oranj si ga lb en sunt calde, a lb astr u , indigo ,vio let sunt reci . Verde e considerat neutru . Albsi Negru N U su nt culori .

Radiatia e lectromagnetica a culorii se caracterizeaza prin lungime de unda si intensitate . Aria de lungimide unda perceputa de om este de la 390 nanometri ( nm ) la 700 nm si se cheama `visible light` . ROG VAIV

Foloseste un site precum www .co lou rlovers.comca sa iti alegi o schema de culori convenabila .


4/8

Rul e 3: C N R SUn contrast b u n este asigurat de o

alegere buna a culorilor . Contrastul este

expresia diferentei de intensitate (v al ue)dintre culorile folosite intr-un design . Cand este folosit adecvat, contrastulpoate fi si el o variabila importanta,care poate ridica sau cobori esteticaunui layout .

Una dintre grese lile des intalnite esteaceea ca adesea este folosit un contrastde cul ori , in loc de un contrast deintensitati (n u ante) . Contrastul nutrebuie sa fie enervant, ci placut .

In primul exemplu exista contrast, dar este prea vibrant, agresiv

Un alt aspect al contrastului apare in situatia fundalurilor semi-transparente . Atunci cand vrem sa cream un ` w atermark `. Scadeopacitatea stratului din fundal la 15 20 % pentru vizibilitate si contrast


5/8

Rul e 4: S P A T I E R E si ALIN IE R ESpatierea in pagina ( intre texte, i m agini, artwork) este un aspect estetic care atarna decisiv in ecuatia unui layout

reusit . Tendinta celor neexperimentati este sa ingramadeasca prea multe elemente intr-un spatiu prea mic .

Nu toate spatiile trebuie umplute . Space is yo u r friend ! In primul rand pentru ca spatiul asigura `aerisire`, siusurinta in lizibilitate si percepere a mesajului . Si apoi spatiile fac designul sa para mai elegant, mai manierat .

In general este bine sa folositi un ` grid ` in momentul in care va apucati de layout . Aceste marcaje va asigurapastrarea unor distante egale si simetrice fata de marginile paginii, dar si fata de elemente intre ele .

S tanga grafica alcatuita cu ajutorul unui GR ID; Dreapta elementele aufost amplasate fara ajutorul marcajelor in pagina, cu aliniere `dupa ochi` .

Intr-un design elementele trebuie sa seALIN IEZE intre ele, sa fie grupate in pagina

dupa anumite `zone si linii imaginare` . Maimulte detalii in ` The G esta lt Princip les`.

Alinierea trebuie sa mearga mana in manacu spatierea . Asigurati-va ca lasati spatiiega le intre elementele dintr-o anumitazona de interes (pe orizontala si v erticala ).

Echi lib rati designul astfel incat sa aveti si

spatii albe, care sa actioneze ca un liantintre componente .Evitati ` sar u t u rile ` intre elemente . Nu

amplasati componente prea aproape intreele . O ri lasati spatiu ori suprapuneti vadit .

Atentie la ilu ziile optice care pot apareadin cauza pattern-urilor sau culorilor dintreelemente . Pot crea senzatia ca designul nueste aliniat sau spatiat corect .


6/8

Rul e 5: PR OF UNZ IME (depth )Un alt aspect important in cadrul unui layout bun este crearea senzatiei de PR OF UNZ IME sau stabilirea unui

raport de dimensionare intre elementele din pagina . Poti face asta prin mai mu lte tehnici :

1. Su prap u nerea e lemente lor. Un design nu trebuie sa para plat, unidimensional . Pentru a scoate ceva inevidenta, asigura-te ca amplasezi alte elemente in planurile mai indepartate sau mai apropiate subiectului .

2. Dimensi u nea e lemente lor.Variaza dimensiuneaelementelor, astfel incat saexiste o ierarhie a marimilor( a m esteca font uri si fotografii m ai m ici cu unele m ai m ari) .

3. G rosimea de linie. Variazagrosimea de linie pentru `stroke`la cuvinte . O linie mai groasaface cuvantul sa para maiapropiat, mai de impact

4. Drop shado w . Aplica acestefect foarte popular pentru ascoate in evidenta un element si

a crea senzatia de profunzime


7/8

Rul e 6: MOT ION (dinamica)Daca ti-ai insusit sfaturile de pana acum, e cazul sa treci un nivel peste . Un aspect important al unui layout

sau design bun este DIN AMICA. Sau flow-ul . Adica miscarea pe care o va parcurge ochiul si implicit perceptia .

Creaza o senzatie de miscare prin aranjarea elementelor in pagina, astfel incat privirea sa aiba o tranzitienaturala si facila de la o zona/sectiune la alta . Poti ghida atentia catre zonele de interes, indicand un posibiltraseu vizual . Te poti juca cu font-urile, imaginile, dar mai ales cu grafica auxiliara din pagina (artwork)

Sparge monotonia unei pagini statice,plictisitoare cu anumite centre de interes . Incearca sa ghidezi privirea cititorului catreele . Fotografiile si titlurile mari, chenarele,liniile sau alte elemente grafice pot atrageatentia in anumite zone din pagina . Nu uita sarespecti mereu diagona la de citire : stanga-

sus / dreapta-jos, ca sa nu confuzezi ochiul .


8/8

Rul e 7: CO MPOZ IT IA genera laCompozitia este viziu nea genera la despre un tot-unitar . Este momentul in care trebuie sa pui in aplicare cei

6 pasi anteriori : Sa iti alegi font urile , cu lorile (astfel incat sa existe un contrast optim), sa stabilesti cate si care

sunt elementele pe care trebuie sa le asezi in pagina (titluri, fotografii, corp de text, grafica & ilustratii, etc),care este ierarhia i mp ortantei lor in pagina, cum le vei gr up a/alinia unele cu altele, unde vei avea s patii de`res piro `, cum vei crea senzatia de prof unzi me si dina m ica in pagina si care trebuie sa fie trase u l ochi u l u i pentru a prelua corect si facil informatia, toate in modul cel mai estetic si nat u ra l cu putina .

C ompozitia trebuie sa fie directrelevanta pentru FUN CT ION ALITATE Apaginii . Un design de succes este unulestetic si armonios, dar si eficace .

Pentru asta asigura-te ca :

1. Esti in cunostinta de cauza despre ceea ce urmeaza sa faci . Care este scop ul design-ului? Ce vrea sa transmita? Clientuliti poate furniza acest brief . Daca ai nelamuriri, intrea b a !

2. Stabileste de la inceput aspecte le tehnice (format, cromatica,modalitate de tiparire sau de manufacturare) . Sunt detalii vitale!

3. Afla cat mai multe detalii despre target- ul prod u sulu i. Acesteaspecte te vor ajuta sa te decizi asupra strategiei de atac .

4. Fa o mica cercetare despre istoria si/sau paleta de produsedeja existente ale brandului . Sau inspira-te din produse carevizeaza un segment de p u b lic simi lar .

5. C reaza o macheta/schita grosiera in avans . Incearca maimulte variante de layout pana esti convins ca fiecare element

component este cat mai aproape de perfectiune .

6. Testeaza layout-ul . Printeaza omostra si arat-o colegilor/prietenilor . Intreaba-i ce le place si ce nu . Cere

pareri obiective ale unor oameniobisnuiti .

7 principles of design1

Documents