Ce să așteptați în designul web în 2015

Cu 12 luni în urmă am publicat câteva previziuni despre ceea ce am vedea (și nu vom vedea) în 2014. A lovit un cablu cu voi toți, deci am decis să facem același lucru în acest an!

Anul trecut, am prezis creșterea continuă a SVG, scăderea segmentării PSD și o supraîncărcare a designului orientat spre video, printre multe alte lucruri. În următorul an, vom vedea mai multe. Iată ce credeți că veți vedea în designul web în 2015!

Prototyping Extravaganza

Prototyping-ul nu este doar o mândrie - este o parte importantă a viitorului designului web.

Pe măsură ce web-ul devine din ce în ce mai avansat și mai complicat, vom continua să ne deplasăm mai departe de machete statice și mai mult spre experiențe interactiv pline, care necesită mult mai mult decât o descriere vizuală. Instrumentele de prototipare permit unui designer să arate nu numai ceea ce arată o experiență digitală particulară, ci și ce poate do.

Instrumentele de prototipare sunt folosite pentru multe interacțiuni specifice diferite, inclusiv design simplu de animație, tranziții și considerente de susținere a mai multor dispozitive. Dar prototipurile pot face mult mai mult decât arătând estetica vizuală, pot funcționa ca soluții de tip wireframing de înaltă rezoluție. Designerii și arhitecții de informații vor începe să se antreneze încrucișat pe teritoriul celorlalți, întrucât arhitectura aplicațiilor va continua să fie integrată în procesul de proiectare.

Instrumente pe care le-ați putea folosi pentru prototip

  • Framer - Instrumentul de prototipare cu sistem Coffeescript integrat pentru schițe, construit pentru prototipuri de interacțiune de înaltă rezoluție. 
  • Origami - construit de oamenii de la Facebook, Origami lucrează cu Quartz Composer pentru a construi prototipuri interactive. 
  • InVision - InVision este o modalitate foarte bună de a începe cu prototipuri. Folosind imagini statice și făcându-le interactive la un nivel foarte simplu, utilizatorii pot face legătura între vizualizări, pot comenta pe anumite puncte ale designului și pot utiliza o vizualizare versială a prototipului în sine. 
  • Codepen - Codepen este un instrument care vă permite să încercați ceva în browser foarte repede. Cu câteva clicuri simple, puteți avea o pânză neagră cu biblioteci populare de JavaScript, CSS și HTML. Codepen include suport pentru lucruri precum HAML, LESS / SASS și legarea fișierelor externe (cum ar fi jQuery). Demo-urile de construire în browser are de asemenea avantajul de a fi portabil și imediat utilizabil într-un proiect live real.

Citirea, ascultarea și vizionarea în continuare:

  • Ce prototip este (și nu este) 
  • Prototyping: Ghidul unui practicant (carte) de Todd Zaki Warfel
  • Prototyping (@ Facebook) Origami | Compozitor de cuart | Framer 
  • Introducere în prototip
  • PrototypingTools.co

Ce nu veți vedea: Instrumentele de luare de prototipuri direct la producție

Instrumentele de prototip nu au fost suficient de perfecționate pentru a le duce direct în browser (cu excepția cazului în care, desigur, ele încep în browser, cum ar fi Codepen). Unii vor încerca să realizeze acest lucru, dar, în cele din urmă, transformarea prototipurilor în produse digitale codificate pentru producție va fi în continuare realizată de dezvoltatorii umani. Având abilitățile de a converti prototipurile în codul de producție, va continua să fie un set de competențe extrem de apreciate pentru designerii de altă natură.

Adoptarea mai multor schițe

Sketch-ul a crescut în popularitate de la lansarea sa de către Bohemian Coding. Schița este concepută special pentru a crea modele digitale. S-ar putea să nu fi auzit niciodată de Sketch, dar credem că se va schimba și în acest an veți vedea că va continua să crească.

