Programe pentru web designeri anul acesta. Degrade și culori strălucitoare. Evitarea „hamburgerilor”

Î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 viața noastră online va fi atât de simplificată de diverse prompturi 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ția, 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 creație rapidă Tranziții și animații CSS pentru a asigura ușurința în utilizare. Ultima versiune Motion UI este echipat cu un sistem de servicii de grup de animație, flexibil Șabloane CSS, care au capabilități avansate pentru o tranziție completă și sunt capabile să lucreze cu toate tipurile de biblioteci de animație 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 de 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 slăbiciuni. 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 la curent cu tehnologiile 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?

Ce aduce 2017 nou pe web? Care sunt principalele direcții și tendințe în design web la care ar trebui să ne așteptăm? Acum vom afla totul – în formatul unei recenzii succinte a celor mai izbitoare tendințe, folosind exemple de site-uri TRENDY.

Designul web este actualizat constant cu idei îndrăznețe, iar popularitatea a tot ceea ce este practic stimulează deja dezvoltarea tendințelor. La meniurile care glisează prin butonul hamburger și navigarea care se ascunde automat la derulare, se adaugă moda ecranelor divizate, împărțind paginile principale și celelalte în jumătate.

Citeste si: 8 tendințe web pentru 2019: layout-uri moderne

În ceea ce privește atractivitatea estetică, stilul plat a dominat WEB-ul timp de 3 ani la rând. Apoi Google a introdus designul de materiale, care ne-a scos puțin din abstracția vizuală. În 2017, designul web va face încă un pas înapoi la realism. Fie că este vorba de forme, de alegerea culorii sau de funcționalitate – 2017 va fi anul hibrizilor în care realitățile lumii fizice și ale tehnologiei se intersectează. Rezultatul este o experiență mai bună de navigare pe web.

Iată nouă tendințe de design web care pot reduce decalajul.

1. Navigare pop-out

Astăzi, când publicul mobil deja se bucură de navigarea pe internet, importanța spațiului pe ecran este mai mare ca niciodată. Ascunzând funcționalitatea și navigarea până „până când este nevoie”, designerii web și agenții de marketing moderni se străduiesc să elibereze spațiu pe site-ul web pentru vânzarea imaginilor.

Meniul pop-out, creat special pentru smartphone-uri, îmbunătățește UX și ecrane mari. Destul de ciudat, meniul ascuns face o treabă mai bună de a sublinia ceea ce este important, încurajându-vă să vă concentrați pe un anumit obiectiv la un moment dat. Când deschideți meniul, acesta devine centrul atenției pe pagină și este, de asemenea, utilizat în mod activ în procesul de explorare a site-ului.

Avantaje:

  • Economisirea spațiului pe ecran
  • Concentrând atenția utilizatorilor asupra meniului, îmbunătățește navigarea pe site
  • Ascunderea elementelor de navigare vă ajută să vă concentrați asupra altor lucruri (cum ar fi obiectivele de conversie)
  • Îmbunătățit aspect primul ecran
  • Mai mult structura flexibila proiecta

Citeste si: 20 de cele mai bune exemple de design pagina principala site-ul

Cele mai bune practici:

Design de culoare pentru a se potrivi cu paginile site-ului. Efectul maxim atunci când simplificați o pagină web în acest mod este obținut cu un fundal cu o singură culoare sau cu o structură de meniu glisant într-o singură culoare.
Nu distrageți atenția utilizatorului asupra navigării - este mai bine să lăsați caracteristicile și decorațiunile pentru paginile în sine. Desigur, un design modern frumos și un meniu elegant nu vor strica:

Tipografie simplă mare. Tipografia elegantă și curată adaugă varietate modelului de mai sus de design web „practic”. Fonturile mari/aldine, ușor de citit, îmbunătățesc eficiența navigării și umple spațiul.

Designerii urmează adesea această tendință folosind litere mari.

Pictograme hamburgeri cu o cruce pentru a deschide/închide meniul. Deoarece standardul permite, ar fi mai corect să le combinați într-o singură pictogramă pentru o mai mare claritate și vizibilitate.

Schimbați/suprapuneți conținutul la deschidere. Un meniu pop-up este rareori creat pentru a ocupa întregul ecran. De obicei plecat parte vizibilă conținutul paginii, care pe un ecran mic facilitează revenirea la acesta. Pe desktop arată ca o „imitație mobilă” la modă.

2. Contrar paradigmelor de navigare – alternative

În zilele întunecate ale web-ului, existau două tipuri de navigare: Meniul de sus si lateral. Cu design responsive a apărut meniul hamburger, care acum este criticat pe scară largă pentru că face mai dificilă implicarea utilizatorului/dificil de descoperit/mai puțin eficient.

