Facebook kujundas ümber sõltumatute disainilahenduste põhjaliku analüüsi

Teiste disainerite töö uurimisel on palju õppida. See kehtib nii professionaalsete projektide kui ka olemasolevate veebilehtede spetsifikatsioonide kohta. Suured saidid, näiteks Facebook, pakuvad väga häid kogemusi mõne hea elemendi ja muude mitte-heade elementidega. Selles postituses tahaksin uurida erinevaid Facebooki ümberprojekte, et analüüsida liidese kontseptsioone mis võiks parandada praegust kasutajakogemust.

Ma olen tõmbanud käputäis kohandatud FB ümberprojekte Dribbble'i kasutajatelt, kumbki neist spetsiifilisi täiustusi ja uuendatud kasutajaliidese elemente. Võtke need ideed arvesse, kuidas nad näevad, kuidas nad toimivad ja kuidas nad võivad kasutatavust mõjutada kui seda rakendatakse Facebookis.

Lihtsustatud profiilileht

See profiililehe ümberkujundamine pärineb Balkani piirkonna Euroopa disainerist Haris Jusovicist.

Selles kujunduses pöörab ta rohkem tähelepanu lihtsusele, tõstes lehe omanikku rohkem esile silmapaistev päise foto ja profiilipilt.

Ajaskaala postitused saab sorteerida “hiljuti” või “populaarne” teie eelistuste alusel. See on kasutatavuse jaoks suur, eriti pärast Twitteri tagasilööki hiljuti volitatud algoritmi muutmisega.

Ka paljud nupud on suuremad ekstra polsterdus ja suurem tüpograafia. Kuna Facebook on mõeldud interaktiivseks, on mõttekas suurendada ainult selliste elementide nagu nuppude ja hüperlinkide nähtavust.

Üldiselt tundub see mõiste kompaktne ja kergem paistetus. Oleks tore näha, et Facebook keskendub rohkem interaktiivsetele elementidele ja võib-olla ka nende fondi suurust suurendada.

Mitmekolonniline ajajoon

Vertikaalselt kollaani kujundus on Alejandro Osorio ümberkujundamine. See paigutus näitab profiili ajakava vaadet, mida Facebooki kasutajad näevad, kui nad külastavad kasutajaprofiili lehekülge.

Disain on silmatorkav, kuid see võib mõnedele kasutajatele välja panna. See tugineb korraldada mitu lehekülje veergu kasutajaprofiilide lingid koos viimaste postituste ajakava vaatega. Kõik värvid ja elemendid jäävad Facebooki disaini stiilile. Kindlasti tundub see Facebooki ajakava lehena.

Aga mõned külgriba elemendid ei tule kergelt segadusse. Näiteks roheline nupp ühe plussmärgiga paremale kõrval “järgige” nuppu. Üks kasutab ainult sümbolit, teine ​​lihtsalt teksti. See ei sobi kokku disaini stiili ja muu profiiliga.

Kõige rohkem meeldib mulle siin ajaskaala andmete selge struktuur. Kõik on korraldatud selgelt ja seal on isegi külgriba lingid, et vahetada viimaseid postitusi ja populaarseid postitusi.

Content-Dense Redesign

Suuremad veebisaidid, nagu Facebook, tegelevad palju rohkem andmetega ja kasutajabaasiga, mis soovib hõlpsat juurdepääsu nendele andmetele. MagicVoltage'i kodulehe ümberkujundamisel leiad ühe ühtse funktsiooni: palju sisu on ühe lehekülje paigutuseks.

Facebooki kodulehekülg on esialgne ajakava, mida kasutajad veebisaidi külastamisel näevad. See sisaldab sõprade hiljutisi postitusi, vestlusloendit, mänge, reklaame ja muud asjakohast teavet, näiteks eelseisvaid sünnipäevi.

Selle paigutuse hõivatud on see, mis muudab selle nii suureks kui ka potentsiaalselt vastuoluliseks. Selle sisu ühel lehel teeb super lihtne navigeerida - kui sa tegelikult õpid, kus kõik asub. Ja ülemise vasaku ikooni lingid on lihtsalt ebamäärased, et veenda kedagi nendega suhtlema.

Kuid selle disaini kaitsmisel tegeleb ta tihedalt pakitud sisuga väga hästi. Seal on palju ruumi elementide vahel ja see töötab suurepäraselt nelja veergu.

Mahukas navigeerimine

See nn Facebook 2.0 ümberkujundamine, mille on loonud Marcelo Silva, on tõesti nägemus. Tema demo paigutus kuvab värskendatud kodulehe koos ajakava ja osaliselt peidetud vestluskontaktidega.

