Design plat și design material: care este diferența lor. Design plat: trecut, prezent și viitor

Relativ recent, o astfel de direcție de design precum designul FLAT sau designul plat a devenit populară.

Utilizatorii Windows 8 și versiunile ulterioare sunt deja familiarizați cu designul FLAT, deoarece primul lucru pe care îl întâlnesc la încărcarea sistemului este acest ecran.

Însuși aspectul designului FLAT se datorează răspândirii aplicațiilor mobile. Și cred că acest lucru se datorează faptului că obiectele de design FLAT sunt create folosind obiecte vectoriale și, în consecință, sunt mai ușor de adaptat la diferite platforme gadget.

FLAT – designul are următoarele caracteristici:

Respingerea completă sau parțială a degradeurilor, texturilor complexe și umbrelor , de care personal sunt foarte fericit. Nu am nicio plângere cu privire la umbre și îmi place să le folosesc și eu, dar lasă eternele probleme cu afișarea în gradient să dispară.

Tipografia, geometria vin în prim plan. Mai ales când vine vorba de web design.

Armonia și. Designul folosește un număr limitat de culori. Iată un exemplu de populară paletă de design FLAT.

Utilizarea pictogramelor informative creative.

După cum am spus deja, designul FLAT a devenit foarte popular în aplicațiile mobile, deoarece caracteristica sa principală este simplitatea aspectului și adaptabilitatea. Designul FLAT a devenit larg răspândit și în infografică, deoarece se bazează pe percepția armonioasă a informațiilor prin utilizarea tehnicilor constructive de tipografie și culoare.

La un moment dat, cea mai populară tendință în design web a fost Web 2.0. Acum locul său a fost luat de designul FLAT. Moda are obiceiul de a se întoarce la vechiul bine uitat pentru a face ceva nou din ea. Cine știe când designul FLAT va demoda, dar deocamdată bucurați-vă de simplitatea, armonia și conținutul informativ al tendinței actuale. Apropo, designul plat era deja popular în anii 80, dar apoi s-a datorat caracteristicilor tehnice și incapacității de a afișa umbre și degrade. Și acum majoritatea companiilor IT de top au trecut la designul plat.

Ei bine, și noi ne vom adapta la lumea în schimbare. În articolul următor, vă voi arăta cum puteți crea pictograme în stil FLAT folosind forme simple în Photoshop.

Dacă publicațiile mele vă interesează, atunci vă sugerez să fiți la curent cu cele mai recente actualizări de pe site.

(Vizitat de 2.159 ori, 1 vizite astăzi)

Cuvântul „plat” tradus din engleză înseamnă „plat”. Încă de la înființare, așa-numitul design Flat a continuat să-și mențină poziția de câțiva ani, ocupând o poziție de lider pe piață.

Unde a început totul

Designul web s-a schimbat de multe ori de la începuturi. A parcurs un drum lung de la elemente simple și plictisitoare la elemente tridimensionale, convexe și aproape materiale. Acest lucru poate fi observat cu ușurință în exemplul de modificare a aspectului sistemului de operare Windows. Componenta vizuală se dezvoltă în paralel cu dezvoltarea tehnologiei. Dar noile sale tendințe indică, mai degrabă, o întoarcere la minimalism și simplitate.

De la skeuomorfism la design plat

Stilul care a precedat bemolul a fost skeuomorfismul. A fost o tendință majoră de design de foarte mult timp. Skeuomorfismul este un stil pseudo-volumetric, ale cărui elemente imită aspectul obiectelor reale (caiet, ceas cu alarmă), folosind umbre, texturi naturale și alte lucruri. Exemplele sale izbitoare au fost găsite în interfețele timpurii pentru smartphone-uri. A început să-și piardă poziția după 2010, când designerii marilor companii au început să privească spre simplificare și, la dezvoltarea interfețelor cu utilizatorul, au început să scape de principala caracteristică a skeuomorfismului - tridimensionalitatea.

Un exemplu vizual excelent al diferenței de stiluri este fotografia de mai jos. Imaginea din stânga este un design plat, în timp ce cea din dreapta este skeuomorfism.

Caracteristicile stilului plat

Flat este un stil bidimensional. Nu are absolut niciun efect vizual, cum ar fi tranziții netede de culoare, umbre sau texturi tridimensionale. Într-un cuvânt, tot ceea ce face imaginea tridimensională.

Conținutul principal de informații este conținut în pictograme (pictogramă design plat). Ele ar trebui să fie cât mai clare posibil pentru utilizator atunci când vine vorba de aplicații pentru smartphone. Pentru site-uri web, pictogramele sunt principalele elemente care reflectă specificul și mesajul informativ al acestuia. De regulă, ele sunt prezentate sub formă de forme geometrice simple, un cerc sau un pătrat, cu o imagine convențională caracteristică.