Avantajele navigației non-standard:

  • Design unic
  • Inovațiile atrag
  • Experiență îmbunătățită a utilizatorului (UX)
  • Pentru designeri - noi posibilități de proiectare a site-urilor web

Cele mai bune practici:

Citeste si: 11 site-uri web creative ale studiourilor interne de web design

Diverse experimente cu navigarea pe site. Cu o atitudine atât de ambiguă față de „burgeri”, în 2017 ar trebui să ne așteptăm la apariția unor inovații interesante în navigație.

Meniul unic al Hillsiderancho.com combină navigarea de sus, stânga, dreapta și derulare

Niciun meniu de navigare. Utilizatorul modern se confruntă cu mult conținut și nu trebuie să i se spună ce să facă în continuare. Sul! Natura organică a acestui comportament a fost deja remarcată în tendințele web anterioare (orizontale, defilare infinită, control tastatură, gesturi...). Unii designeri elimină cu totul meniurile, invitând vizitatorul să folosească/să obțină o experiență „avansată” de cercetare a site-ului. Adaptarea site-urilor pentru dispozitive mobile și tablete schimbă, de asemenea, UX/interfețele în sine și deschide perspective pentru derularea orizontală.

Site-ul nu are meniu de navigare - vi se cere să derulați pentru a găsi conținut, puteți derula cu cursorul

Citeste si: Cele mai neobișnuite și originale site-uri

Meniu pop-up. Eram atât de pasionați de Drop-Down încât nici măcar nu ne-am gândit la o alternativă simplă la navigarea Pop-UP. În exemplul de mai jos, meniul apare în centrul ecranului. În general, paginile web au suficient spațiu pentru a crea o navigare accesibilă și proeminentă, fără liste derulante.

Navigarea pop over este utilizată atunci când trecerea cursorului peste una dintre cele 6 secțiuni schimbă fundalul întregului meniu pe ecran

3. Carduri - inspirație din electronicele portabile

Cum utilizatorii de telefonie mobilă au schimbat designul site-urilor web moderne, astfel încât dispozitivele portabile încep să le influențeze designul. Cu zeci de milioane de articole purtabile vândute din 2015, utilizatorii au învățat să prețuiască excelența rațională și în alte domenii. Economisind spațiu pe ecran, electronicele portabile îi vor învăța pe designeri web să simplifice lucrurile vizual, iar agenții de marketing vor învăța să specifice și să oficializeze în continuare sarcinile site-ului. Principalele reguli ale designului web bazat pe principiul containerelor: elegant, concis și fără prea mult efort - ideologia „mai puțin este mai mult” nu se limitează la dimensiunile ecranului.

Avantaje:

  • Design UX optimizat
  • Mai puține ambiguități și distrageri
  • Minimalismul accelerează încărcarea site-ului

Cele mai bune practici:

Dale, principiul containerelor și blocurilor în structura paginilor web. Tendința se menține de mai bine de un an (2014 - 2016...) și probabil 2017 va continua această tendință. Modelele de gadgeturi populare și noi în prezent (ochelari inteligenți, ceasuri, brățări, agrafe de haine, senzori încorporați în haine...) sunt realizate într-un stil laconic și informează la fel de discret utilizatorul. După cum era de așteptat, tehnologia purtabilă va da o nouă viață interfețelor ușor de citit. Modelul de container al interfeței de utilizare a cardului este conceput pentru a fi autonom și se adaptează bine pentru ecrane mai mari.

Pictograme SVG mari. Pictograma are nevoie de scalabilitate, simplitate - astfel încât să arate pe dispozitivele HD și să fie observată printr-o privire rapidă.

Paletă de culori strictă. Schemele de culori la modă revin acum la principii de baza. Designul site-ului web în două culori (duoton) sau designul alb-negru cu adăugarea unei singure culori devin din ce în ce mai popular.

Spațiu alb suficient. Pentru a asigura uniformitatea între diferite formate, ei adaugă „aer” paginilor site-ului. Acest lucru se numește minimalism extrem. Pe lângă estetică: o atmosferă sofisticat-casual, economisirea spațiului pe pagini, oportunități de a atrage atenția etc.


4. Material Design Lite (MDL)

Citeste si: Cele mai bune modele de magazine online în stiluri Flat și Material

Material Design Lightweight (MDL) de la Google oferă o bibliotecă de șabloane, seturi de elemente (carduri, formulare, pictograme, butoane...) și este o interpretare a unui catalog de componente Polymer gata făcute.

Cu tutoriale despre șabloane preexistente și componente open-source, MDL face designul de materiale deschis pentru implementare pe orice site sau aplicație. Straturile pseudo-3D, umbrele, animațiile sunt elemente de interfață ale designului web clasic care apropie gradul de utilizare de simularea lumii reale.