Liderul anterior al pachetului, Photoshop, nu a fost niciodată destinat să fie utilizat în mod specific pentru designul web. Adobe a continuat să lanseze produse precum Muse și Edge pentru a aborda unele dintre provocările de design specifice web-ului, în care Photoshop nu reușește. Cu toate acestea, Sketch și alte alternative construite de companii de dezvoltare mai mici sunt în creștere.

Ce nu veți vedea: moartea lui Adobe

Chiar dacă Sketch și alte instrumente similare sunt adoptate, Adobe este încă o forță puternică în comunitatea de design. Adobe a continuat să răspundă public la vocile designerilor. De exemplu, Adobe a creat un site pentru a recunoaște subiectul Photoshop for Design. 

Adobe este, de asemenea, o companie foarte mare, care le oferă avantajul unor cicluri de eliberare mai rapide și mai multe resurse pentru a lansa caracteristici la scară largă. Din cauza bazei de utilizator existente, caracteristicile de colaborare sunt mai ușor de adoptat. Condiția persistentă a Adobe în comunitatea de design va continua să păstreze suita de aplicații în lista de elemente esențiale pentru designeri.

Utilizarea excesivă și abuzul de "proiectare material"

Proiectarea materialelor este cadrul conceptual mult așteptat al Google pentru modul în care ar trebui să fie elaborate și raționalizate produsele digitale. Ca parte a designului materialelor, Google a lansat ghiduri practice pentru implementarea conceptelor sale.

Designul materialului este adesea inspirat în mare măsură de estetica designului "plat". Deoarece esteticul Google urmează această tendință, adoptarea în masă a început deja. Proiectarea materialelor este integrată în teme Wordpress și în widget-uri reutilizabile / biblioteci descărcabile, pluginuri și chiar Polymer, o bibliotecă puternică a componentelor web care aduce nu doar funcționalitatea plug-and-play, ci și stilul specific pentru componente.

În timp ce designul materialului Google oferă cu siguranță o bază și o direcție excelentă pentru web, ne putem aștepta, de asemenea, să urmăm tendința în detrimentul produselor create. Esteticul de design material nu este o soluție "de o mărime potrivită tuturor" pentru web în general. Așa cum vedem atât implementări grozave cât și oribile ale fundalurilor video și ale efectelor de parallax pe web, vom vedea de asemenea implementări minunate (și incredibil de teribile) ale materialelor de design.

Ce nu veți vedea: mai puține paradigme de design

Când web-ul era în fază incipientă, designul web era relativ similar în cadrul unei anumite selecții alese de site-uri. Nici tehnologia, nici cultura nu au împins mediul să fie o cale de exprimare.

Acest lucru a fost valabil pentru majoritatea mass-media. De exemplu, multe dintre cele mai vechi cărți au fost probabil foarte asemănătoare, aspect sportiv similar și bazându-se în primul rând pe conținutul pentru diferențele expresive.

Pe măsură ce tehnologia a avansat, viteza internetului a crescut, iar CSS a fost adoptată, au fost introduse noi estețițe pe web. Acest avans nu a fost nici mic; tehnicile estetice pe web au explodat. Cu toate acestea, chiar și la începutul anilor 2000, multe site-uri au prezentat stiluri similare.

Derulați rapid la moartea proverbial a Flash și introducerea de telefoane inteligente și aplicații mobile. Aceasta a fost o perioadă în care designul sa maturat pe web. Puternice progrese noi ne-au trecut trecutul de afaceri "Web 2.0" era, și într-o eră în cazul în care web-ul a devenit o pânză gol. Astăzi, orice selecție aleatorie a site-urilor web poate părea foarte diferită, iar acest lucru nu se va schimba.

Puterea și versatilitatea browserului și varietatea de dispozitive care accesează Internetul vor continua să încurajeze soluții de design noi și diferite pentru probleme noi și diferite. Designul materialului nu este un semnal de convergență, ci mai degrabă un semnal al recunoașterii colective a importanței unui design atent.

Modelul de creștere: Colecțiile ca interacțiune distribuită

