Share
Acum știți totul despre culoare, tipografie și diverse lucruri pe care ar trebui să le întreprindeți înainte de a începe un proiect de design, este timpul să începeți să vă lăsați jos și murdari cu unele dintre elementele de bază ale lucrului cu grilele în desenele dumneavoastră.
Grilele vă permit să construiți o structură solidă și să vă formați în design. Ca și cum am analizat ierarhiile și ritmul tipografic, putem realiza aceleași sentimente prin utilizarea unei structuri de rețea. La fel ca în cazul codării, sunt recomandate modalități de organizare a modulelor și secțiunilor de cod, iar un sistem de grilă poate ajuta în mod similar la proiectarea pentru web.
Grilele nu sunt doar utile pentru noi ca designeri sau dezvoltatori - ele sunt bune și pentru utilizatori. În toată această sesiune am subliniat importanța creării unei călătorii bune pentru utilizatori și a unei experiențe bune a utilizatorilor prin design-ul dvs., la urma urmei, utilizatorul este acolo să vă consume conținutul și doriți să-i faceți o experiență cât mai bună pentru dvs. poate sa. A avea un sistem solid de grilă care să se utilizeze în desenele dvs. (și apoi treceți până la faza de dezvoltare) vă va permite să faceți acest lucru, creând coerență și familiaritate (și astfel construind încredere) în designul dvs..
Dacă site-ul dvs. este bine conceput, o rețea vă va ajuta să proiectați acea încredere în rândul utilizatorilor dvs. - oricât de conștient sau subconștient ar putea fi această proiecție. Utilizarea unui sistem de rețea nu înseamnă că desenele dvs. trebuie să devină plictisitoare sau boxy. Asa cum sa spus cu un design web receptiv, responsabilitatea este cu tine de a crea un design unic si diferit de acesta - si un sistem de grid ar trebui vazut ca ceva care va permite să faceți asta, mai degrabă decât restrânge tu.
... o structură care cuprinde o serie de linii orizontale și verticale, utilizate pentru aranjarea conținutului.
În termenii cei mai buni, un sistem de rețea este o structură care cuprinde o serie de linii orizontale și verticale care se intersectează și sunt apoi utilizate pentru aranjarea conținutului. În termeni chiar mai buni (ceea ce face mai ușor de înțeles!), Un sistem de rețea este o modalitate de a furniza un sistem pe care proiectanții îl pot folosi pentru a structura și a prezenta conținutul și imaginile într-un mod mai ușor de citit și mai ușor de gestionat.
Sistemele de grilă au fost folosite de mult timp în publicațiile tipărite, dar odată cu introducerea lor în proiectarea pentru web și pentru multele cadre de grilă CSS care au apărut de atunci, ele sunt acum utilizate aproape ca standard.
Folosirea unui sistem de grilă în desenele dvs. este o modalitate de a atinge un nivel de consistență care altfel ar fi extrem de dificil de stăpânit și de portretizat în desenele dumneavoastră. Din nou, uniformitatea și coerența sunt esențiale pentru crearea unui site pe care utilizatorii dvs. vor găsi ușor să navigheze, să citească și să înțeleagă. O experiență bună a utilizatorilor este creată prin angajarea cu utilizatorul dvs. și construirea unui sentiment de familiaritate cu ele - și un sistem de grilă vă ajută să faceți acest lucru oferind o bază solidă pe care o puteți dezvolta de la.
O grilă de exemplu, Gerstner, pe site-ul Gridset App. Deși sistemul dvs. de rețea este ceva care în cele din urmă va fi invizibil pentru utilizatorul final, îl puteți folosi pentru a vă ajuta în crearea de machete pentru desenele dumneavoastră. Dar, la fel ca toate regulile atunci când se proiectează (și uneori când se dezvoltă) regulile sunt făcute să fie sparte. S-ar putea să nu aveți întotdeauna întotdeauna nevoie să stați la formarea rețelei dvs., dar trebuie să înțelegeți sistemele de rețea, înainte de a vă putea angaja să încălcați regulile.
Pe web avem la dispoziție multe cadre de grilă CSS, precum și multe instrumente disponibile pentru a se rostogoli cu propriile sisteme de grilă pe care le putem crea noi. Este în totalitate la dvs. pe care dintre aceștia le-ați alege să le utilizați atunci când proiectați - de exemplu, un cadru CSS vă poate fi cunoscut ca dezvoltator, deci vă recomandăm să încercați să vă proiectați și cu el - dar să examinăm de ce proiectarea cu un sistem de rețea este o bună practică și, de asemenea, vă ajută să vă faceți griji cu privire la sistemul de rețea care urmează să continuați.
Există multe avantaje în utilizarea sistemelor de rețea - acest lucru poate începe atunci când proiectați pentru prima dată site-ul web, dar se poate dovedi util și atunci când treceți la etapele de construcție și dezvoltare, precum și atunci când gestionați proiectarea și construirea în viitor a site-ului web.
Lucrul bun cu privire la sistemele de rețea este că acestea vă permit să proiectați în proporții, echilibrarea între toate elementele diferite pe care le-ați putea avea în design. Un sistem de grilă ar trebui să fie întotdeauna foarte flexibil, astfel încât să puteți aproape să-l răsuciți la nevoile dvs. atunci când proiectați diferite părți ale site-ului dvs..
O suprapunere de rețea, cu ghidaje în Photoshop. Folosirea unui sistem de rețea în design vă permite de asemenea un simț al uniformității și familiarității - deși este posibil ca anumite site-uri să aibă un design extrem de diferit, multe dintre ele nu vor fi așa și veți dori să aveți o structură uniformă și mai structurată simțiți aspectul principal. Acest lucru face, de asemenea, mult mai ușor atunci când veniți să codificați designul, deoarece va însemna că puteți alege elementele uniforme în designul dvs. și aplicați acest efect modular asupra codului și structurii dvs. CSS.
De dragul echilibrului, hai să ne uităm la unele ...
În primul rând, mulți oameni - în special cei care sunt noi în proiectarea sau proiectarea cu rețele - pot găsi că sistemele de rețea sunt destul de sufocante și limitează creativitatea. Din păcate, acest lucru se poate întâmpla uneori și - iartă-te de hârtie - poate că uneori simți că te împiedică să gândești în afara casetei și, în schimb, să creezi proiecte foarte clare, clinice. În astfel de cazuri, v-aș încuraja să încercați și să vă retrageți din grilă - în loc să jucați cu elementele de pe o pagină până când se simt ca ele să pară că sunt în locul potrivit, apoi treceți la grilă care îți acoperă designul (vom vorbi mai mult despre asta puțin) și vezi cum poți face ca ideile tale să funcționeze în structura rețelei pe care o ai. Dacă nu este conformă cu proiectarea rețelei, atunci poate fi timpul să începeți să lucrați cu un alt sistem de rețea sau cu un design.
Sistemele de rețea sunt, de asemenea, într-adevăr, într-adevăr greu. Nu numai că au nevoie de multă voință pentru a-ți lua capul în primele momente pe care le folosești (deși probabil vei avea un moment "aha!", Nu după mult timp după o bună practicare și joacă cu ei) implică o mulțime de matematică și calcule. Nu sunt cineva care se descurcă bine cu a face multă matematică - astfel încât partea de lucruri pe care o pot găsi personal foarte dificilă. De asemenea, este foarte greu doar să vă înțelegeți conceptul de grile și cum vă pot ajuta designul - dar, sperăm, veți începe să vedeți efectul imediat după ce le utilizați în desenele dvs., așa cum probabil ați fi făcut cu dvs. practici de dezvoltare undeva în jos. Și în timp ce grilele sunt greu de manevrat, merită cu siguranță pentru rezultatul final.
Iată câteva sfaturi simple și practice pentru utilizarea sistemelor de rețea în desenele dvs.:
Până acum ar trebui să aveți o idee destul de bună despre sistemele de rețea, despre ce sunt și modalități utile pe care le puteți începe să le utilizați în desenele dumneavoastră. Următorul articol va vorbi despre cum să alegeți sistemul dvs. de rețea - și dacă alegeți să vă creați propria dvs. sau să lucrați cu un cadru prestabilit.
Între timp, aș face ceva mai multă planificare. Destul de puțin o sarcină scurtă (te descurci destul de ușor aici!), Dar schițează în jurul tău în notepad-urile tale, jucând cu grile și aspect. Gândiți-vă la toate despre structură, utilizând coloanele ca o idee pentru a vă baza conținutul în jurul grilei. Ceea ce creați ar putea să nu fie nici un bine veni în dimineața următoare, dar vă va ajuta cel puțin să vă concentrați asupra gândirii la grile și să vedeți ce puteți face cu ei într-un format de aruncător.
Accentsconagua