Avantaje:

  • MDL diferă în partea mai bună de la designul site-urilor web tradiționale, păstrând în același timp beneficiile originale ale designului web clasic
  • Ușor de înțeles datorită interfeței clare și realiste
  • Disponibilitate pe mai multe platforme pentru toate dispozitivele (fără legarea la JS)

Cele mai bune practici:

Mecanica lumii materiale. Tratați elementele stilistice ale MDL ca și cum ar fi obiecte fizice reale, și anume:

  • Umbrele ar trebui să arate ca și cum ar fi aruncate de o sursă de lumină naturală
  • Alegeți dimensiunea și grosimea elementelor ca pentru obiectele reale - în conformitate cu legile fizice
  • Mișcare – răspuns la interacțiunea utilizatorului

Personalizare. Profitați de biblioteca de componente MDL selectând ceea ce aveți nevoie în combinația potrivită.

Paletă de culori plată. Materialul în stil MDL este cel mai potrivit pentru culorile plate - combinații luminoase și îndrăznețe ale acestora. De obicei, sunt alese o culoare principală și o culoare de accent. Se potrivește, de asemenea, cu estetica minimalistă susținută de cele două tendințe anterioare.

Citeste si: Culori în web design: tendințe de culoare (culori strălucitoare)

5. Culori vintage

Tonurile de gri au dominat web-ul în ultimii doi ani: fundaluri gri deschis în loc de alb, text gri ardezie în loc de negru și umbre subtile de gri care creează profunzime într-un stil de design material. În 2017, nuanțele vintage superbe revin în sfârșit.

Magazinul de pantofi online folosește culori dezactivate precum sepia. Designul de culoare, imitând vintage cu fotografii vechi, subliniază calitatea înaltă a produsului (în cele mai bune tradiții ale brandului de familie)

Ryan McCready, editor de conținut pentru serviciul de infografică Venngage, vorbește despre tendințele în lume în acest moment. design grafic, și ce tehnici au trebuit să fie abandonate anul acesta.

Culori indraznete si vibrante

În ultimii câțiva ani, mulți lideri tehnologici au folosit culori dezactivate și ușor de citit. Așa că au încercat să creeze un foarte diagramă clară proiectează și arată că viitorul elegant și funcțional, prezentat de obicei în filmele științifico-fantastice, a sosit deja.

Această metodă a ajutat compania să treacă la o nouă etapă de dezvoltare și să-și unifice toate aplicațiile sub o singură culoare. Ca și în cazul Spotify, o utilizare atât de îndrăzneață culori deschise a făcut ca marca să fie recunoscută.

Moda pentru culori îndrăznețe și strălucitoare în design provine din principiile Google Material Design. Compania a ales un design plat, raționalizat și intuitiv, cu adăugarea de „culori neașteptate și energice, precum și fonturi și imagini funcționale și plăcute pentru ochi”.

În general, multe tendințe actuale ale anului 2017 au apărut sub influența principiilor Materialului Design Google.

Le-am folosit și pentru a realiza această imagine publicitară. e-carte. Drept urmare, imaginea a devenit incredibil de populară.

Dacă nu poți alege cele mai bune culori pentru designul dvs., citiți mai departe pentru câteva exemple grozave de palete de culori. Și nu vă fie teamă să folosiți culori care contrastează unele cu altele.

Font aldine

Fontul bold atrage atenția cititorilor. Involuntar acordați atenție inscripțiilor mari și atrăgătoare.

Exemplul meu preferat este Wired. Folosește diferite fonturi pentru a evidenția anumite titluri și pentru a menține o ordine ierarhică a informațiilor pe pagină.

Aruncă o privire:

O alta bun exemplu folosind fonturi captivante - HubSpot. Textul este în prim plan și susținut de grafică:

HubSpot înțelege că în fiecare an timpul necesar pentru a absorbi informații dintr-un tweet tinde să scadă la zero. Prin urmare, pentru a atrage atenția cititorului, folosesc inscripții scurte și succinte cu litere aldine.

În plus, acum tot mai mulți oameni navighează pe internet cu telefoane mobile. Datorită ecranelor de înaltă definiție, există o nevoie din ce în ce mai mare de a folosi fonturi aldine. Deci, pentru a reține cititorii, trebuie să vă livrați conținutul în modul corect.

Buffer evidențiază titluri de-a lungul întregului articol, nu doar la început - facând articolele mai ușor de citit pe toate dispozitivele. Recomand să folosiți această abordare pentru articole lungi - în acest fel veți ajuta cititorii să le navigheze.

Am aplicat această metodă la crearea acestui infografic. Combinaţie îndrăzneţși soluțiile de culoare interesante atrag atenția:

Fonturi din Google Fonts