Desigur, Internetul a oferit accesul oricarei persoane la o etapă pentru crearea conținutului. O parte semnificativă a populației lumii accesează în mod regulat Facebook, iar într-o anumită zi, rasa umană creează peste 2,5 miliarde de gigaocteți de date.

Desigur, tipurile de lucruri pe care le creăm se schimbă odată cu trecerea timpului și se deschid noi căi de creație. De exemplu, acum cinci ani am creat doar postări pe Facebook pe pereți și fotografii încărcate, dar acum creăm magazine întregi de marcă pe Etsy și vindem articole online și digitale online cu ușurință.

În 2015, vom vedea probabil o tendință continuă spre tastemaking ca formă de exprimare. Tastemakers sunt persoane care curează și posta articole sau o colecție de articole pentru alții pentru a vedea și a putea adopta ca parte a gusturilor lor. Acest model a existat pentru cea mai lungă perioadă de timp cu crearea de playlist de muzică; ne exprimăm prin curățarea cântecelor și apoi împărtășim aceste playlisturi prin intermediul Spotify (sau, în anii '80 și '90, mixtapes).

Dar merge mai departe decât muzica.

Astăzi, împărtășim placi Pinterest, liste Amazon, playlisturi YouTube și colecții infinit mai multe. Posibilitățile din acest spațiu nu s-au diminuat, ci doar continuă să crească. Apreciem aceste tipuri de interacțiuni deoarece sunt umane și mult mai personale decât "sugestiile" oferite de un algoritm.

O explicație extraordinară a motivului pentru care acest lucru este atât de puternic poate fi găsit pe ASongADay.co:

"Fără algoritmi fantezie (încă), nici o automatizare (încă). Voi trimite personal o piesă pe care cred că o veți plăcea în fiecare zi, determinată în întregime de preferințele dvs. muzicale indicate mai jos și propria opinie muzicală. Nu sunt un expert, ascult o mulțime de muzică și oamenii par să aibă încredere în mine. Fiecare cântec va veni ca o surpriză, probabil nu în același timp în fiecare zi. Pentru că eu sunt om, nu un robot (încă). "

Serviciul lui Shannon este atât de solicitat încât trebuie să înceapă să ceară voluntarilor să o ajute să trimită pur și simplu o piesă personalizată selectată pe baza gusturilor muzicale ale acelei persoane.

Ne putem aștepta la lucruri precum curățarea filmelor (cum ar fi playlisturile / colecțiile Netflix - putem spera, nu?), Curația de celebritate a produselor și chiar preferințele și setările aplicațiilor.

Cererea de afaceri pentru mobil va deveni universală

Știm că viitorul web va continua să diversifice și să se deplaseze mai mult în spațiul mobil. Dar, până în acest an, am văzut încă rezistența față de considerentele mobile full-on ca o cerință comună pentru orice afacere serioasă.

O masă critică de utilizatori va avea acces la Internet în primul rând prin dispozitive mobile în acest an. Acest lucru necesită un răspuns de afaceri, pentru a merge acolo unde clienții își petrec timpul și banii.

Pentru designerii web, înseamnă că este momentul să începeți să vă gândiți cum să proiectați pentru o lume cu mai multe dispozitive.

Clienții vor cere o experiență Premium de la utilizatori (chiar dacă nu știu ce înseamnă)

Din cauza saturației continue a culturii de proiectare inițială, limbajul unei "experiențe de utilizare manuală" a continuat să pătrundă în discuții despre ceea ce face un produs minunat. S-ar putea să nu știe ce înseamnă asta, dar ar trebui.

