Tendințe în design web. Icoanele sunt principalul element decorativ. Fonturi mari și îndrăznețe
Inițial, a fost planificat să posteze o traducere a unui articol în limba engleză despre tendințele de design web în 2017, dar după ce am studiat surse diferite, a decis să schimbe ușor conceptul acestei note. Totul este despre ce luna trecuta Pe Internet au fost publicate destul de multe materiale tematice despre cele moderne, iar opiniile, după cum se spune, diferă. Pe de o parte, acest lucru este logic, pentru că Diferiți autori au propriile lor ipoteze despre ceea ce va fi relevant pentru site-uri web în acest an. Pe de altă parte, aceste previziuni sunt foarte subiective.
În general, am adunat toate opțiunile și am compilat ceva de genul un rezumat al tendințelor de design web 2017. Să începem cu cele mai populare tendințe, care sunt observate de mulți experți, și să trecem treptat la idei mai „unice”. Apropo, dacă aveți completări și păreri pe această temă, nu ezitați să le împărtășiți în comentarii. În plus, vă recomandăm să citiți despre - de asemenea, o postare utilă.
1. Design „abstract” non-standard
Grila pentru site-uri web este considerată oarecum stabilită concept de bază, care ajută la organizarea corectă a spațiului unei pagini web. În același timp, ea a împins designeri deosebit de creativi în anumite limite. Cu toate acestea, întotdeauna au existat temerari care creează soluții originale care nu sunt controlate de niciun fel de granițe rigide. Astfel de lucrări, de regulă, se găsesc în subiecte de imagine și creative, dar în 2017 această tendință de design de site web se va răspândi la proiecte corporative stricte.
Aranjamentul non-standard al elementelor oferă mai mult oportunități interesante: Vă permite să utilizați întregul spațiu al paginii, adăugând straturi de obiecte și un sentiment de profunzime aspectului dvs. Veți putea implementa un design care va impresiona utilizatorii chiar și fără colorat video pe ecran complet sau animație. Cu sute de mii de machete clasice pe web, desenele abstracte, unice, aproape întotdeauna vor ieși în evidență și vor atrage atenția vizitatorilor site-ului (cum ar fi factorul WOW). Și trebuie să folosești asta!
2. Noi opțiuni de navigare
Pentru un proiect non-standard - un meniu avansat. Astăzi nu trebuie să plasați unul orizontal în antet. Datorită popularității în creștere layout-uri adaptive Mulți utilizatori s-au obișnuit deja cu pictograma meniului Hamburger (constă din trei dungi orizontale), care apare din ce în ce mai mult pe versiuni obișnuite site-uri. Linia dintre designul mobil și cel desktop se estompează treptat. Anul acesta vom vedea o mulțime de experimente cu plasarea și forma meniurilor - aceasta ar putea deveni una dintre principalele tendințe de web design din 2017.
Astfel de soluții vă permit să utilizați spațiul paginii într-un mod diferit. Pe lângă derularea intuitivă în jos și în lateral, precum și fixată bloc vertical Diverse elemente de alunecare ascunse vor fi populare în navigație. Cu ajutorul lor, puteți plasa toate elementele necesare din submeniu pe un singur ecran. Într-un fel, acest lucru face navigarea pe site mai detaliată și mai utilă pentru utilizatori. Singurul lucru important este că sunt capabili să facă față cu dvs soluție nestandard. Asigurați-vă că îi testați eficacitatea în practică.
3. Carduri în design
Cărțile sunt departe de noua modaîn designul site-ului web, dar în 2017 va continua să fie relevant. Această decizie prezintă în mod eficient informații către platforme diferite: incepand cu aplicatii mobileși terminând cu vizionarea pe ecrane TV mari. Acest format de organizare a datelor va face cât mai convenabil pentru utilizatori să concentreze toate informațiile pe obiecte.
Această abordare este folosită de multe proiecte populare din rețea: Facebook, Pinterest, Netflix. Ultima opțiune este în general un exemplu excelent. implementare cu succes carduri într-un design care combină minimalismul, navigația și eficiența.
4. Împărțiți machetele cu ecranul împărțit în 2 părți
Anul acesta vom vedea mai multe aspecte cu afișare bifurcată a informațiilor pe ecran. Această tendință de web design va fi deosebit de activă în 2017 pe paginile de start și. Vizual, implementarea arată grozav în modelele minimaliste cu fundaluri sau imagini contrastante.
Designerul va putea folosi diverse tehnici de design vizual în blocuri adiacente în cadrul unui proiect web. Iar rezultatul va părea natural. Apropo, aspectele împărțite funcționează bine pentru Call to Action în paginile de destinație. Mai multe detalii despre metoda.
5. Tipografie mare și originală
Îmi amintesc că în 2009 am publicat în cazul în care utilizarea de fonturi uriașe era una dintre tendințele promițătoare de design de site-uri web. Același lucru se va întâmpla probabil în 2017 (cel puțin majoritatea designerilor îl menționează). Motivul principal este, desigur, atragerea atenției: cineva trebuie să scoată în evidență anumite obiecte pe pagină, cineva dorește să explice cum să folosești corect navigarea etc. Oricum, tipografia devine din ce în ce mai groasă și mai mare. Când implementați, puteți găsi postări de blog despre și utile.
În același timp, multe site-uri scapă de standard fonturile de sistem, care vă permite să le diversificați semnificativ aspectul. Odată cu creșterea numărului de servicii gratuite de fonturi web originale (Google Fonts, Typekit), popularitatea acestora va crește și mai mult. Se pare că în 2017 vom vedea și experimente în domeniul tipografiei site-urilor. Principalul lucru în această chestiune este să nu exagerați - amintiți-vă că textul ar trebui să fie bine lizibil. Apropo, dacă lucrați cu WordPress, atunci articolul Cum să conectați un font în WordPress (inclusiv Fonturi Google) vă poate fi util.
6. Degrade și culori strălucitoare
O altă tendință de web design a anului 2017 este utilizarea luminii palete de culori pentru degrade (și mai mult). Începutul erei designului plat adus online caracteristici interesante, dar trebuie să lucrezi în acest stil foarte atent, pentru că poate contribui la depersonalizarea site-ului. Pentru a rezolva problema, unii experți au început să experimenteze culori deschiseși soluții de gradient. Anul acesta, trendul va continua să se dezvolte, și nu doar pe Web (cu siguranță toată lumea a observat deja actualizarea recentă a Instagram).
Această tendință poate fi folosită nu numai pentru fundal. O tehnică populară este de a crea o tranziție între două culori și de a le suprapune pe imagine. Acest lucru vă permite să faceți fotografia mai interesantă și, în general, efectul pare neobișnuit. Culorile strălucitoare adaugă profunzime, dinamism și energie plăcută designului. Ei pot evidenția bine o pagină și elementele de pe ea.
7. Animație și micro-interacțiuni
Animația de pe un site web în sine nu este nouă, dar designerii învață în fiecare an să o implementeze mai frumos și mai eficient. Minor efecte vizuale pentru imagini/obiecte/conținut nu numai că vă poate aduce proiectul la viață, ci și adăuga instrument suplimentar părere cu utilizatorul. În interfețele moderne UI/UX, diverse micro-interacțiuni transformă procesele de rutină în modalități mai distractive de a obține informații + permit utilizatorului să vadă și să înțeleagă cum funcționează acest sau acel element de pagină (meniu, navigare, butoane).
8. Efectul de paralaxă
O altă tendință de design de site-uri web cunoscută anterior în 2017 ar trebui să se deschidă dintr-o latură nouă. Paralaxul în sine este implementat datorită vitezelor diferite de mișcare a fundalului și a primului plan la defilare, ceea ce creează impresia de profunzime și dinamism al imaginii. Anul acesta ne putem aștepta la mult mai mult munca complexa folosind mai multe straturi, diferite direcții de mișcare și aplicarea de efecte. Utilizați această tehnică cu atenție pentru a nu distrage atenția utilizatorilor de la conținutul paginii web. Mai jos veți găsi imagini cu link-uri către site-uri sursă.
9. Aproape realitate virtuală
VR este unul dintre cele mai relevante subiecte astăzi, în ciuda faptului că situația reală în acest domeniu este mai puțin optimistă decât multe previziuni. Desigur, această caracteristică nu a putut să nu influențeze designerii. În unele machete puteți găsi tehnici diferite, care ar crea un „efect de prezență” pentru utilizator: videoclipuri și panorame la 360 de grade, inserții video „ca într-un film”, jocuri etc.
10. Design tactil, natural
Această tendință combină două direcții simultan - culori naturale și design tactil. Entuziasm excesiv apartament soluțiile au transformat multe proiecte web în layout-uri Bootstrap monotone, fără chip. Acum unii designeri încearcă să se îndrepte către soluții mai naturale, de exemplu, postează fotografii și modele 3D realiste, astfel încât utilizatorul să aibă senzația că poate atinge și atinge obiecte de pe site. De asemenea, folosesc materiale naturale ca texturi, ilustrații și fundal + nuanțe naturale (verzi, maro, gri, metalice neutre).
11. Alte tendințe de web design 2017
În procesul de studiu a principalelor tendințe de design de site-uri web din 2017, am întâlnit opinii diferite. Cu cele mai multe opțiuni semnificative L-ați citit deja și acum să vorbim pe scurt despre câteva ipoteze care s-au dovedit a fi mai puțin populare. Unele dintre ele, apropo, au fost utilizate activ mai devreme, dar în acest an tendința va continua.
Puteți face fundalul și mai impresionant adăugând animație sau videoclip. Datorită YouTube și proiectelor similare, conținutul video este acum foarte popular, poți folosi această funcție pe site-ul tău. Dacă adăugați sunet, nu îl activați în mod implicit, utilizatorul trebuie să dorească să o facă singur.
Forme geometrice
Dacă te uiți cu atenție la capturile de ecran ale proiectelor web de mai sus, vei observa utilizarea diferitelor forme geometrice în multe dintre ele. Acestea sunt adesea forme pătrate/dreptunghiulare, dar se găsesc și curbe, triunghiuri și cercuri. Astfel de blocuri pot conține conținut sau pot fi folosite pentru a evidenția fundalul.
Ilustrații unice
Nu am găsit multe lucrări originale în selecție, dar această tendință de web design va fi încă relevantă în 2017. În primul rând, ilustrațiile adaugă o notă personală proiectului dvs. (ceea ce este un mare plus în era machetelor plate). În al doilea rând, metoda funcționează bine cu tipografia personalizată, permițându-vă să creați și mai multe aspecte unice. De asemenea, puteți include aici tendințele de utilizare. fotografii realeîn design/conținut în loc de imagini din fotografii de stoc - originalitatea este întotdeauna la cerere.
Total
Am trecut în revistă primele 10 tendințe în design web pentru 2017, care vor fi acum utilizate cel mai activ de către designeri în munca lor. De fapt, nu au existat atât de multe tehnici originale; o parte semnificativă a tendințelor se repetă din anii precedenți: felicitări, fundaluri strălucitoare, paralaxe, tipografie mare etc. În ceea ce privește fonturile și navigarea, probabil vom vedea opțiuni originale anul acesta. În afară de problema realității virtuale, putem spune că tendința generală este spre simplificare aspect proiecte online persistă, designerii continuă doar să caute cele mai eficiente și moduri interesante implementarea acestuia.
În fiecare an ritmul vieții crește, iar odată cu el și cantitatea de informații crește. Utilizatorii petrec din ce în ce mai puțin timp studiind site-urile web, în timp ce numărul de solicitări impuse acestora crește. Instrumentele de atragere a atenției care se aflau în top în urmă cu un an își pierd eficacitatea. Pentru a rămâne în tendințe și a crea site-uri web la cheie care să atragă clienți, designerii web ar trebui să țină cont de principalele tendințe din 2017 în timp ce lucrează. Cum vor fi? Să ne uităm la asta în acest articol.
Tendințe în design de site-uri web 2017:
- Site-uri cu o singură pagină
Această tendință devine din ce în ce mai comună datorită dispozitivelor mobile. Toate informațiile sunt plasate pe o singură pagină, ceea ce este convenabil să derulați pe telefon sau tabletă fără a utiliza clicuri.
- Derulare
Încă o soluție excelentă pentru site-uri cu același tip de conținut. Dar nu uitați că dă greutate paginii și complică căutarea printre materialele deja acoperite, așa că nu este recomandat pentru crearea de magazine online. Pentru a optimiza munca, puteți utiliza o combinație de navigare clasică și derulare.
- Design minimalist
- Culori deschise
Popularitatea culorilor strălucitoare este în creștere. Folosește mai multe palete și nuanțe dacă vrei să ții pasul cu moda. Pentru a crea libertate de spațiu și o senzație de aer, puteți folosi nuanțe contrastante. Diferite nuanțe și degrade de culori te vor ajuta să diferențiezi mai bine conținutul pe care îl evidențiază.
- Tipografie
Fonturile sunt încă puternice element graficși joacă unul dintre rolurile principale în crearea esteticii unei pagini web, înlocuind alte elemente. Un titlu bun, colorat, arată grozav și pe tablete și smartphone-uri și ajută la transmiterea unui mesaj informațional utilizatorului.
- Animaţie
Elemente mici de animație și design interactiv atrageți atenția, faceți site-ul mai interesant și îmbunătățiți interacțiunea utilizatorului cu acesta. Iar dezvoltarea bibliotecilor JavaScript facilitează crearea unor astfel de pagini.
- Video
Fotografiile de fundal cu ecran lat sunt înlocuite cu videoclipuri cu ecran lat. La fel ca animația, nu numai că creează interes din partea utilizatorului, dar vă permite și să dați viață paginii. Principalul lucru aici este utilizarea imagine de înaltă calitate, corespunzător stilului general al site-ului. Videoclipul ajută nu numai să atragă atenția spectatorului, ci face și posibilă transmiterea unui mesaj informațional către acesta, de exemplu, vorbirea despre companie.
În era dezvoltării tehnologiilor IT, pur și simplu nu poți sta deoparte și urmări ce se întâmplă. Trebuie să se întâmple asta. Pentru a nu fi un străin, trebuie să atrageți cunoștințe din toate sursele posibile și imposibile și ține-te la curent cu toate evenimentele. 2016 se apropie de sfârșit, ceea ce înseamnă că 2017 este deja la colț și va aduce ceva nou în domeniul dezvoltării web. Și ce mai exact, veți citi în acest articol!
Nu fi un străin, ține pasul cu vremurile.
roboții
Paginile web simple nu mai sunt atât de populare, devin din ce în ce mai interactive, mai mult, după un timp ale noastre viata online va fi atât de simplificat de diverse indicații interactive încât nu va trebui să ne încordăm deloc creierul. Boții sunt acum folosiți pe scară largă și acesta este doar începutul. Toată lumea cunoaște aplicația Slack pentru comunicare corporativă și acolo poți găsi și un bot care te întâmpină, îți cere numele și îl introduce imediat în profilul tău. Boții apar în multe alte instrumente și aplicații, deschizând era asistenților online.
Motion UI
Animațiile, videoclipurile, GIF-urile au devenit de mult viața noastră de zi cu zi, totul este atât de plin de viață și de atractiv, de ce altceva are nevoie utilizatorul? Sunt utilizate pe scară largă pentru a crea rapid Tranziții CSSși animații pentru a asigura ușurința în utilizare. Ultimul Versiune în mișcare Interfața de utilizare este echipată cu un sistem de servicii de grup animat, flexibil Șabloane CSS, care au capabilități extinse pentru o tranziție completă și sunt capabile să lucreze cu toate tipurile de animație Biblioteci JavaScript. Suntem mai mult decât încrezători că mobilitatea va înlocui complet utilizarea imaginilor statice.
Adaptabilitate
Mobilul în primul rând este sloganul timpului nostru, în fiecare zi fiecare persoană, măcar o dată (ca să nu mai vorbim de acei dependenți care chiar trăiesc în mâinile lor cu un telefon) caută informații pe internet, trimite mesaje sau efectuează apeluri, așa că utilizarea lor ar trebui să fie cât mai convenabil. Dacă sunteți proprietarul unui site web și încă nu ați auzit despre receptivitate, este timpul să vă luați din picioare și să o implementați , pentru a vă asigura potential client confortul utilizării site-ului dvs. După cum probabil ați observat deja, acesta este un adevărat must-have în lumea designului și dezvoltării web; în plus, vă va ajuta să economisiți în dezvoltarea de aplicații mobile.
Site cu o singură pagină
Te confundă site-urile cu o grămadă de pagini, unde există atât de multe din toate și totul este atât de de neînțeles? Nu vă faceți griji, era site-urilor web cu o singură pagină este chiar după colț. Acest tip de site este foarte popular în rândul companiilor mari, sunt mai ușor de utilizat și este mai ușor să găsiți informații acolo, necesare utilizatorului care a vizitat site-ul într-un anumit scop.
JavaScript este în creștere acum
Javascript este viitorul, în ciuda zvonurilor că are deficiențe și părțile slabe. Nimeni nu contestă faptul că sunt într-adevăr prezenți, dar ce este ideal în această lume? Chiar și Mac OS folosește JS hardware. Mai mult, bibliotecile sale front-end, cum ar fi Angular, Node, React câștigă rapid popularitate, precum și alte biblioteci mai mici.
Nu este surprinzător faptul că Javascript a devenit o parte integrantă a stivei standard de dezvoltare web, împreună cu HTML și CSS. Și acest fapt vorbește de la sine.
Efect de paralaxă
Acest efect este cel mai des folosit, dar nu mulți oameni știu exact cum se numește. Pentru a clarifica: Acest Cel mai bun mod adăugați straturi volumetrice pe site , poate fi folosit și pentru a adăuga un efect 3D uimitor.
Tendințe care vor schimba lumea
În acest articol, am adunat toate tendințele promițătoare de dezvoltare web care vor schimba imediat lumea. Dar nu știm încă ce tendințe ne rezervă 2017. Fii informat tehnologii moderneși poate într-o zi vei fi atât de inspirat de ceea ce se întâmplă, încât vei veni și tu cu ceva revoluționar?
” de John Moore Williams, șeful Strategiei de conținut la Webflow.
Sfârșitul anului curent este chiar după colț și fiecare web designer s-a întrebat măcar o dată problema importanta: Ce va defini designul web în 2017? Am decis să găsesc răspunsul la această întrebare și i-am întrebat pe designerii WebFlow ce tendințe credeau că vor domina în următoarele 365 de zile. Am dat și propriile mele comentarii la gândurile lor.
În primul rând, să obținem opinia liderului designerului Webflow, Sergie Magdalin.
1. Design bazat pe conținut
„Dispunerea elementelor de design într-o structură dată ar trebui să fie astfel încât cititorul să poată înțelege cu ușurință ideea principală fără a-și reduce viteza normala citind" -Hermann Zapf
În ultimii câțiva ani s-a înregistrat o schimbare dramatică în gândirea despre rolul designului în afaceri. Anterior, designul era văzut ca pasul final în procesul de creare a unui obiect: designerul-magicul vine la sfârșit și stropește praful magic pe produsul nostru pentru a-l face mai bun decât concurența.
A fost foarte interesant să urmărim metamorfozele care au loc cu prioritățile de dezvoltare.
Iar cel mai frumos lucru la aceste metamorfoze a fost trecerea la un model în care conținutul stă din nou în fruntea mesei. Designerii din întreaga lume și-au dat seama că utilizatorii vizitează site-urile web în primul rând pentru conținut, fie că este vorba de tweet-uri scurte, articole specializate de lungă durată sau cele mai recente meme-uri de pe Internet. Rolul suprem al designului este de a prezenta conținutul în modul cel mai atractiv și de înțeles și de a obține cele mai bune rezultate din acesta.
Acesta este unul dintre motivele tranziției de la designul „skeuomorf” (atunci când elementele sunt descrise cât mai asemănătoare cu omologii lor în lumea reala) la un design plat, minimalist. Din aceste considerente, Google a creat Material Design.
Desigur, după cum afirmă a treia lege a lui Newton, pentru fiecare acțiune există o reacție la fel de puternică. Mulți designeri cred că moda este design plat„a ucis” chiar spiritul designului. Ne așteptăm ca această dezbatere să continue și în anul care vine, dar accentul va rămâne pe conținut - baza oricărei lucrări de proiectare.
2. Interacțiune de înaltă calitate între designeri și dezvoltatori și designeri între ei
Importanța designului în modelarea afacerilor este în creștere, așa că se pune tot mai mult accent pe designeri care lucrează împreună cu colegii lor designeri și colegii lor dezvoltatori.
Această preocupare pentru interacțiunea cu designerii a apărut în parte din cauza volumului masiv de aplicații mobile și web care sunt dezvoltate astăzi. Pe lângă faptul că astfel de corporații gigantice precum Google, Facebook, Twitter și LinkedIn necesită munca titanică a unei echipe de design cu absolut laturi diferite, designerii trebuie să fie mereu pe aceeași pagină unii cu alții. Aceasta înseamnă că este nevoie de o mai bună comunicare asupra proiectului și a modului în care să se facă cel mai eficient colaborare.
Pentru a face această sarcină mai ușoară, au fost create multe instrumente, de la șabloane de echipă și panouri din Echipa Webflow la editor grafic Interfețe Figma care arată modificări în timp real. Sunt sigur că în 2017 aceste platforme vor fi îmbunătățite și completate.
Dacă vorbim despre interacțiunea dintre designeri și dezvoltatori, se acordă multă atenție proces important transferul muncii. De exemplu, în loc să trimită imagini statice grele și voluminoase, designerii pot acum să partajeze machete redate live datorită instrumentelor precum InVision, Marvel, UXPin.
Carson Miller a analizat acest lucru în articolul său recent „The Future of Front-End Design” de pe TechCrunch:
„Mai devreme sau mai târziu, instrumentele pentru crearea de design și modele de design vor înlocui complet dezvoltarea front-end. Puteți crea cu ușurință o bază de înaltă calitate pentru oricare dintre cadrele dvs. fără a fi nevoie să scrieți codul manual.”
3. Proces simplificat de la designer la dezvoltator
Instrumentele de proiectare și prototipare menționate mai sus vă permit să vizualizați diferitele etape ale colaborării prin vizualizări care variază de la fișiere animate Keynote până la site-uri web complet funcționale. Această metodă de partajare a materialului de lucru reduce timpul de răspuns în cadrul proiectului, crescând astfel calitatea designului, crescând viteza echipei de dezvoltare și reducând posibilitatea de dezamăgire față de rezultat. De asemenea, îmbunătățește interacțiunea cu clienții. De exemplu, pentru mulți utilizatori WebFlow, întâlnirile cu clienții s-au transformat în întâlniri de lucru cu drepturi depline, unde designerii pot implementa rapid idei și toată lumea își poate testa ideile aproape imediat.
Tendințele de design web în anul viitor, potrivit designerului de produse Gadzhi Kharkharov:
4. Titlu mare, tare
Pe măsură ce lumea designului web începe să se concentreze asupra conținutului, este din ce în ce mai obișnuit să vedeți titluri inspiraționale pe site-uri web cu fonturi la fel de mari și îndrăznețe ca și conținutul lor.
Partenerii Heco #MadeInWebflow
După cum puteți vedea din exemple, „mare” și „aldine” nu se referă doar la descrierea fontului. Mai degrabă, este vorba despre dedicarea unei părți semnificative a ecranului de pornire unei declarații simple, dar puternice și autonome despre produs sau serviciu. Un astfel de titlu ar trebui să conțină esența și să fie ușor de înțeles pentru orice vizitator, evitând pompozitatea inutilă (bine, expresia „Proiectează imposibilul” poate suna prea tare).
În mediul aglomerat de astăzi, supraîncărcat de informații, declarații scurte și puternice ca acestea funcționează bine pentru orice marcă.
5. Markup complex care provine din elementele de bază ale designului grafic
Dacă vrem să anticipăm dezvoltarea designului web (cel puțin latura sa vizuală), trebuie să ne uităm la istoria designului grafic.
În ultimii ani, aspectul paginii web a fost limitat Capabilitati CSS, dar module noi precum Flexbox și Grilă CSS(care va fi lansat în martie 2017), vă va permite să implementați cele mai îndrăznețe idei în markup web.
Al nostru sarcina principală acum - pentru a înțelege cum ar trebui să funcționeze noile capacități de aranjare a rețelei ale blocurilor în cadrul design adaptiv.
Iată câteva exemple de la ce să vă așteptați (presupunând că aveți un browser care acceptă CSS Grid, cum ar fi Firefox Nightly, Safari Technical Preview sau Chrome Canary):
Laborator de amenajare experimentală Jen Simmons
Acordați atenție stilului blocului principal - o referire clară la istoria designului grafic.
Grilă după exemplu
Puteți vedea mai multe exemple pe site.
6. Mai multe SVG-uri
SVG (grafică vectorială scalabilă) Grafică vectorială) Are mai multe beneficii pentru designeri și dezvoltatori web decât formatele de imagine tradiționale, cum ar fi JPG, PNG sau GIF.
Principalele avantaje ale SVG sunt descrise chiar în numele formatului - scalabilitate și vector. Spre deosebire de formatele bazate pe raster și pixeli, imaginile SVG sunt formate din vectori - descrieri matematice ale formei unui obiect. Aceasta înseamnă că SVG este independent de rezoluție, iar imaginile în acest format vor arăta grozav pe orice ecran și dispozitiv. Nu este nevoie să vă faceți griji că imaginile sunt neclare pe retină.
Dar asta nu este tot. SVG este, de asemenea, renumit pentru că nu necesită trimiterea solicitărilor HTTP. Dacă ați verificat vreodată viteza de încărcare a site-ului dvs. web, este posibil să fi observat că aceste solicitări HTTP pot încetini cu adevărat site-ul dvs. Nu există o astfel de problemă cu SVG.
7. Instrumente pentru proiectarea receptivă bazată pe reguli
Designul responsive a schimbat complet modul în care privim aplicațiile web și le creăm.
Dar, în mod ciudat, principiul de funcționare al programelor de proiectare nu s-a schimbat deloc. Cele mai multe dintre aceste instrumente funcționează astfel: trebuie să creați o pagină similară din nou și din nou diverse dispozitive si permisiuni. Într-o industrie care necesită generare rapidă de idei, dezvoltare rapidă și pornire rapidă, o astfel de pierdere de timp este pur și simplu inacceptabilă.
Un nou val de instrumente de design (cum ar fi Figma) este de așteptat să se bazeze pe „reguli” care ajustează aspectul site-urilor pe diverse ecraneși dispozitive, reducând astfel numărul de acțiuni repetate ale designerului. Astfel de instrumente se bazează pe relațiile spațiale ale elementelor și, pe măsură ce schimbăm dimensiunea ecranului sau dispozitivul, ele se străduiesc să mențină aceste relații prin modificarea dimensiunilor elementelor și a umpluturii dintre ele.
Apropo, astăzi există instrumente similare pentru aspectul site-ului web nu numai pentru designeri, ci și pentru utilizatorii obișnuiți. De exemplu, TruVisibility.com - platforma adaptează designul creat exact după anumite reguli, conform cărora aspectul și dimensiunile elementelor sunt ajustate la dimensiunea ecranului. Tot ce rămâne este să faceți câteva ajustări pentru a vă asigura că pagina web arată așa cum ar trebui pe dispozitive. Utilizatorul nu trebuie să recreeze versiunea pentru dispozitive mobile și asta îi economisește mult timp.
Tendințele de design pentru 2017 conform lui Ryan Morrison, designer grafic senior.
8. Mai multe culori luminoase
Când era minimalismului și brutalismului a început în designul web în 2016, designerii au încercat să adauge mai multă personalitate muncii lor fără a depăși stilurile la modă. Și există cel puțin câteva cazuri în care culorile strălucitoare și îndrăznețe au fost folosite cu mare succes.
Aruncă o privire la noul site Asana cu o pată de culoare:
Pictogramă nouă Aplicații Instagram a primit multe critici, dar această reproiectare a reîmprospătat, fără îndoială, marca:
Tot ceea ce Stripe nu necesită o vizualizare separată:
După cum puteți vedea, nu sunt doar culori strălucitoare și îndrăznețe. Degradeurile revin și ele în stil, amestecând și estompând culorile în nuanțe care amintesc de cerul de la amiază sau de un apus de soare strălucitor. Este o renaștere a naturalismului cu culori strălucitoare și degrade îndrăzneți și personal aștept cu nerăbdare să văd mai multe lucrări similareîn 2017.
Deși, poate merită să reduceți puțin luminozitatea? Te urmărim, Asana.
9. Mai mult accent pe animație
Elementele animate au fost redate de mult timp Rol cheieîn interfața web, iar această tendință va continua în 2017. De fapt, atâta timp cât designerii au acces la instrumente pentru a dezvolta animații convingătoare, vom vedea că aceste efecte devin mai vizibile și mai sofisticate.
Acest subiect este deosebit de important deoarece crearea animației devine din ce în ce mai ușoară în fiecare zi. La Conferința Design & Content din 2016, guru al animației Val Head a subliniat că atunci când proiectează elemente animate, designerii ar trebui să țină cont de obiectivele și nevoile mărcii pentru a obține efectul pe care creatorii de conținut se așteaptă. Dacă acest sfat este luat în considerare, animația va îndeplini sarcini care sunt semnificative pentru brand și nu doar să îi provoace o migrenă utilizatorului.
10. Marcaje neobișnuite
2016, ca și anii precedenți, este renumit pentru discuțiile nesfârșite conform cărora designul web fie moare, fie își pierde spiritul.
Cei care încearcă să convingă pe toată lumea că designul web a murit, exagerează în mod clar. Mulți continuă să caute modalități de a prezenta conținutul utilizatorilor în moduri noi. Una dintre cele mai tentante moduri este de a sparge sistemul și de a ignora aspectul obișnuit al grilei dictat de regulile designului responsive.
Metoda de marcare „ruptă” implică elemente care trec dincolo de grila aliniată meticulos. Astfel de tehnici pot părea uneori chiar neplăcute pentru ochi. De exemplu:
Texte și imagini care se ciocnesc unele de altele:
Texte și imagini împrăștiate (aparent) aleatoriu pe pagină:
Aceasta a fost prima parte a traducerii articolului „18 tendințe de design web în 2017”. Sunteți de acord cu opiniile experților Webflow? Ce fel de web design crezi că va fi la modă în anul viitor?
Liniile, culorile, lumina și umbra, spațiul și formele sunt elementele care alcătuiesc un tablou. Fiecare epocă a avut propriile sale tendințe în reprezentarea lumii. Designerii web sunt aceiași artiști, doar că ei creează format digital. Și dacă tendințele în artă nu s-au schimbat atât de des, atunci designul web se transformă de la an la an. Vom încerca să alcătuim un ghid al tendințelor design graficși preziceți cum se vor schimba site-urile web în 2017. Puteți citi despre tendințele de web design din 2018.
Deci, 14 se transformă pe drumul către o interfață la modă:
1. Concentrați-vă pe conținut
Ce este mai important: conținutul sau designul paginii. Răspunsul este simplu - designul ar trebui să prezinte conținutul în mod favorabil. Designerii serviciului WebFlow (constructor de site-uri web) propun să pună capăt luptei pentru supremație în 2017, acordând preferință conținutului. Un utilizator vizitează un site web în căutarea unui răspuns la o întrebare, fie că este un produs, un serviciu sau un articol util. Sarcina designerului web este de a prezenta conținutul cât mai convenabil posibil pentru o persoană.
2. Evitați „hamburgerii”
Pictogramă de meniu mică și convenabilă în forma de trei Banda, supranumită „hamburger” pentru asemănarea cu straturile de fast-food, își pierde treptat din popularitate. Este folosit prea des. În 2017, sunt încurajate experimentele cu navigarea și aranjarea neobișnuită a secțiunilor de meniu, de exemplu pe un cadru în jurul site-ului.
3. „Design bazat pe carduri”
Designul web cu carduri a cucerit rapid internetul. Avantajele acestei metode de proiectare:
- amplasarea convenabilă a blocurilor pe site;
- prezentarea vizual avantajoasă a conținutului;
- adaptabilitate pentru dispozitivele mobile.
La întrebarea: a fi sau a nu fi design cardîn 2017, nu există un răspuns unanim. Va fi folosit pentru că și-a dovedit deja eficacitatea.
Dar designul bloc își pierde treptat poziția de favorit din cauza naturii „aglomerate” a unei astfel de interfețe. Minimalismul și designul plat rămân populare. Elemente de navigare clare și convenabile, fără manevre inutile, utilizarea doar a câtorva culori în design sunt tehnici testate în timp.
4. Plasă ruptă
Această tendință încurajează designerii să gândească în afara cutiei. Încercați să utilizați o grilă non-standard pe site - lăsați blocurile să se „suprapună” puțin unele pe altele și lăsați textele să depășească limitele obișnuite.
Originalitatea este mereu la modă. Aspecte personalizateși noi abordări ale design grafic Designerii occidentali au încercat-o deja. Cele mai îndrăznețe soluții pot fi implementate folosind modulele Flexbox și CSS Grid.
5. Fonturi neobișnuite atrăgătoare - părtinire tipografică
Fontul mare este unul dintre elementele principale ale designului web de câteva zile. Tendința se va consolida doar în noul an. Tendința sunt inscripțiile scrise de mână și icoanele stilizate ca fiind realizate manual.
O completare excelentă la designul site-ului web ar fi grafica cu fonturi (dacă este cazul).
6. Design receptiv
Versatilitatea site-urilor pentru dispozitive cu ecrane mari și mici nu mai este o nouă tendință. Abordarea „în primul rând pe mobil” este încă relevantă în 2017. Pe lângă capacitatea de adaptare la gadgeturi mobile, în viitorul apropiat site-urile ar trebui să se adapteze unui anumit utilizator în funcție de:
- vârstă;
- aptitudini (competențe).
De exemplu, fonturile, luminozitatea culorilor, navigarea se vor schimba în funcție de cine a vizitat site-ul: un pensionar, un preșcolar, un novice pe internet sau un utilizator încrezător. Acest lucru va deveni posibil datorită dezvoltării metadatelor.
7. Culori
Culorile monotone bogate, nuanțele și semitonurile lor au trecut de la tendințele de anul trecut la anul acesta. Designerii continuă să folosească gradienți și să creeze tranziții interesante. Apropo, dacă nu vă puteți decide cu privire la alegerea culorii, aruncați o privire mai atentă la „Greenery” la modă.
Seamănă cu verdeața proaspătă de primăvară și va contribui la adăugarea de accente de culoare site-ului. Experții de la Pantone Color Institute au numit-o culoarea anului 2017.
8. Infografice
Tehnica nu este nouă, dar eficientă. Cu ajutorul infograficelor, orice statistică de pe site este transformată într-o imagine ușor de înțeles vizual, cu conținut interesant.
9. Animații
Paginile statice sunt plictisitoare. Este mult mai interesant pentru utilizator să „plimbă” un site cu pictograme animate. Atrageți atenția prin animație asupra acelor elemente care vă sunt benefice, de exemplu, la butonul „Cumpărați”.
Utilizați microinteracțiuni astfel încât utilizatorul să vadă un răspuns la clicuri, tranziții și confirmări de pe site. Atunci acțiunile mecanice vor deveni interactive și atractive.
10. Fotografii și videoclipuri de fundal
Animația este bună, dar fotografiile și videoclipurile de fundal în format larg pentru designul site-ului web sunt și mai bune. Videoclipul adaugă dinamică unei resurse web și vă permite să cufundați utilizatorul într-o anumită poveste, să priviți „în culise” proceselor interne ale unei companii sau mărci. Povestirea în web design este încă relevantă. Fotografie - ilustrează, creând o atmosferă.
Dacă te-ai săturat de aceste elemente, folosește cinemagraphs (o simbioză de fotografii și videoclipuri). Într-o astfel de imagine, doar un element se mișcă continuu fără probleme, ca și cum o parte din fotografie prinde viață.
11. Opriți „stoc”!
Fotografiile stoc sunt găsite în fiecare colț al internetului, iar acest lucru poate face ca un site să-și piardă personalitatea. În 2017, web-ul dă preferință imaginilor unice.
12. Derularea +
Derularea a câștigat popularitate datorită gadgeturi mobile, din care este mai convenabil să „defilați”. Dar mulți oameni sunt enervați de faptul că nu pot ajunge în partea de jos a paginii. Printre tendințele anului 2017 se numără combinația de defilare și navigare pe pagină. Permiteți utilizatorului să aleagă cum să vizualizeze conținutul.
13. Defilare Parallax
În 2017, tehnica paralaxei (mișcarea mai departe viteze diferite fundal și prim-plan) vor câștiga un nou suflu - dezvoltarea unor tehnici mai complexe multistratificate. Experimentați cu paralaxa, captivați persoana care vizitează site-ul elemente interactive. Dar nu exagerați pentru a nu deruta utilizatorul.
14. Panorame 3D
Panoramele la 360° sunt o altă modalitate de a demonstra în mod eficient un produs utilizatorului sau de a „oferi” vizitatorului posibilitatea de a fi prezent virtual într-un loc, de exemplu, într-un birou sau un hotel al companiei.
.jpg)
Acestea sunt principalele tendințe de web design pentru 2017. Dar nu te concentra doar asupra lor. Experimentează, învață de la colegi cu experiență, iar apoi site-ul tău va deveni original și ușor de înțeles pentru toți utilizatorii. Și suntem mereu pregătiți pentru tine în asta!