Folosesc Google Fonts de mult timp pentru că sunt atât de versatile. Dacă trebuie să vin cu un design pentru o publicație online și apoi să-l adaug la o prezentare, sunt sigur că toate fonturile vor funcționa bine împreună. Toate arată grozav pe orice platformă de blogging sau site web.

Apropo, toate cele 810 fonturi sunt absolut gratuite! Da, oamenilor le plac lucrurile gratuite. De asemenea, le plac lucrurile care sunt foarte ușor de utilizat. Iată un exemplu de combinare a mai multor fonturi populare de la Google:

Pe site-ul nostru folosim fonturile Roboto și Open Sans.

Fotografii originale

În fiecare an, cantitatea de conținut crește, la fel și nevoia de imagini de înaltă calitate. Pentru a se asigura că fotografiile pot dura mult timp, autorii încearcă să le facă cât mai versatile posibil.

Există o singură problemă: cele mai bune imagini generice tind să devină învechite în timp. Dacă urmăriți știrile din domeniul tehnologiei și marketingului, atunci probabil că sunteți familiarizat cu această fotografie:

Este folosit în pagini de destinație, bloguri și chiar în postările de pe Instagram. Sincer să fiu, l-am luat chiar eu pentru un site la care am lucrat acum câțiva ani. Datorită popularității unor astfel de imagini stoc, originalitatea conținutului grafic a scăzut brusc.

Și necesitatea de a folosi clare și fotografii perfecte doar a înrăutățit situația.

Când un cititor vede aceeași poză pentru a suta oară, el crede că autorul articolului nu a încercat să fie măcar puțin original. Deci de ce să citești măcar un astfel de articol?

Acesta este motivul pentru care ar trebui să utilizați imagini originale. Nu mai faceți fotografii populare, începeți să vă faceți propriile fotografii.

Sunt sigur că toată lumea din echipa ta are un telefon cu cameră. De ce nu le folosești? Faceți fotografii cu biroul sau logo-ul dvs. și folosiți acele fotografii.

Află dacă printre colegii tăi există un fotograf aspirant. Oferă-i câteva zile să închirieze un birou - și vei avea suficiente fotografii pentru un an întreg!

Când am creat noul nostru site web, am făcut fotografii cu angajații noștri și am fost foarte mulțumiți de rezultat.

Imagini și pictograme desenate manual

Nu doar fotografiile trebuie să fie originale, ci și icoanele și desenele. Unele branduri și-au dat deja seama de acest lucru și încearcă să iasă în evidență din mulțime în acest fel. Această abordare adaugă un element personal și distractiv designului.

Unii spun că tendința pare neprofesională și copilărească, dar este totuși cu siguranță atrăgătoare. La fel ca majoritatea tendințelor din 2017, acesta acționează ca o alternativă la designul curat steril anii recenti.

Dropbox folosește ilustrații desenate manual. Au devenit parte a mărcii companiei și l-au făcut recunoscut.

Astfel de ilustrații creează o stare de spirit relaxată și încântă copilul care trăiește în sufletul fiecăruia dintre noi. Ele fac ca produsul să pară mai accesibil. Sunt deosebit de eficiente la marile companii tehnologice precum Dropbox.

O alta bun exemplu Această abordare este compania de saltele Casper. Aproape întregul ei site este format din desene desenate manual. Iată una dintre ele:

Tendința a fost preluată și de serviciul MailChimp. În raportul din 2016, el arată și desene similare.

Moz, o companie care dezvoltă software de marketing, inserează ilustrații în antetul articolelor:

Uneori, dragostea noastră pentru desene se manifestă în alte proiecte:

Întoarcerea la rădăcinile minimalismului

Dacă ți s-ar cere să explici unui străin ce este minimalismul, probabil ai răspunde că este atunci când trebuie să renunți la decorativitate în favoarea funcționalității. Cel mai probabil, vă veți gândi imediat la o paletă de culori neutre constând din nuanțe de negru, gri și alb.

Se pare că adevăratul spirit al minimalismului a fost înlocuit de folosirea alb-negru plictisitor scheme de culori. Cred că asta a fost făcut intenționat pentru a compensa mărime mică ecran și putere redusă a dispozitivelor mobile.

Dar în 2017 totul se va schimba. Minimalismul va reveni în adevărata sa formă. Ceea ce înseamnă că va fi mai multă culoare. În zilele noastre, dispozitivele mobile sunt la fel de puternice ca și computerele, iar unele chiar au ecrane mai bune.

Exemplul meu preferat de design minimalist este logo-ul platformei Medium. Creatorii săi au reușit să combine mai multe Culori diferite si in acelasi timp mentine un stil minimalist.

