Principii de Proiectare: Spațiu Și Figura-Sol Relație

Despre Autor

Steven Bradley este autor de Proiectare Fundamentale: Elemente, Atribute, & Principiile și CSS Animații și Tranziții pentru Web Moderne., Atunci când nu …Mai mult aboutSteven Bradley↬

• 10 min de citit
• sursă de Inspirație,Design,Creativitate,Principii de Design
• Salvat pentru lectură offline
• Partajare pe Twitter, LinkedIn

Dacă vedeți design grafic ca un proces de aranjarea forme pe o panza, apoi vezi doar jumătate din ceea ce lucrezi. Spațiul negativ al pânzei este la fel de important ca și elementele pozitive pe care le plasăm pe pânză.,

Design este un aranjament de ambele forme și spațiu. Pentru a lucra mai eficient cu spațiul, trebuie mai întâi să deveniți conștienți de el și să învățați să îl vedeți — să învățați să vedeți formele pe care spațiul le formează și modul în care spațiul comunică. Aceasta este a doua parte a unei serii pe principii de proiectare pentru incepatori. Prima parte a acoperit o introducere în gestalt; restul seriei( inclusiv acest post) se va baza pe acele principii gestalt și va arăta câte dintre principiile fundamentale cu care lucrăm ca designeri își au originea acolo.,

relația figură-sol

principiul gestalt care se aplică cel mai mult spațiului este cel al figurii-sol. Totul într-un design al tău va fi văzut ca unul sau altul, iar relația dintre ele se exclud reciproc. Nici unul nu poate fi perceput decât în raport cu celălalt, iar schimbarea unuia este imposibilă fără a schimba și celălalt.

relația figură-sol este, de asemenea, complementară. Figura și solul pot spori sau diminua unul de celălalt, iar organizarea celor două în raport unul cu celălalt este unul dintre aspectele mai importante ale designului., Acesta stabilește un context pentru modul în care designul dvs. comunică și cum va fi interpretat.

” spațiul alb trebuie privit ca un element activ, nu ca un fundal pasiv.”
— Jan Tschichold

În cel de-al treilea panel, două linii negre au fost eliminate. Aceasta activează spațiul, făcându-l să pară așezat deasupra câmpului gri., Pământul a devenit figura și adaugă mai multă adâncime designului.

Există trei tipuri de figura-sol relațiile:

• Stabilă (sus stânga),
  e clar ce-i figura și ceea ce este jos. Unul sau altul domină de obicei compoziția.
• reversibile(deasupra centrului)
  atât figura, cât și solul atrag atenția privitorului în mod egal., Acest lucru creează tensiune, prin care fie poate depăși celălalt, ceea ce duce la un design dinamic.
• elemente ambigue (sus dreapta)
  pot părea a fi atât figura și la sol simultan. Ele formează forme la fel de interesante, iar spectatorul este lăsat să-și găsească propriul punct de intrare în compoziție.

în funcție de relația pe care o configurați și de modul în care echilibrați atât figura, cât și terenul, direcționați publicul să privească diferite părți ale designului și să interpreteze ceea ce văd în contexte diferite.,figura-sol nu este singurul principiu gestalt în care spațiul joacă un rol proeminent. Alte două sunt următoarele:

• proximitatea
  proximitatea folosește spațiul pentru a conecta și separa elementele prin închiderea unor elemente în spațiu. Un exemplu pe care l-am putea lua de la sine este paragrafele textului din pagină. Spațiul dintre paragrafe este mai mare decât spațiul dintre liniile de text dintr-un paragraf.acest lucru face uz de spațiu ca lacune între elemente. Spectatorii completează golurile cu propriile informații pentru a completa un întreg din părți. Prea mult spațiu și nu are loc închiderea., Prea puțin spațiu și nu este nevoie de închidere. Numai echilibrul corect între spațiu și spațiul completat va activa spațiul și va duce la închidere.

Spațiu Ca Un Element de Design

Gândiți-vă la muzica pentru o clipă. Dacă fiecare notă sau coardă ar fi cântată în același timp, nu ai avea Muzică. Ai avea zgomot. Muzica apare atunci când sunetele sunt în contrast cu tăcerea. Variația modelului de sunet și tăcere creează ritm și melodie., Fără tăcere, nu există muzică.

spațiul îndeplinește aceeași funcție vizual. Oferă elemente pozitive spațiu pentru a respira. Oferă ochiului libertatea de a se deplasa printr-un design și de a descoperi elementele pe care le caută. Pozitivul este văzut doar în contrast cu negativul. Fără spațiu, nu ai design. Ai zgomot vizual.

dacă zgomotul nu este ceea ce încercați să comunicați, înclinați-vă spre spațiu. Oamenii sunt mai puțin susceptibili să se plângă de prea mult spațiu decât de prea puțin.,

spațiul poate face următoarele:

• stabiliți contrastul, accentul și ierarhia;
• generați dramă și tensiune;
• asigurați odihnă vizuală între grupuri de elemente.

după cum implică relația figură-sol, aveți spațiu numai atunci când ceva este prezent în interiorul acestuia. Înainte de adăugarea de elemente pozitive, spațiul este nedefinit. Relația figură-sol trebuie stabilită înainte ca spațiul să poată exista și să înceapă comunicarea acestuia.una dintre cele mai importante funcții ale spațiului este îmbunătățirea lizibilității și lizibilității., Macro-spațiu face textul mai primitoare. Micro-spațiul îl face mai lizibil.

• Micro-spațiu
  acesta este spațiul din interiorul elementelor dintr-un grup. Este spațiul dintre litere, cuvinte și paragrafe.
• Macro-spațiu
  acesta este spațiul dintre elementele majore. Se separă elemente sau grupuri de elemente și oferă căi pentru ochi să urmeze și locuri să se odihnească între elemente.

spațiul se corelează cu calitatea. Mai mult spațiu implică mai puține elemente sau o raritate de elemente. Comparați magazinele de vânzare cu amănuntul de înaltă calitate și cu reduceri., Care dintre ele are de obicei mai mult spațiu în interior și care împachetează produsele în fiecare spațiu disponibil? Ce vă comunică spațiul?

spațiul poate transmite, de asemenea, alte atribute decât calitatea, cum ar fi:

• sofisticare,
• simplitate,
• lux,
• curățenie,
• singurătate,
• deschidere.pierzi spațiu atunci când nu reușești să-l consideri. Puteți pierde spațiu prin supraîncărcarea acestuia. Puteți pierde spațiu prin prinderea acestuia în interiorul elementelor unui design și nepermițându-i să se conecteze la alt spațiu din proiectare.,

  Design este în cele din urmă un aranjament de forme, și care include formele formate de spațiu. Nu vă fie frică să folosiți spațiul. Vizualizați – l ca un element important de design sub controlul dvs.pentru a utiliza mai bine spațiul, trebuie mai întâi să deveniți conștient de acesta. Învață să recunoști spațiul în diferite modele. Observați forma pe care o formează și gândiți-vă la ceea ce comunică spațiul. În acest scop, Să analizăm designul unor site-uri web, luând notă de modul în care este utilizat spațiul.,designul Vechii Gărzi a lui Tom Johnson folosește mult spațiu alb, oferind textului și altor elemente spațiu pentru a respira. Nu există nici o greșeală ce este figura și ceea ce este la sol.

  

  informațiile sunt conținute și separate prin spațiu (amintesc principiul proximității), distingând grupuri de elemente., Puteți spune cu ușurință unde se termină o postare și începe următoarea, numai prin spațiul dintre ele.

  conținutul principal este ușor oprit în centru pe pagină, cu spațiu generos pe ambele părți. Acest spațiu este întrerupt ocazional de elemente, activând atât spațiul, cât și elementele Întrerupătoare. Acest lucru ajută la atragerea atenției asupra zonei și în special asupra elementelor din interior.

  Heroku ‘ s Staus Page

  Imaginea de mai jos arată o parte a paginii de stare pentru Heroku ca fiind în mare parte spațiu., S-a întâmplat să prind site-ul într-o zi deosebit de bună, deoarece elemente pozitive suplimentare ar însemna mai multe incidente raportate pe platformă. Aici, mai mult spațiu alb înseamnă un serviciu mai bun.

  

  observați cum spațiul alb nu trebuie să fie alb. Deși pagina este prea generoasă cu spațiu, este puțin probabil să vă plângeți că există prea mult., Numai informațiile importante — în acest caz, actualizările de stare și rapoartele incidentelor — întrerup spațiul.

  introducerea romanului

  spațiul din partea de sus a introducerii romanului este asimetric și activ. Observați cum blocul mare de spațiu din stânga vă conduce ochiul direct la conținut. Dacă faceți clic pe site-ul web și derulați în jos de sus, veți vedea că spațiul este, de asemenea, utilizat pentru a separa și grupa blocuri de informații.

  

  liniile luminoase subțiri sunt de asemenea utilizate pentru a grupa și separa aceste blocuri. Când vizualizați site-ul web, observați cum liniile nu ating întotdeauna, permițând spațiului să curgă în jurul lor și să se conecteze la alt spațiu. Acest lucru împiedică spațiul să fie prins.site-ul Elliot Jay Stocks ar trebui să fie familiar tuturor, deoarece el se află în spatele designului acestuia. Spațiul asimetric de pe site-ul Elliot duce din nou la spațiu activ.,

  

  imaginea De mare în partea de sus a acestei pagini ar putea sta ca un blocaj temporar pentru accesarea de conținut de mai jos; cu toate acestea, o cantitate generoasă de spațiu de lângă imagine oferă ample si primitoare, camera pentru ochi pentru a muta în jurul valorii de ea., Dacă bara laterală din stânga avea aceeași culoare de fundal ca și conținutul principal, atunci probabil că ar fi mai ușor pentru ochi să se miște în jurul imaginii, dar schimbarea culorii nu face dificilă.ca și în cazul site-urilor de mai sus, spațiul este utilizat atât pentru a închide, cât și pentru a separa grupuri de informații distincte, permițând fiecărui grup să iasă în evidență și permițând ochiului să găsească ceea ce dorește și să se odihnească între ele.

  Phil Coffman

  conținutul de pe site-ul lui Phil Coffman formează o singură formă care se află în cea mai mare parte spațiu gol., Absența multor elemente pozitive mărește importanța celor prezenți.

  

  Chiar și în cadrul dreptunghiulare colorate fundaluri, textul are suficient spațiu în jur pentru a fi ușor de citit și să nu fie confundat pentru o altă categorie de text pe pagina.,forma pozitivă (și forma spațiului) se ajustează sensibil la diferite lățimi ale browserului, dar modelul unei singure forme mari înconjurate de spațiu rămâne.la fel ca multe dintre site-urile de aici, site-ul 2013 pentru Noile aventuri în Web Design conference lasă spațiu generos în jurul elementelor. Grupuri distincte de informații sunt conținute de spațiu, iar spațiul este activ pe tot parcursul proiectării.

  

  ceva interesant de remarcat este săgețile circulare gri dintre imaginea din stânga sus și conținutul principal din dreapta.

  aceste săgeți blochează fluxul de spațiu? Pentru că nu se ating și pentru că fiecare este punctată acolo unde întrerupe spațiul, spațiul poate curge, deși este clar mai restricționat în acel flux.

  culoarea mai deschisă-gri ajută. Împiedică săgețile să domine și nu este greu de imaginat spațiul care curge peste linii.,

  în echitate, dacă browserul meu era mai larg când am apucat captura de ecran, săgețile nu s-ar suprapune cu conținutul principal. Cu toate acestea, în jur de 1280 de pixeli până la locul în care designul devine o singură coloană, o fac. În general, funcționează, deși mă întreb dacă spațiul ar curge mai bine fără săgețile prezente.

  câteva exemple de logo-uri

  vă las cu câteva logo-uri în care spațiul este încorporat ca parte integrantă a designului. În loc să subliniez utilizarea spațiului în fiecare, voi face câteva comentarii generale și apoi vă voi lăsa să explorați spațiile pentru dvs.,

  observați modul în care logo-urile de mai jos face uz de relația figura-sol. Cu unele, până când vedeți atât figura, cât și solul, nu vedeți logo-ul complet. Ambele sunt contribuitori necesari la ceea ce este comunicat.mai multe dintre aceste logo-uri se bazează pe principiul închiderii. Ceea ce trebuie să vezi nu este cu adevărat acolo, dar îl vezi totuși. Câteva dintre aceste logo-uri, de asemenea, juca în jurul cu figura și sol. Ce este figura atunci când luați în întreaga logo-ul pe fundalul său devine teren pentru o cifră mai mică în termen., Această relație reversibilă figura-sol este esențială pentru ceea ce este comunicat.

  

  • Nor Pat
  • Pisica Neagra Lounge
  • Schimbare
  • Dolphin & Sigiliu Logo Designer
  • Implante Dentare Ghid
  • Wineforest

  Sumar

  sper ca te ia două lucruri principale din acest post., În primul rând este legătura dintre utilizarea spațiului în proiectare și principiul gestalt al figurii. Principiile Gestalt stau la baza a ceea ce facem ca designeri.în al doilea rând, și poate mai important, faceți un efort pentru a petrece timp observând modul în care spațiul este utilizat în proiectare. Nu lăsați spațiul să fie un produs secundar al elementelor dvs. pozitive. Învață să proiectezi spațiu la fel de mult ca, dacă nu mai mult, elemente pozitive. Aspectul oricărei pagini este în cele din urmă o organizare a spațiului.analizați conștient acel spațiu și folosiți-l în mod deliberat pentru a crea un design mai bun. Nu permite să fie ceea ce a mai rămas., Vizualizați-l ca un element esențial de design și apoi vizualizați relația dintre spațiu și elementele pozitive ca un element de design pe care îl modelați.

  data viitoare, vom adăuga mai multe principii gestalt mixului și vom explora modul în care punctele focale, continuarea și soarta comună ne conduc în idei precum greutatea vizuală și echilibrul compozițional.

  • Mintea Ta Ro Si Le Liniuțe: Tipografic Eticheta
  • Principii de Proiectare: Vizual Greutate Și Direcția
  • Cum Geometrie Influențe Logo Design
  • Despre Arta
  (al, ml, il)