Grilă modulară. De la cuvinte la fapte. Anatomia unui logo: studierea grilei modulare Ce este o grilă modulară
O grilă modulară este un șablon special în funcție de care este construit designul site-ului web. În esență, acesta este un sistem de prezentare a informațiilor vizuale vizitatorului bazat pe blocuri individuale numite module. Un site web dezvoltat folosind un astfel de șablon este mult mai ușor de citit și de navigat.
Cum se folosește plasa
Grila modulară este folosită pentru a dezvolta design-uri pentru cărți, cărți de vizită, mărci comerciale, logo-uri etc. De asemenea, este obligatoriu să o folosești la crearea site-urilor web. O grilă realizată corespunzător compune armonios mediul pentru toate elementele resursei - grafic și text. Face mult mai ușor să le potriviți pe toate pe pagină și să creați limite clare între ele. Prin aranjarea elementelor într-un anumit mod, puteți face fiecare dintre ele vizibile și, în același timp, legați împreună toate informațiile despre site-ul în sine.
Tipuri de grile modulare
Cea mai comună grilă modulară în designul paginii este o celulă de bază cu trei coloane. În acest caz, antetul și subsolul au o lățime egală cu dimensiunile lor. Această opțiune standard este folosită de obicei de amatori atunci când creează site-uri web. Uneori, lățimea unei celule crește în detrimentul lățimii alteia.
Crearea celei de-a doua versiuni de grile modulare - non-standard - este posibilă numai pentru persoanele care sunt implicate în design web profesional. În acest caz, doar lățimea coloanelor și distanța dintre elementele individuale sunt definite cu precizie. O grilă modulară în proiectarea diferitelor tipuri de resurse de știri și reviste online este de obicei dezvoltată după cum urmează:
- Se creează un antet și un subsol. Numele site-ului, meniul de navigare și diferite tipuri de materiale video ar trebui să fie localizate aici.
- Pagina este împărțită în trei coloane. Mai mult, doi dintre ei au aceleasi marimi. A treia coloană este împărțită în două părți linie verticală. Astfel, obținem patru secțiuni (știri, galerie foto, spațiu publicitar, ultimele modificări de informații de pe site).
O grilă modulară pentru magazinele online de diferite specializări este creată într-un mod ușor diferit. În acest caz, este foarte important să se asigure navigarea ușoară pentru vizitatori. În acest caz, elementele sunt grupate într-o manieră standard și uniformă. Pentru fiecare dintre obiectele din grilă, a informatii importante, care îl caracterizează.
Riglă în editorul Photoshop
Site-urile web sunt create folosind cele raster sau vectoriale. Este foarte convenabil să creați o grilă în ele. Să vedem cum se face acest lucru în populare Editor Photoshop. Crearea unei grile modulare în Photoshop este foarte simplă.
Pentru ca riglele să apară în jurul perimetrului ferestrei imaginii de lucru, accesați elementul din meniul principal „Vizualizare” și faceți clic pe linia „Rigle”. În acest editor puteți utiliza o varietate de elemente - cu diviziuni în centimetri, milimetri, inci sau pixeli. Pentru a efectua setările necesare, accesați elementul din meniul principal „Editare”. Apoi, selectați linia „Setări” (Preferințe) - „Unități și rigle”. După aceasta, va apărea o fereastră în care puteți schimba tipul de riglă. În meniul derulant de sus, selectați centimetri, milimetri, pixeli etc.
Cu toate acestea, de obicei, atunci când lucrează în editorul Photoshop, folosesc o metodă puțin diferită, mai simplă. Pentru a schimba unitățile de măsură, faceți clic pe rigla în sine în fereastra de imagine clic dreapta soareci. După aceasta, puteți efectua acțiunea dorită în meniul care apare. De obicei, atunci când se creează un site web, se folosește o grilă de pixeli.
Grilă Photoshop
Grila modulară a programului Photoshop în sine va deveni vizibilă după ce accesați elementul din meniul principal „Vizualizare” - „Afișare” - „Grilă”. Distanța dintre liniile grilei poate fi ajustată. Pentru a face acest lucru, executați comanda „Editare” - „Setări” - „Ghiduri, grilă, felii”. Aici puteți schimba nu numai pasul dintre linii, ci și culoarea acestora. Folosind această grilă, va fi absolut ușor să plasați rapid și precis toate obiectele viitorului site pe câmpul de lucru.
Lucrul cu cursorul
O grilă modulară de site-uri web este creată în acest fel foarte simplu. Cursorul se lipește de linii atunci când lucrează. Acest lucru poate fi convenabil dacă trebuie să faceți blocuri de dimensiuni precise, specifice. Dacă din anumite motive această funcție se dovedește a fi inutilă, poate fi dezactivată. În mod implicit, originea grilei în Photoshop este situată în colțul din stânga sus al ferestrei. Dacă se dorește, poate fi mutat în orice alt loc de pe pânză. Pentru a face acest lucru, plasați cursorul peste pătratul originii și pur și simplu trageți-l în timp ce țineți apăsat butonul mouse-ului. Pentru a readuce punctul de plecare la locul său, faceți dublu clic pe același pătrat din colț.
Printre altele, există diverse tipuri de plugin-uri pentru editorul Photoshop care fac crearea unui site web folosind o grilă modulară și mai convenabilă. Descărcați-le online. Folosind aceste pluginuri puteți crea grile cu parametri specificați.
Grilă în CorelDraw
Acum să vedem cum să facem o grilă modulară editor de vectori CorelDraw. Aici este creat în aproape același mod ca în Photoshop. Pictograma sa este situată în panoul de sus (un ochi într-o grilă). După ce faceți clic pe el puteți face totul setările necesare. Este posibil să selectați distanța dintre linii, să schimbați unitatea de măsură etc. Acestea delimitează zona de lucru în fereastra de imagine din CorelDraw și folosind ghiduri. Ele pot fi făcute vizibile sau invizibile dacă este necesar.
O grilă modulară în designul site-ului web este un element fundamental, a cărui dezvoltare trebuie abordată cu maximă responsabilitate. La urma urmei, comoditatea vizitatorilor săi și, prin urmare, timpul petrecut pe paginile sale, depinde de cât de corect este structurată resursa.
Grilă modulară este un sistem de organizare a obiectelor în spațiu, bazat pe rânduri și coloane de o anumită dimensiune, strict specificată. Celulele pot conține unități de conținut: blocuri de text, titluri, cadre și imagini.
Grilele pot fi găsite nu numai în designul informațional, ci și în arhitectură, interioare și urbanism. În toate aceste zone, grilele sunt construite după principii similare legate de dorința de a aduce ordine și armonie spațiului care se delimitează.
Observați una dintre schițele din 1807 ale dezvoltării Manhattanului, care urmează o grilă strictă de străzi care merg de la vest la est și de la nord la sud.
De ce sunt necesare ochiuri?
Inițial, plasa a fost folosită în afacerile cu ziare pentru a crește eficiența. Foile de aspect au făcut posibilă reducerea costurilor de întreținere a tipografilor cu normă întreagă, standardizând aspectul paginilor și economisind timpul „artiștilor de design” înșiși. În curând, foile de layout au fost înlocuite cu grile modulare mai flexibile.
Urmând o nouă tendință, la începutul anilor 1960, designerul grafic Peter Palazzo a actualizat designul ziarului New York Herald Tribune. În 1966, editorul artistic Janet Collins a introdus un nou aspect pentru Times of London. Ambele schimbări au arătat industriei că un stil de design consistent îmbunătățește calitatea interacțiunii cititorului cu publicația. Editorii de ziare și reviste și-au dat seama rapid de necesitatea grilelor și au început să le aplice în practica lor.
Ca și în zilele ziarelor, în era digitală, grilele aplicate corect ajută la reținerea atenției cititorului, la îmbunătățirea calității percepției textului și, în general, la îmbunătățirea experienței interacțiunii acestuia cu materialul. În designul media de astăzi, grila dă ordine și coerență informațiilor. Ea este responsabilă de structurarea conținutului articolelor individuale și a publicației în ansamblu.
Joseph Müller-Brockmannîn manualul său „Sisteme modulare în design grafic”, el scrie despre grile astfel:
„Prin structurarea planurilor și spațiului folosind o grilă modulară, designerul este capabil să organizeze texte, fotografii și imagini grafice după principiile obiectivității și funcționalității.<…>Designul organizat logic susține credibilitatea informațiilor și atrage cititorul către ea.”
Ce tipuri de ochiuri există?
Există multe tipuri și configurații de grile: de la „celule” primitive, ca într-un caiet de școală, la structuri complexe cu distante diferiteîntre orizontale și verticale.
Am colectat cele mai comune și deja „clasice” mostre, familiarizarea cu care vă va ajuta să înțelegeți mai bine designul modular:
Grilă pătrată
Cea mai simplă grilă, care a stat la baza sistemului modular, a constat din pătrate și arăta ca o masă obișnuită. A început să fie folosit la sfârșitul primului sfert al secolului al XX-lea. Designerii tipografici din Zurich și Basel l-au rafinat în anii postbelici, ceea ce a coincis cu o creștere a interesului pentru Helvetica și fonturi similare, dând naștere școlii de „tipografie elvețiană”.
De exemplu: Robert Buechler, 1914
Sursa: ThinkingForm
Max Bill grile
Prima experiență de utilizare a grilelor în cărți a fost sistemul dezvoltat de Max Bill pentru cartea „Die Neue Architektur”. În această carte, publicată în 1940, Alfred Roth a folosit împărțirea paginii în nouă module orizontale. Au făcut posibilă aranjarea liberă a ilustrațiilor și plasarea textului pe ele în trei limbi. Cu câțiva ani mai devreme, bazându-se pe ideile „noii tipografii” Bauhaus, Bill a folosit o grilă cu șase module în faimosul său poster „Negerkunst”, creat pentru o expoziție de artă rock din Africa de Sud în 1931.
Despre ce tac tipografiile?
22 noiembrie 2015 duminica Grilă modulară: un instrument pentru design inteligentCe este o grilă modulară?
Acesta este scheletul invizibil al designului tău - un sistem de ghidaje orizontale și verticale (și uneori diagonale și arc) care ajută la orientarea și coordonarea elementelor individuale ale compoziției.
Ce folos are?
În primul rând, o rețea modulară aduce ordine, integritate și conexiune tuturor părților sale la proiectare. Vă permite să organizați rațional orice spațiu grafic, fie că este un antet, o carte de vizită, un poster, o carte, un site web sau un interior, păstrând în același timp unitatea de stil în toate elementele sale.
Și în al doilea rând, accelerează considerabil onorarea comenzilor, pentru că, vezi tu, lucrul după un șablon este mult mai ușor decât să reinventezi roata de fiecare dată.
Omul a încercat de mult să înțeleagă natura frumuseții, să o „descompună” în componente separate, să „verifice armonia cu algebra”. Cel mai vechi exemplu de utilizare a unei grile modulare este canonul medieval, care a fost folosit de scriitorii de carte la marcarea paginilor de carte.
Răspândirea unui manuscris latin. 1555
Bazele designului modular modern au fost puse de către constructiviștii anilor 1920.
Coperta revistei. Design de El Lissitzky. 1922
Poster. Design de Herbert Bayer. 1926
Cu toate acestea, construcțiile lor abstracte nu au fost imediat recunoscute ca o metodă cu propriul sistem de reguli și modele. Abia în 1940 a folosit pentru prima dată designerul elvețian Max Bill design de carte grilă modulară.
Legatura de carte. Design de Max Bill. 1944
Poster. Design de Max Bill. 1945
În 1961, compatriotul său Josef Müller-Brockmann a introdus primii termeni ai abordării modulare a designului și a publicat 28 de exemple de grile pe care el însuși le-a dezvoltat. A fost școala elvețiană de design, extrem de funcțională și lapidară, cea care a îmbunătățit și a prezentat lumii acest instrument - grila modulară.
Grilă și pagini de carte. Design de Josef Müller-Brockmann
Poster. Design de Josef Müller-Brockmann. 1959
Poster. Design de Josef Müller-Brockmann. 1972
Trebuie spus că designerii ruși nu sunt cu mult în urmă colegilor lor occidentali în design modular. Deja în anii 1960, în Uniunea Sovietică a apărut un grup de oameni asemănători, folosind principiile designului strict al publicațiilor tipărite (mai târziu Serghei Serov a numit în glumă această școală „Elveția sovietică”). Originile abordării modulare interne a designului au fost autorități recunoscute astăzi precum Maxim Jukov, Mikhail Anikst și Arkady Troyanker.
Legatura de carte. Design de Maxim Jukov și Arkady Troyanker. 1970
Răspândire carte. Design de Mikhail Anikst. 1979
Manta de praf. Design de Maxim Jukov. 1977
În doar câteva decenii, s-a acumulat o experiență unică și au fost create capodopere. design grafic. În ciuda acestui fapt, astăzi, ca acum 30-40 de ani, grila modulară din țara noastră pare să fie promovată în continuare doar de uni entuziaști.
Coperta broșură. Design de Evgeny Grigoriev. Sankt Petersburg, 2009
Iată câteva exemple de abordare modulară a designului din portofoliul editurii noastre.
Pentru catalogul artistului Evgeny Zhurov, a fost ales formatul clasic de carte in quarto cu un raport de aspect de 3 la 4 Aceste proporții au stat la baza grilei modulare.
Pentru a orienta imaginile picturilor pe întinsă s-a evidențiat linie orizontală, împărțind pagina pe verticală într-un raport de 1 la 3. În timpul aspectului, fiecare imagine a fost poziționată astfel încât să fie împărțită vertical de această linie în același raport.
Această tehnică a făcut posibilă combinarea cu ușurință și armonie între ele a picturilor de orice format - atât panoramice, alungite orizontal, cât și înalte, alungite vertical. Când răsfoiți catalogul, seria pitorească capătă un ritm viu, pulsatoriu.
Inutil să spun, compozițiile pagina de titluși titlurile, setul de articole introductive și datele de ieșire, poziția numerelor coloanelor pe marginile exterioare ale paginilor au fost, de asemenea, construite ținând cont de această linie orizontală.
Să adăugăm doar că legendele picturilor, dimpotrivă, au fost făcute în mod deliberat statice. Sunt situate în locuri strict definite și trăiesc ca separat, fără a distrage atenția privitorului de la imagini.
Aspectul catalogului nostru de calendare tematic a fost inspirat de materialul în sine. Acest catalog este destinat acelei categorii de clienți care doresc să comande un calendar corporativ. Fiecare subiect este reprezentat de 12 imagini (după numărul de luni din an) și este plasat pe un spread separat. Grila modulară a broșurii s-a dovedit a fi atât de simplă, clară și deschisă, încât nu este nevoie să o prezentați separat aici.
Designul cărților poștale din setul „Dinastia Romanov” (Muzeele Kremlinului din Moscova), în ciuda compoziției asimetrice pronunțate, sa bazat în întregime pe împărțirea consecventă a avionului în funcție de raportul de aur. Combinarea principiilor clasice, testate de timp, cu tendințele moderne poate duce uneori la rezultate interesante.
Designul modular este pur și simplu de neînlocuit atunci când proiectați publicații în serie. O grilă construită odată, dar bine gândită, va facilita foarte mult lucrul pe numere noi ale unei cărți, reviste, broșuri sau ziar. Schimbând liber textul, imaginile și culoarea, puteți obține cu ușurință un design ușor de recunoscut și de identificat cu precizie într-o serie.
Este necesar, totuși, să rețineți că utilizarea unei rețele modulare nu este o garanție 100%. design bun. Folosind același șablon, puteți crea atât o operă de artă, cât și un meșteșug mediocru. Indiferent cât de precisă, subtilă și versatilă este o unealtă cu plasă modulară, este doar o unealtă care va rămâne moartă fără imaginație și creativitate.
În plus, atunci când începe proiectarea modulară, este util ca designerul să aibă cel puțin o înțelegere generală a proporțiilor, formei, culorii, contrastului, ritmului...
Dar mai multe despre asta în următoarele articole.
Literatură pentru autoeducație:
1. Laptev V. Grile modulare: Design de publicații cu mai multe pagini. M.: RIP-holding, 2007.
2. Samara T. Crearea și spargerea grilei. M.: RIP-holding, 2005.
3. Hurlbert A. Mesh: Sistem modular proiectarea și producția de ziare, reviste și cărți. M.: Carte, 1984.
4. Bosshard H. R. Der typografische Raster. Z?rich: Niggli, 2000.
5. Elam K., Elsener R. Gestaltungsraster: Ordnungssysteme f?r Schrift. New York: Princeton Architectural Press, 2006.
6. Miller-Brockmann J. Sisteme de grilă în design grafic. Z?rich: Niggli, 1981.
Să vorbim despre cum să aranjați cel mai bine elementele de design pe pagină.
Una dintre greșelile comune ale designerilor începători este aceea că suprasatura compoziția cu tot felul de elemente și le așează prea aproape unul de celălalt.
Ei încearcă să încadreze prea multe informații într-un spațiu mic. Ține minte asta spațiul liber este bunul tău prieten. Vă ajută publicul să vă citească materialul. Spațiul utilizat corespunzător vă face proiectul mai elegant și mai ușor de înțeles.
Strategia de bază de compoziție pentru designul dvs. ar trebui să înceapă cu aspectul. Dacă nu doriți ca munca dvs. să pară haotică, atunci trebuie să sistematizați toate informațiile vizuale. Aici ne vine în ajutor grilă modulară sau, altfel spus, marcaj pentru aranjarea elementelor pe o pagină. În web design, rolul unei grile modulare este jucat de o masă.
|
|
|
|
Figura 4.6.
În web design, grila modulară este folosită mult mai des decât ar părea la prima vedere. Dacă utilizați
|
Rezoluția ecranului | ||||
|
Dimensiuni pânză |
Mărimea ecranului poate fi determinată folosind programe simple (vezi practica de laborator).
Să ne uităm la un exemplu de grilă modulară și specificarea dimensiunilor, organizată folosind un tabel
În HTML, puteți marca întregul conținut al unui tabel cu o etichetă
. Apoi, antetul tabelului este indicat de etichetă iar concluzia cu eticheta .Toate cele trei etichete sunt etichete de închidere și au atribute. Celulele din antetul tabelului folosesc eticheta| titlu | meniu | modulul 1 | modulul 2 | modulul 3 | modulul4 |
|---|---|---|
| concluzie |