Google a realizat o altă reproiectare a logo-ului în favoarea minimalismului și a unei combinații de culori strălucitoare. Este de remarcat faptul că această companie a servit drept catalizator pentru apariția multor noi tendințe. Designerii au tăiat ușor stilul fontului și au prezentat noul fel un logo în formă de G care îmi place foarte mult.

Spiritul de minimalism se simte în toate acestea, dar presa nu a scris despre asta. Oamenii au uitat ce este adevăratul minimalism. Logo-ul nu era incolor și realizat într-o singură formă, așa că nimeni nu s-a gândit că este realizat într-un stil minimalist.

Noul logo a fost luminos și atrăgător - păstrând în același timp un aspect minimalist. După reproiectare, oamenii din jurul lor au început să imite Google, așa cum făcuseră înainte în alte aspecte.

Noi înșine am început să folosim un stil mai minimalist pentru designul blogurilor noastre.

Designul simplu al imaginii transmite cu ușurință informațiile necesare.

Folosind GIF-uri

Toată lumea (ei bine, aproape toată lumea) iubește GIF-urile. Ne ajută în conversație pentru că uneori pot transmite emoții mai bine decât textul.

În plus, pentru a le juca nu ai nevoie de niciunul programe speciale. GIF-urile sunt de obicei mici și pot fi încorporate aproape oriunde.

Sunt mai bune decât videoclipurile și imaginile, mai ales atunci când doriți să reduceți timpul de încărcare a paginii și traficul. Cred că versatilitatea lor face GIF-urile un element de design și mai util.

Îmi place foarte mult să pun gif-uri în antetul unui articol. În loc să puneți o imagine de stoc plictisitoare acolo, luați câteva minute și faceți un GIF ca acesta.

Nu trebuie să faci eforturi creative speciale pentru a face acest lucru, dar cu siguranță va atrage atenția asupra postării tale pe rețelele sociale. Iată un alt exemplu bun de utilizare a GIF-urilor în antetul unui articol.

Imagini în două culori

Aceasta este o combinație de două culori, de obicei foarte luminoase sau contrastante, într-o singură imagine. Pentru a crea astfel de imagini, va trebui să vă activați abilitățile de design, dar merită.

Doar un designer foarte priceput poate realiza imagini atât de frumoase în două culori. Sunt sigur că nu pot crea așa ceva, dar asta nu înseamnă că ar trebui să tăiați această tehnică din planurile dvs. de design.

Având în vedere dezvoltarea activă a tehnologiei, comunicarea noastră cu computerul devine din ce în ce mai firească și apare posibilitatea comunicării interactive folosind vocea. Prin urmare viitorul este asistenți vocali, dar aceasta este următoarea generație de aplicații.

Un buton de apel la acțiune ar trebui să fie un element cheie pe orice pagină. În zilele noastre se folosesc adesea culori prea strălucitoare și iritante. Dar pentru a sublinia butonul CTA în 2017, acesta va fi din ce în ce mai folosit animație simplă, nu este atât de enervant, dar își îndeplinește perfect funcția de a atrage atenția.

Amintiți-vă că principalul lucru este să nu exagerați! Utilizați mișcări fluide în animație după câteva secunde, acestea atrag atenția fără a fi prea enervante; Vă recomandăm să adăugați un buton de îndemn la antetul site-ului dvs. la efect mai bun. Și nu numai pe site, adaugă astfel de butoane și în mailingurile tale!

Fotografiile mari, și mai ales videoclipurile, atrag întotdeauna atenția. Mai mult, intriga video în sine poate interesa cu adevărat vizitatorul.

Dacă acesta este un videoclip de fundal, atunci aveți două într-unul - este atât o fotografie, cât și un videoclip. Deoarece videoclipurile sunt încă folosite relativ rar ca fundal, ele trezesc imediat interesul.

Încercați să creați videoclipuri PERSUASIVE. Oameni adevărați Videoclipul dvs. ar trebui să creeze un sentiment de autenticitate, sinceritate și autenticitate. Asigurați-vă că utilizați diferite tactici: recenzii ale clienților, răspunsuri motivate la posibile obiecții și demonstrații ale produselor.

Cu ajutorul unor astfel de videoclipuri, vei putea depăși orice îndoieli ale clienților tăi mult mai rapid și vei încheia afacerea.

Tendința #4 pentru designul site-urilor web în 2017 – derularea ca tip principal de navigare

În 201, defilarea devenise deja larg răspândită. El a făcut informațiile mai semnificative. Acum utilizatorii vor derula cu bucurie texte lungi, în loc să urmăriți link-uri și să așteptați ca paginile să se reîncarce.

Informații importante din antetul site-ului, cum ar fi principalul meniu de navigatie, număr de telefon sau buton sună din nou este fix și întotdeauna disponibil fără acțiuni suplimentare.