Suur osa sellest disainist on mitmetasandiline navigatsioonisüsteem. Mulle meeldib, kuidas on olemas peamine nav, millel on teiseseid linke kuvavad ikoonilinkid. Ülaltoodud pildil valib kasutaja profiili ikooni, millel on lingid viimase aja sirvimine ja profiili redigeerimine.

Erinevalt Facebooki traditsioonilistest ruudukujulistest fotodest, Marcelo ümberkujundamine valib ümmarguse foto. See stiil on üldlevinud nii ajajoones kui ka vestlusloendis.

M assistendi ja hiljutise tegevuse nimekiri

Steven McCabe FB ümberkujundamise kohta on palju öelda. Tegelikult on mitmed valdkonnad, nagu mängud ja hiljutised tegevused, täielikult ümber kujundatud muljetavaldava näo kiirendusega.

Steven on disain palju tumedam kui Facebooki praegune värviskeem. Mulle meeldib see, sest see loob rohkem kontrasti külgribade ja esmase lehe sisu vahel. Facebooki praegusel kodulehel on enamus sellest sisust, kuid aja jooksul võib see sulanduda taustale.

Päises on teatiste edastamiseks ikka veel punased mullid. Seal on ka trendid postitused ja uudisvoog, mille abil on võimalik sorteerida sõprade viimasest tegevusest paremas külgribas.

Väga põhja all märkate väikest kasti Facebooki M jaoks Siri Facebooki kasutajatele.

See funktsioon ei muutu ümberkujundamises palju tähelepanu, kuid Steven tõesti kõik läks, et muuta tema kontseptsioon tõeliselt kaasaegseks Facebooki tehnoloogiaks.

Neli veergu ajaskaala paigutus

Siin on veel üks 4-tolline koduleht, mis on ümber kujundatud Jaapani disainer Sho Kameya poolt. Kõik need veerud kogu lehekülje ulatuses, nii laius kui ka kõrgus.

Kaug-vasakpoolne külgriba asetab suurt tähelepanu traditsioonilistele Facebooki lingidele mänge, rakendusi, lehti, dev ressursse ja muid sarnaseid objekte. Järgmine on sisu veerg, mis on kõige ümberkujundatud. See ei hoia värskenduse oleku / foto lisamise traditsioonilisi linke, vaid kasutab a minimalistlik lähenemine varjatud võimalustega.

Kaks parempoolset külgriba sisaldavad kõike muud, millel on rohkem fotosid, nagu kasutaja avatare ja mängu ikoone. See disain säilitab endiselt kõik värskendused, nagu sünnipäevad, vestlused ja sõbra soovitused.

See disain on väga mitmekesine, kuid jääb Facebooki funktsioonide põhiosale. See ei pruugi olla täiuslik ümberkujundamine, vaid see näitab nelja veeru paigutuse võimalusi.

Lihtsustatud kasutajaliides tumeda vestlusloendiga

Ben Hartley ümberkujundamise eesmärk on lihtsus ja peenus. Paigutus kasutab kombineeritult tasaseid disainikontseptsioone, millel on mõned tilkad suurematel leheküljeelementidel.

Paljud kaubamärgiga esemed jäävad samaks ja tugineb Facebooki traditsioonilisele sinise / halli värviskeemile. Kuid märkate, et mõned ikoonid on ümber kujundatud kas väiksem või lihtsam (või mõlemad).

See paigutus sõltub ka ümmargused avatarid ja annab palju ruumi jagatud piltidele postitustega. Ma tõesti naudin teda värskendatud vestlusloend tumedama värviskeemi ja väiksemate olekuikoonidega.

Kuigi Ben'i ümberkujundamine tundub endiselt veidi segaduses, tundub see palju lihtsam. See oleks raske disain, et hinnata kasutaja kogemust ilma UX-uuringuteta brauseris. Aga lühidalt näib lihtsam sirvida ja annab rohkem aega ajakava sisu tarbimiseks.

Tõmba otsad kokku

Kuigi need näited keskenduvad peamiselt Facebookile, võib saadud õppetunde rakendada mis tahes veebisaidil. Suurepärane kasutajakogemuse disain ületab kõik keelebarjäärid ja see on digitaalse loomeprotsessi oluline osa.

Julgelt võta selle analüüsi alusel ideid laenata ja rakendada isegi sarnaseid ideid oma projektitöös. Samuti, kui leiate mis tahes relatiivse Facebooki ümberkujundamise, võite oma kommentaarides oma analüüsi abil jagada.