Facebook a reproiectat o analiză aprofundată a modelelor independente
Există multe de învățat prin studierea lucrărilor altor designeri. Acest lucru este valabil atât pentru proiectele profesionale, cât și pentru modelele specologice pentru site-urile existente. Site-uri mari precum Facebook servesc o experiență specială a utilizatorilor, cu unele elemente bune și alte elemente care nu sunt atât de bune. În acest post, aș vrea examinați redesignuri Facebook diferite pentru a analiza conceptele de interfață care ar putea îmbunătăți experiența curentă a utilizatorului.
Am tras o multime de redesignuri FB personalizate de la utilizatorii Dribbble, fiecare cu îmbunătățiri specifice și elemente UI actualizate. Luați aceste idei în considerare pentru modul în care acestea arată, cum ar putea funcționa și cum ar putea avea impact asupra utilizabilității dacă este implementat live pe Facebook.
Pagina profilului îmbunătățită
Această reproiectare a paginii de profil vine de la Haris Jusovic, designer din regiunea balcanică a Europei.
În acest design el pune mai mult accent pe simplitate prin evidențierea proprietarului paginii cu un mai mult imaginea anterioară și profilul profilului proeminent.
Mesajele temporale pot fi sortate după “Recent” sau “popular” pe baza preferințelor dvs. Acest lucru este mare pentru uzabilitate, mai ales ca urmare a reacției Twitter față de schimbarea algoritmului recent mandatat.
De asemenea, multe dintre butoanele afișează mai mari cu extra padding și tipografie mai mare. Deoarece Facebook este menit să fie interactiv, are sens doar să crească vizibilitatea elementelor cum ar fi butoanele și hyperlink-urile.
Per ansamblu, acest concept se simte compact și mai ușor în umflare. Ar fi frumos să vedem că Facebook pune mai mult accent pe elementele interactive și poate crește și dimensiunile fontului.
Cronologie cu mai multe coloane
Vizionarea spre un aspect columnal vertical este redesignul lui Alejandro Osorio. Acest aspect reprezintă afișarea cronologică a profilului pe care o văd utilizatorii Facebook când vizitează o pagină de profil a unui utilizator.
Designul este izbitoare, dar poate fi oprit pentru unii utilizatori. Se bazează pe coloane pentru mai multe pagini pentru a le organiza legăturile profilului utilizatorului, împreună cu o vizualizare cronologică a postărilor recente. Toate culorile și elementele rămân adevărate în stilurile de design ale Facebook. Cu siguranta simti ca o pagina de cronologie Facebook.
Dar unele dintre elementele barei laterale se desprinde ca fiind puțin confuz. De exemplu, un buton verde cu un semn plus plus chiar lângă a “urma” buton. Se folosește doar un simbol, altul doar text. Acest lucru se simte incongruent cu stilul de design și alte informații despre profil.
Ceea ce îmi place mai mult aici este structura clară a datelor în cronologie. Totul este organizat în mod clar și există chiar link-uri pentru a comuta între posturile recente și posturile populare.
Redesignul dens
Site-uri mai mari, cum ar fi Facebook, se ocupă de mult mai multe date și de o bază de utilizatori care dorește acces ușor la aceste date. În reproiectarea paginii de pornire de către MagicVoltage veți găsi o caracteristică consistentă: o mulțime de conținut înghesuiți într-o singură pagină.
Pagina de pornire Facebook este afișarea inițială a cronologiei pe care o văd utilizatorii atunci când vizitează prima dată site-ul web. Acesta include postările recente de la prieteni, o listă de chat, jocuri, anunțuri și alte informații relevante, cum ar fi zilele de naștere viitoare.
Ocupația acestui aspect este ceea ce îl face atât amuzant cât și potențial controversat. Având toate aceste conținut pe o singură pagină face acest lucru super ușor de navigat - odată ce aflați de fapt unde este localizat totul. Și legăturile de pe pictogramele de sus-stânga sunt suficient de vagi pentru a descuraja pe oricine să interacționeze cu ele.
Dar, în apărarea acestui design, se ocupă foarte bine de conținutul dens ambalat. Există o multime de spatii intre elemente și rulează un design cu patru coloane strălucit.
Navigare voluminoasă
Această așa-numită redesign Facebook 2.0 creată de Marcelo Silva este într-adevăr o privire care trebuie privită. Schema de demo afișează o pagină de pornire actualizată, cu o cronologie și contacte de chat parțial ascunse.
O mare piesa la acest design este sistem de navigație cu trepte. Îmi place cum există un nav primar cu link-uri de pictograme care afișează linkuri secundare. În captura de ecran de mai sus, utilizatorul selectează pictograma de profil la care se află link-urile navigarea în istoricul recent și editarea profilului.
Spre deosebire de fotografiile tradiționale pătrată ale lui Facebook, reproiectarea lui Marcelo optează pentru fotografia circulară. Acest stil este omniprezent atât în cronologie, cât și în lista de chat.
Asistent M & Listă recentă de activități
Există multe de spus despre reproiectarea FB a lui Steven McCabe. De fapt, numeroase domenii, cum ar fi jocuri și activități recente, au fost complet reproiectate cu un facelift impresionant.
Designul lui Steven este mult mai întunecată decât actuala schemă de culori a Facebook. Îmi place acest lucru, deoarece construiește mai mult contrast între barele laterale și conținutul paginii principale. Pagina de pornire actuală a Facebook are cea mai mare parte a acestui conținut, dar în timp se poate amesteca în fundal.
Antetul utilizează în continuare bule de culoare roșie pentru a indica notificările. Există, de asemenea, posturi trending și un newsfeed cu abilitatea de a sorta activitatea recentă de la prieteni din bara laterală dreaptă.
În partea de jos veți observa o cutie mică pentru M, Facebook echivalentul lui Siri pentru utilizatorii de Facebook.
Această caracteristică nu are prea multă atenție în redesign-uri, dar Steven a mers cu adevărat complet pentru a-și face conceptul să reprezinte cu adevărat tehnologia Facebook modernă.
Layout cronologic cu patru coloane
Iată un alt redesign al paginii de 4 pagini realizat de designerul japonez Sho Kameya. Toate aceste coloane întindeți întreaga pagină, atat latime cat si inaltime.
Bara laterală din partea stângă pune accentul puternic pe legăturile tradiționale Facebook pentru jocuri, aplicații, pagini, resurse dev și alte elemente similare. Următoarea este coloana de conținut care este cea mai diversă dintre toate reproiectările. Acest lucru nu păstrează legăturile tradiționale pentru starea actualizării / adăugarea de fotografii, ci utilizează o abordare minimalistă cu opțiuni ascunse.
Cele două bare laterale de pe partea dreaptă includ orice altceva cu mai multe fotografii, cum ar fi avatarele utilizatorilor și pictogramele jocurilor. Acest design păstrează toate actualizările, cum ar fi zile de naștere, chat-uri și recomandări pentru prieteni.
Acest design este foarte divers, dar rămâne adevărat la baza caracteristicilor Facebook. S-ar putea să nu fie reproiectarea perfectă, dar ea arată posibilitățile unui aspect cu patru coloane.
Interfața UIP simplificată cu lista de chat întunecată
Scopul reproiectării lui Ben Hartley este simplitatea și subtilitatea. Aspectul folosește o combinație de concepte de design plate, cu câteva umbre de picătură pe elementele de pagină mai mari.
Multe articole de marcă rămân aceleași și se bazează pe schema tradițională de culoare albastră / gri a Facebook. Dar veți observa că unele dintre icoane au fost reproiectate fie mai mici sau mai simple (sau amândouă).
Acest aspect se bazează, de asemenea, pe avataruri circulare și oferă o mulțime de spațiu pentru imagini partajate cu posturi. Îmi place foarte mult de el lista actualizată de chat cu schema de culoare mai închisă și pictogramele de stare mai mici.
În timp ce reproiectarea lui Ben se simte încă puțin aglomerată, se simte mult mai simplă. Acesta ar fi un design dur pentru a evalua experiența utilizatorului fără studii UX într-un browser. Dar dintr-o privire se pare mai ușor de răsfoit și oferă mai mult spațiu pentru a consuma conținut de cronologie.
Învelire
Deși aceste exemple se concentrează în primul rând pe Facebook, lecțiile învățate pot fi aplicate pe orice site web. Experiența excelentă a utilizatorilor transcende toate barierele lingvistice și este o piesă vitală a procesului digital de creație.
Simțiți-vă liber să împrumutați idei din această analiză și chiar să implementați idei similare în propria dvs. lucrare de proiect. De asemenea, dacă găsiți reproiectări Facebook relatabile, nu ezitați să participați la comentarii cu propria analiză.