Derularea vă ajută să spuneți fără probleme o poveste interesantă, să afișați o mulțime de fotografii și, astfel, să depășiți îndoielile utilizatorilor și să încurajeze conversia.

Bine planificat pagina de destinație duce clienții într-o călătorie atent concepută, care duce la conversie, fără a-i obliga să se gândească de două ori la alegerea unei căi.

Oferiți produse similare și similare, precum și promoții profitabile în timpul procesului de finalizare a comenzii pentru a crește media cecului. Produsele conexe din comerțul electronic reprezintă 10 până la 30% din venituri. Amintiți-vă că a vinde unui client nou este de zece ori mai dificil decât a vinde cuiva care este deja gata să plătească.

Cu ajutorul unei ferestre pop-up, puteți reține clientul atunci când acesta este pe cale să părăsească site-ul. Dar simțul proporției este foarte important aici, deoarece mulți utilizatori au început să-i urască.

Dar dacă abordați creativ crearea unor astfel de notificări și nu cereți nimic în schimb, de exemplu, oferiți transport gratuit, notează codul de cupon sau descarcă unul gratuit versiune de încercare, atunci această abordare provoacă iritare.


În fiecare an învățăm ceva nou despre design, iar 2016 nu face excepție. Articolul pe care l-am scris anul trecut a fost un succes atât de mare încât ne-am hotărât să facem niște previziuni pentru 2017, așa că să începem!

A ieșit articol nou← Citește și inspiră-te!

Tendințele de design sunt influențate de mass-media, tehnologie, industria modei și, în În ultima vreme utilizabilitate. Tendința apare încet, treptat, pătrunzând în toate domeniile designului, apoi dispare exact în același mod. Cele mai multe tendințe de design nu durează mai mult de unul sau doi ani. Designul în 2017 va continua tendințele care au început în 2016, cu câteva noi schimbări adăugate, acest sentiment este bine cunoscut și familiar și este posibil să fi observat-o în ultimii doi ani. Influența principală rămâne a Google Design material, cu mici modificări.

Ce tendințe de web design ne așteaptă în 2017

01. Design semi-plat

Ultimii câțiva ani apartament designul a fost cel mai popular pe piața de web design, dar acum, sub influența Material Design-ului, devine din ce în ce mai unidimensional. Această tranziție începe cu niște umbre ușoare, făcându-l un design semi-plat. Evoluția designului plat de la stilul minimalist se mută în altele noi tehnologii emergente. Designul plat este încă acolo, dar a suferit unele îmbunătățiri.

Umbrirea netedă adaugă profunzime și complexitate fără a distruge senzația design plat. Acest optiune noua s-a adăugat trendului plat și va continua să se dezvolte în 2017.

Proiect: Resursa | Instrument UI/UX pentru Web Servicii
Autori: Ruslan Latypov; LS Graphics; Anton Mishin; Valeri Gurkov

Proiect: Lista de redare a ascultătorului

02. Fotografii în mișcare (Cinemagraphs)

Cinemagrafele nu sunt acelea Animații GIF, pe care îl vedem peste tot pe Internet. Cinemagrafele sunt imagini statice cu elemente minore de mișcare. Această tehnică face o fotografie simplă mai realistă.



03. Mai mult 3D

3D se mișcă cu siguranță în direcția noastră și vom vedea această influență în toate domeniile designului. Cu tehnologiile VR/AR care își iau ritmul rapid, acest domeniu se dezvoltă destul de repede.

Proiect: IUBESC; INDRAGESC

Proiect: Deschideți premiile anuale

Proiect: Air Max '17

Proiect: NIKE F.C. | Bile de aur 3D în lumea reală

Proiect: Better You Brand

04. Animații

Animația este din ce în ce mai prezentă în web design, formatul poate fi orice - WebGL CSS, GIF-uri, SVG sau video. Animația a fost una dintre cele mai importante tendințe de web design din ultimul an, nu vă sfiați să o folosiți.


Proiect: Nickelodeon Kids alege președintele

Proiect: Aplicația Virtual Fitness Coach AR

Proiect: ZH OURO- Rio 2016

05. Site-uri/pagini de destinație de o pagină

În 2017, vom vedea o creștere a site-urilor de o pagină datorită potențialului lor în scopuri de marketing și a capacității lor de a viza mai bine vizitatorii.

Dacă aveți nevoie de o pagină de destinație, o puteți comanda de la mine →

06. Forme geometrice, modele, linii și cercuri

Această tendință a început în 2016 și va continua cu siguranță și în 2017. Vă puteți personaliza site-ul prin simpla adăugare a unor forme moderne, fie plate, fie cu o umbră moale.

Proiect:

Proiect: DRAP.agency Branding