La dezvoltarea designului plat, se acordă atenție și schemei de culori. Ar trebui să fie monoton, nu intruziv și să nu distragă atenția utilizatorului. Cel mai adesea, se utilizează o culoare pură și mai multe nuanțe contrastante. Apropo, există multe servicii de Internet cu seturi de culori cu design plat pe care le puteți folosi prin copierea codurilor hexadecimale ale culorilor care vă plac.

Nu mai puțin important este un astfel de lucru precum tipografia (textul). Datorită simplității generale, componenta de text iese în evidență în special. Aceasta înseamnă că ar trebui să fie lizibil și să nu contrazică stilul general. Acest lucru va depinde de alegerea cu succes a fontului și a culorii acestuia.

Exemple de design plat

Să începem cu faptul că pictogramele multor resurse de internet și rețele sociale cunoscute s-au schimbat într-un mod mai plat. Nu cu mult timp în urmă, giganții Google și YouTube și-au schimbat și designul în plat. Sistemul de operare Windows, începând cu cel opt, a abandonat complet toate semnele de volum din pictograme, ceea ce a încântat ochii unor utilizatori în versiunile anterioare și a început să adere la designul plat. Dezvoltatorii de aplicații mobile pentru iOS și Android au urmat exemplul.

Site-urile web cu o singură pagină (pagini de destinație) folosesc pe scară largă avantajele designului plat, pentru care rolul decisiv îl joacă nu aspectul pretențios, ci funcționalitatea și lizibilitatea.

Evoluția designului plat

La început, designul plat a fost într-adevăr complet plat, ceea ce a creat anumite dificultăți pentru utilizatorii obișnuiți cu butoanele convexe. Dacă în skeuomorfism clicabilitatea butoanelor a fost imediat vizibilă, atunci în primele variații ale designului plat nu a fost întotdeauna posibil să se determine interactivitatea elementelor prima dată.

După ce Microsoft a lansat Windows 8, proiectat într-un stil plat, nu toți utilizatorii au putut să-și dea seama imediat noua interfață și pe ce pictograme puteau face clic. Apariția elementelor nu a indicat în niciun fel o posibilă interacțiune cu acestea. Acest design a fost mai convenabil pentru aplicațiile mobile, care au preluat această idee. Și Apple a fost primul care a făcut acest lucru cu iOS 7.

Cu toate acestea, designul plat nu stă pe loc și evoluează spre mai multă complexitate. Astăzi, arată din ce în ce mai mult ca un design semi-plat sau, așa cum se mai numește, Flat 2.0. În ea au început să apară efecte de adâncime, umbre și degrade. Adâncimea în designul plat este obținută prin aranjarea elementelor la diferite niveluri sau în unghiuri.

Oricum ar fi, stilul este în vârful popularității și este la mare căutare. Deci, dacă intenționați să vă proiectați site-ul web, puteți opta în siguranță pentru Design plat. Și dacă aveți nevoie de unele elemente lipsă pentru site-ul dvs., atunci pe Internet puteți găsi un număr mare de elemente de UI cu design plat gratuit (de descărcat gratuit), cum ar fi pictograme, fonturi, șabloane și alte componente necesare ale interfeței cu utilizatorul.

Avantaje și dezavantaje ale stilului

Fără îndoială, în viața rapidă de astăzi, un stil atât de discret și informativ este mai convenabil decât predecesorul său. Designul plat are o serie de avantaje incontestabile.

Cel mai important lucru, poate, este încărcarea rapidă a paginilor web. Site-urile web care folosesc design plat se deschid mult mai repede decât cele care sunt supraîncărcate cu animații și alte obiecte grele. Timpul de încărcare este deosebit de important pentru optimizarea SEO și promovarea site-ului în vârf.

Un aspect simplificat face textul mai ușor de citit și vă permite să vă concentrați asupra conținutului principal.

Designul arată armonios și holistic, ceea ce creează o impresie generală plăcută.

Nimic nu poate fi perfect și designul plat nu face excepție. Cu toată simplitatea sa aparentă, dezvoltarea unui design web plat cu adevărat de succes nu este atât de ușoară. Există posibilitatea de a-l face plictisitor și neatractiv. Sau, dimpotrivă, exagerați cu designul și uitați de funcționalitate. Sarcina principală atunci când se dezvoltă designul plat este de a menține echilibrul perfect între frumusețe și ușurință în utilizare.

Revoluția „designului plat” a continuat să câștige avânt de când a fost introdusă pe platforma Windows Phone în 2010. Nu este greu de înțeles de ce: o interfață cu acest design pare mai intuitivă, este potrivită pentru elemente adaptive, cadre moderne și arată atractivă atunci când este executată corect.
Designul plat a început ca o contrapondere a stilului skeuomorf omniprezent, dar de atunci a devenit mult mai mult decât „Opțiunea B”.

Inițial, flat a fost exclusiv bidimensional, cu un accent total pe minimalism. Modern flat 2.o folosește umbre, degrade și alte elemente pentru a-l face să pară „aproape plat”.

5 componente caracteristice ale designului plat modern:

1. Umbre lungi
Umbrele lungi adaugă profunzime și dimensiune imaginilor fără a fi nevoie să sacrifice detaliile minimaliste ale pictogramelor care fac o interfață atractivă.

2. Culori dinamice
Completarea imaginilor rare este ușoară cu culori energice, în special nuanțe deschise.
Culorile de fundal diferite, în contrast cu culoarea de bază a elementelor, fac pagina cu un meniu în mosaic mai animat.
Site-ul Flat UI Colors conține cele mai eficiente modele de culoare pentru plat.

3. Tipografie simplă
Alegerea fontului în beton se bazează pe un singur criteriu: lizibilitatea. În mod obișnuit, sunt utilizate fonturi sans serif cu o lățime constantă a cursei.

4. Buton transparent
Unul dintre elementele de tendință în designul web modern. Motivul este că nu atrage prea multă atenție, dar este clar recunoscut ca buton.

5. Minimalism
Plata și minimalismul merg mână în mână, folosind aceleași principii: simplitate și concentrare asupra conținutului.
Poate părea că folosirea designului plat este o soluție universală, dar minimalismul este dificil de implementat: cu cât sunt mai puține elemente de lucru, cu atât necesită mai multă atenție.

Indiferent cât de grozav ar părea un design plat, nu există nicio garanție că va funcționa pentru site-ul tău. Verificați principalele sale avantaje pentru a vedea dacă merită să planificați o reproiectare globală.

Avantaje:
utilizat într-o interfață receptivă;
simplifică navigarea pentru utilizator;
o structură clară și imaginile schematice subliniază logica internă a paginii;
încărcare rapidă a paginilor datorită simplității graficii;
Tipografia familiară îmbunătățește lizibilitatea.

Designul plat se referă la simplitate și minimalism, ceea ce, pe de altă parte, face dificilă transmiterea de mesaje vizuale complexe. Prin urmare, înainte de a vă grăbi să simplificați interfața, ar trebui să luați în considerare cu atenție interacțiunea dintre site și utilizator.

Bazat pe cartea de tendințe web design.

Designul plat a devenit popular recent pentru aplicații și site-uri web. Acest lucru nu înseamnă că toată lumea iubește acest stil, dar cu siguranță nu este potrivit pentru toate aplicațiile și site-urile. Dacă există multe avantaje ale unui design plat, cum ar fi simplitatea și minimalismul, făcându-l mai ușor de utilizat. Pentru unele aplicații, designul plat poate fi prea simplu. Adică, merită să adăugați niște umbre sau degrade pentru a-l face să arate mai bine.

Mulți susțin că designul web plat este un design eficient. Ei spun că aceasta este o modalitate de a face proiectul cât mai ușor de utilizat. Iată câteva exemple inspiratoare de proiecte de design plat. Această selecție din diverse portofolii este excelentă pentru a înțelege modelele plate care funcționează de fapt.


ISSLlandul

Ianuarie Creative

Maimuță minimă

Ce este designul plat?

  • Designul plat se concentrează pe utilizator
  • Designul plat este simplu
  • Design plat - mai puține degrade
  • Designul plat include linii drepte și colțuri pătrate
  • Utilizați de obicei un contrast puternic de culoare
  • Designul plat nu are umbre, teșituri, texturi sau orice altceva care arată 3D
  • Designul plat există doar în 2 dimensiuni
  • Design plat - o tendință spre simplitate și minimalism
  • Design plat - nu utilizați efecte suplimentare
  • Nu există plusuri
  • Design plat - mai puține butoane și truse pentru caroserie
  • Designul plat înseamnă concentrarea pe fonturi
  • Combinațiile de culori, culorile contrastante și variațiile interesante de culoare sunt componente importante ale designului plat.
  • Designul plat este unul dintre multele modele. Este potrivit pentru unele proiecte, dar nu pentru altele.

Ce nu este designul plat?

  • Designul plat nu este skeuomorfism sau design care emulează forma și contururile „realității”.
  • Designul plat nu include nasturi strălucitori
  • Designul plat nu include decorațiuni
  • În designul plat, nu veți găsi idei tradiționale despre „adâncime”
  • Designul plat nu se potrivește tuturor proiectelor

Este designul plat doar un design eficient?

Unii oameni consideră că designul plat este un design eficient în sine. Adică simplifică utilizarea site-urilor și a aplicațiilor, permițându-vă să găsiți informațiile necesare fără distrageri. Desigur, designul plat nu este singurul care face informațiile mai ușor de găsit. Dacă totul este făcut bine, atunci utilizatorii nu vor avea probleme. Proiectul ar trebui să fie simplu și ușor pentru cei care îl pot folosi. Unii oameni preferă să folosească designul plat, în timp ce alții preferă un stil diferit de design.

Elemente pentru design plat

Îți place designul plat? Iată câteva elemente care pot fi folosite pentru un design „plat”.

Pachet de pictograme plat