Un produs excelent nu este neapărat urmărirea tendințelor. Experiențele utilizatorilor premium realizate manual nu sunt ușor de realizat; acestea necesită experiențe foarte intenționate, concentrate și complete, care sunt foarte relevante pentru utilizator și ceea ce utilizatorul încearcă să realizeze. "Handcrafted", în mod specific, se referă la simțul caracterului și "sufletului" pe care îl puteți găsi într-o masă manuală sau o pereche de cizme. Sentimentul de artizanat și atenția acordată detaliilor este din ce în ce mai important pentru clienți. Dezvoltatorii web de clasă mondială vor fi cei care dezvoltă abilitățile necesare pentru a adăuga acel sentiment de măiestrie și suflet în ceea ce altfel ar putea să se simtă ca o gamă rece de pixeli.

Carduri, "Micro-Experiențe" și Embed Portable Composable

S-ar putea să observați această predicție în alte excursii de sfârșit de an în altă parte, dar este atât de proeminent încât nu am putea să nu fim de acord: design card portabil este o componentă uriașă a prezentului și viitorului designului web. Twitter a făcut acest lucru de ceva vreme, dar alte site-uri se prind. Conținutul online continuă să fie referit pe întregul web într-o varietate de moduri care depășesc limitele simple de hyperlink-uri. YouTube și alte site-uri de partajare video au făcut acest lucru de la începuturile lor, de asemenea.

Modelul este simplu: creați o interfață conținută și încorporabilă, care oferă utilizatorului un set coerent de interacțiuni și afișează conținut relevant pentru conținutul la distanță la care se face referire.

Aceste carduri embeddable nu trebuie neapărat să trăiască de la distanță de la site-urile lor gazdă. Aceste carduri prezintă un alt tip numit "micro-experiențe". Un exemplu excelent de micro-experiență este butonul Like. Ca utilizator de pe Facebook, acțiunea "Like" este un singur clic care deține o semnificație semnificativă. În primul rând, permite Facebook să continue să vă colecteze preferințele și gusturile. De asemenea, permite altor utilizatori să vadă aceste preferințe și gusturi. Acest tip de micro-experiență permite unui utilizator să interacționeze cu o anumită marcă sau site, fără a trebui să-și părăsească contextul actual. De asemenea, permite unui utilizator să interacționeze la diferite niveluri rezoluţie. Cu alte cuvinte, utilizatorul nu trebuie să treacă printr-o serie de pași și să utilizeze întreaga dvs. aplicație sau experiență dintr-o dată; ele pot interacționa la diferite niveluri de cerință de intrare.

Există multe motive pentru care experiențele micro-sunt importante, dar principalul motiv este rezoluția diferită a diferitelor dispozitive. Un utilizator dat care merge pe un trotuar în raport cu un utilizator care sta pe canapeaua lor cu laptopul are abilități și obiective de interacțiune foarte diferite. Micro-experiențele permit o abordare progresivă a cerințelor de interacțiune pentru utilizatori.

Wearables: Nu este încă o mare afacere, dar pregătește-te oricum

Apple Watch semnalează începutul revoluției care poate fi purtat, dar nu te aștepta să explodeze prea repede. Pentru Apple, alte companii mari de dispozitive și dezvoltatori de aplicații, cultivând conducte de aplicații pentru purtători vor dura ceva timp. În calitate de dezvoltatori web, ar trebui să ne pregătim pentru această extindere într-o nouă clasă de dispozitive, dar nu se va întâmpla imediat. Cel mai sigur pariu este să vă puneți banii pe dispozitive mobile cu ecrane tactile, în special "phablets" (telefoane mari și tablete mai mici).

De la http://sketchresources.com/elements/apple-watch

Concluzie

Există o temă comună în multe dintre predicțiile pentru anul 2015. Dacă 2014 ar fi un an pentru mobil, 2015 este anul mai multor aceleași schimbări. Lumea va continua să meargă mai departe către mobilitate și peisaj multi-dispozitiv. Estetica web va continua să se diversifice, iar designerii web vor trebui să-și schimbe orientarea spre designul "paginii" și spre un design digital adaptabil, flexibil, construit manual, bazat pe abilități puternice de prototipare și o conștientizare a interacțiunii într-o varietate de medii.

Ce vedeți să se întâmple în anul următor? Spuneți-ne în comentariile!