Proiect: Pfizer - activ și peste 50 de ani pentru The New York Times

07. Culori curajoase

Folosește culori strălucitoare pentru a ieși în evidență. Materialul și designul plat se potrivesc bine cu culorile strălucitoare. Puteți folosi paleta de culori oferită de Google pentru a selecta și combina culorile dorite.

Proiect: Edris — Logo creat de MiLo

Proiect: Rendered - Website Demo responsive pentru Adobe

Proiect: b2mach

08. Scrolling și Paralax inovatoare

Aceasta este o idee vizuală grozavă care va adăuga unicitate oricărui site web. De la paralaxă multistrat până la paralax video, totul este posibil cu pluginul D.ex Multilayer Parallax. Acest produs a fost dezvoltat integral de studioul Milothemes sub conducerea Loredanei Papp si Mihai Baldean. Este disponibil pentru cumpărare pe Envato Market / codecanyon.net


Acesta este un plugin WordPress care vă permite să faceți blocuri Parallax frumoase cu mai mult de un strat. Fiți creativ și combinați straturi în orice stil doriți. Am făcut 12 diverse exempleîn ghidul de pluginuri pentru a vă face prima cunoștință cu lumea minunată a paralaxei. Joacă-te cu straturi!

09. Tranziții de culoare

Gradientele sunt una dintre cele mai mari tendințe în acest moment. Tendința a început să câștige popularitate în 2016 și continuă să crească rapid după ce mărci mari, precum Instagram, au decis să-și schimbe logo-ul și imaginile de la o culoare la o tranziție multicoloră (gradient). De la logo-uri la butoane sau suprapuneri de imagini, această tendință este peste tot.

10. Navigare pe mobil (Design responsiv)

2015 și 2016 au înregistrat o creștere semnificativă a vizionărilor de pe dispozitivele mobile. Tabletele și smartphone-urile sunt acum o prioritate mai mare pentru navigarea pe site-uri web, sunt superioare computere desktopși laptopuri – iar această tendință continuă. Orice site care nu are design web receptiv trebuie să actualizați cât mai curând posibil!

Proiect: Animație de site responsive

11. Grafică și ilustrații personalizate

Fotografia de stoc este încă destul de populară, dar o nouă tendință a apărut în 2016 și va continua să crească în 2017: utilizarea graficelor și ilustrațiilor personalizate. Dacă doriți un site web unic, frumos, de care orice vizitator să vă amintească, colaborați cu designeri digitali. Aceasta înseamnă mai puține fotografii de stoc și mai multe imagini originale, unice.

12. Utilizarea creativă a spațiului neutru și a rețelei

În ultimii ani, designul web a fost mai înclinat spre coloane și grile ordonate, organizate, dar în 2016 am putut observa o schimbare semnificativă către straturi neregulate și design ultra-modern.

13. Spune povești (Storytelling)

Site-urile web încep acum să spună povești pentru a câștiga clientul. Oamenii tind să-și amintească povești mai mult decât să citească informații simple (seci).

Mai multe videoclipuri despre povestirea de la Business of Youth:

14. Încărcarea treptată a conținutului (Lazy Loading)

Lazy Loading întârzie încărcarea imaginilor pe pagini web lungi, ceea ce permite informațiilor să apară într-un anumit punct în timpul derulării în jos, ceea ce reduce timpul de încărcare a paginii.

15. Conținut împărțit

Conținutul împărțit este acum popular în designul web responsiv; acesta împarte ecranul în 2 sau mai multe părți. Un astfel de ecran împărțit al site-ului va arăta spectatorului oarecum în mod egal mesaje importanteîntr-un bloc al site-ului. Această tendință a apărut în 2015, dar în 2017 va continua să crească și, cel mai probabil, o veți vedea pe multe site-uri.

16. Formulare pe ecran complet

Nu este nevoie să navigați la altă pagină pentru a completa un formular, deoarece site-urile noi folosesc formulare cu lățime completă care se adaptează nevoilor dvs. design adaptiv.

17. Videoclipuri peste tot

Conținutul video a crescut în ultimul an, iar oamenii au devenit mai pretențioși la videoclipuri de înaltă calitate. Un videoclip de pe un site web poate fi scurt și se poate repeta automat, prezentând un produs sau un proiect cinematografic la scară largă care va menține spectatorul implicat în poveste.

Proiect: Cantecul dealului

18. SEO este important! (SEO este important)

SEO este foarte important pentru un site web, așa că un site frumos fără SEO bun va rămâne un outsider.

19. Navigare ascunsă

Meniurile cu hamburger creează o mulțime de dezbateri pro și contra cât de dificil este pentru utilizatori să găsească meniul, dar un lucru este sigur - această tendință este aici pentru a rămâne și oamenii se vor obișnui în cele din urmă cu astfel de meniuri.

20. Detalii de design minuscule

Concentrarea pe detalii este foarte importantă anul acesta. Mici detalii precum puncte de navigare etc. Se concentreze pe mici detalii va finaliza lucrarea.

Proiect: Barometa - Platforma de locuri de muncă de ultimă generație


21. Tendințe în design de logo

21.1. Minimalism

Toate brandurile mari se îndreaptă către modele mai simple, minimale și această tendință este aici pentru a rămâne.

21.2. Desenat de mână

Această tendință a fost în centrul atenției în ultimii ani și acest stil este grozav pentru afacerile hipster. Este folosit pentru saloane de coafură (frizerie), cafenele, restaurante, articole de artă și meșteșuguri.

21.3. Spațiu negativ

Aceasta este o tendință veche, dar am văzut că a luat avânt în ultimii câțiva ani și va continua să crească în 2017, așa că cu siguranță merită să o aruncăm o privire mai atentă.

21.4. Decuparea

Nu devine mai minimalist decât această tendință. Arată doar ceea ce este suficient pentru a indica în logo pentru a recunoaște compania și nimic mai mult.

21.5. Geometrie

Această tendință este vechea școală, dar este unul dintre acele stiluri care nu vor muri niciodată.

21.6. Linie de arta

Această tendință este populară în rândul afacerilor de nouă generație

Autori: Sam Healy; Andrea Schlaffer; Jacek Janiczak

21.7. Modele

Modelele sunt noul trend și această repetare este într-un mod neobişnuit pentru a vă face afacerea memorabilă și pentru a o diferenția de concurenții săi. Această direcție originală poate fi folosită și în prezentarea logo-urilor.

Autori: Nick Edlin; Stanislav Aleynikov; Lucas Gil-Turner

21.8. Logo-uri animate

Motion Design este o tendință populară astăzi și o putem vedea în toate domeniile designului.

Autori: Javier Miranda Nieto; The Work Co

21.9. Epocă

Stilul vintage este încă în joc. Chiar dacă această tendință este populară de mult timp, încă mai are ceva de spus.

Autori: Roman Dodonov; Mingo Ideas Up; Voi încerca mai departe

21.10. Tranziții de culoare

Gradientele sunt peste tot anul acesta, iar siglele nu fac excepție.

21.11. Ilustrații în logo-uri

Ilustrații - mod bun creați un logo unic și individual pentru afacerea dvs. Ele devin din ce în ce mai populare în acest an.

Autori: Bodea Daniel; Jacek Janiczak

21.12. Fotografie în logo-uri

Combinația de imagini și tipografie este foarte populară acum. Lucrează foarte bine împreună și creează un contrast între ei.

22. Tendințe în tipografie

22.1. Tipografie mare, îndrăzneață și frumoasă

Tipografia poate fi cel mai important element în crearea unui design uimitor. Anul acesta, tipografia va fi aldine (bold) și mare, cu titluri proeminente.

Autori: Alexandru Laguta

Autori: Quim Marin

Proiect: Seria Baugasm - Pachetul 4

22.2. Degrade/tranziții de culoare în tipografie

Gradienele sunt, fără îndoială, o tendință astăzi și le veți găsi și în tipografie.

22.3. Ierarhie vizuală

Ierarhia în tipografie este importantă în orice direcție de proiectare. Mărimea și lățimea fontului pot indica cu ușurință cuvintele sau titlurile care au prioritate, așa că utilizați acest factor atunci când creați textele. De asemenea, ar trebui să rețineți că puteți obține o ierarhie vizuală clară prin plasarea textului și culoare.

22.4. Tipografie minusculă

Textul foarte mic este de obicei înconjurat de un spațiu de culoare opus, dar puteți crea o diferență vizuală între culoare sau imagine pentru a face textul să iasă în evidență. De asemenea, puteți folosi animația pentru a vă ajuta textul să iasă în evidență.

Autori: Slava Oleinik; Bahaa Samir; Digital inteligent

Proiect: Seria Baugasm - Pachetul 4

22.5. Tipografie animată

Animația este folosită peste tot acum, iar tipografia nu face excepție. Dacă utilizați software de mișcare, nu puteți greși anul acesta.

Proiect: Gotham Pro Animated Font gratuit

22.6. Tipografia întâlnește fotografia

Combinația dintre text și fotografie poate da rezultat excelent. Consultați aceste exemple grozave.

22.7. Forme geometrice și tipografie

Formele geometrice pot funcționa bine cu tipografia pentru a crea un design frumos.

22.8. Împerecherea fonturilor

Utilizați două sau mai multe fonturi împreună. Acest lucru este încă în tendințe în 2017.

———————————