Facebook Redesigned En In-Depth Analysis Of Independent Designs
Det finns mycket att lära av genom att studera andra designers arbete. Detta gäller både professionella projekt och spec mönster för befintliga webbplatser. Stora webbplatser som Facebook ger en mycket speciell användarupplevelse med några bra element och andra inte så bra element. I det här inlägget skulle jag vilja granska olika Facebook redesigns för att analysera gränssnittskoncept som kan förbättra den nuvarande användarupplevelsen.
Jag har dragit en handfull anpassade FB-redesigner från Dribbble-användare, var och en med specifika förbättringar och uppdaterade användargränssnitt. Tänk på dessa idéer för hur de ser ut, hur de kan fungera, och hur de kan påverka användbarheten om de genomförs bor på Facebook.
Strömad profilsida
Den här profilsidans redesign kommer från Haris Jusovic, en formgivare från Balkanregionen i Europa.
I denna design lägger han mer fokus på enkelhet genom att markera sidägaren med en mer framstående foto och profilbild.
Tidslinjeposter kan sorteras efter “nyligen” eller “populär” baserat på din preferens. Det här är stort för användbarhet, särskilt i kölvattnet av Twitters backlash mot den nyligen mandatiserade algoritmförändringen.
Också många av knapparna visar större med extra vaddering och större typografi. Eftersom Facebook är tänkt att vara interaktivt är det bara meningsfullt att öka synligheten av saker som knappar och hyperlänkar.
Sammantaget känner detta koncept kompakt och lättare i uppblåst. Det skulle vara trevligt att se Facebook placera mer fokus på interaktiva element och kanske också öka deras teckensnittstorlekar.
Tidslinje med flera kolumner
Veering mot en vertikal kolumnformad layout är Alejandro Osorios redesign. Denna layout representerar profilens tidslinjevisning som Facebook-användare ser när de besöker en användares profilsida.
Designen är slående, men kan vara avskräckande för vissa användare. Det är beroende av flera sidokolumner att organisera användarens profillänkar, tillsammans med en tidslinjevisning av de senaste inläggen. Alla färger och element stämmer överens med Facebooks designstilar. Det känns verkligen som en Facebook-tidslinjesida.
Men några av sidobalkelementen kommer ut som lite förvirrande. Till exempel, en grön knapp med ett plus plus tecken direkt bredvid a “Följ” knapp. Man använder bara en symbol, den andra bara texten. Detta känns ostört med designstilen och annan profilinformation.
Det jag gillar mest här är tydlig struktur av data i tidslinjen. Allt är organiserat tydligt och det finns till och med sidebar länkar för att växla mellan senaste inlägg och populära inlägg.
Innehåll-Tät Redesign
Större webbplatser som Facebook handlar om mycket mer data och en användarbas som vill ha enkel tillgång till den data. På hemsidan omdesign av MagicVoltage hittar du en konsekvent funktion: massor av innehåll i en sida layout.
Facebook: s hemsida är den första tidslinjevisningen som användarna ser när de besöker webbplatsen. Det inkluderar senaste inlägg från vänner, en chattlista, spel, annonser och annan relevant information som kommande födelsedagar.
Upptagenheten i denna layout är det som gör det både bra och potentiellt kontroversiellt. Att ha allt detta innehåll på en sida gör det super lätt att navigera - när du faktiskt lär dig var allt ligger. Och länkarna med vänstra ikonen är bara vaga nog att avskräcka någon från att interagera med dem.
Men för att försvara denna design hanterar det tätt packat innehåll mycket bra. Det finns gott om mellanrum mellan element och det kör en fyrkolonn design briljant.
Voluminous Navigation
Denna så kallade Facebook 2.0 redesign skapad av Marcelo Silva är verkligen en syn att se. Hans demo-layout visar en uppdaterad hemsida med en tidslinje och delvis dolda chattkontakter.
En stor del till denna design är tiered navigationssystem. Jag gillar hur det finns en primär nav med ikon länkar som visar sekundära länkar. I ovanstående skärmdump väljer användaren profilikonen som har länkar till läser senaste historiken och redigerar profilen.
Till skillnad från Facebook: s traditionella kvadratfotografier, Marcelos redesign väljer mot det cirkulära fotot. Denna stil är allestädes närvarande i både tidslinjen och chattlistan.
M Assistant & Aktivitetslista
Det finns mycket att säga om Steven McCabes FB-redesign. Faktum är att många områden som spel och senaste aktiviteter har blivit helt omgjorda med en imponerande ansiktslyftning.
Stevens design är mycket mörkare än Facebooks nuvarande färgschema. Jag gillar det här eftersom det bygger mer kontrast mellan sidfält och primära sidinnehåll. Facebooks nuvarande hemsida har det mesta av detta innehåll men över tiden kan det blandas i bakgrunden.
Rubriken använder fortfarande röda bubblor för att beteckna meddelanden. Det finns också trending-inlägg och en newsfeed med möjlighet att sortera genom ny aktivitet från vänner i den högra sidofältet.
Längst ner märker du en liten låda för Facebooks M, the motsvarande Siri för Facebook-användare.
Den här funktionen får inte mycket uppmärksamhet vid redesign, men Steven gick verkligen all-out för att få sitt koncept att verkligen representera modern Facebook-teknik.
Fyra kolonnens tidslinjelayout
Här är en annan 4-kols hemsida-redesign gjord av japansk formgivare Sho Kameya. Alla dessa kolumner spänna hela sidan, både bredd och höjd.
Den vänstra sidofältet lägger stor vikt vid traditionella Facebook-länkar för spel, appar, sidor, dev-resurser och andra liknande föremål. Nästa är innehålls-kolumnen som är den mest olika bland alla redesignerna. Detta behåller inte de traditionella länkarna för uppdateringsstatus / lägg till foto utan använder istället a minimalistisk inställning med dolda alternativ.
De två högra sidobalkarna innehåller allt annat med fler bilder som användaravatars och spelikoner. Denna design håller fortfarande alla uppdateringar som födelsedagar, chattar och vänrekommendationer.
Denna design är väldigt varierande men stannar i kärnan i Facebook: s funktioner. Det kanske inte är den perfekta redesignen men det visar möjligheterna till en fyrkolonnlayout.
Förenklad användargränssnitt med Dark Chat List
Målet med Ben Hartleys redesign är enkelhet och subtilitet. Layouten använder en kombination av plattformskoncept med några droppskuggor på större sidelement.
Många märkesvaror är desamma och han litar på Facebook: s traditionella blå / grå färgschema. Men du kommer märka att några av ikonerna har omformats antingen mindre eller enklare (eller båda).
Denna layout bygger också på cirkulära avatarer och ger gott om utrymme för bilder som delas med inlägg. Jag gillar verkligen hans uppdaterad chattlista med det mörkare färgschemat och mindre statusikoner.
Medan Bens omdesign fortfarande känns lite rotig känns det mycket enklare. Detta skulle vara en tuff design för att mäta användarupplevelse utan UX-studier i en webbläsare. Men i ett ögonblick verkar det lättare att bläddra och ger mer utrymme att konsumera tidslinjeinnehåll.
Sammanfatta
Även om dessa exempel främst fokuserar på Facebook, kan de lärdomar som kan läsas tillämpas på vilken webbplats som helst. Stor användarupplevelse design överstiger alla språkbarriärer och det är en viktig del av den digitala kreativa processen.
Känn dig fri att låna idéer från denna analys och även genomföra liknande idéer i ditt eget projektarbete. Också om du hittar några relaterade Facebook redesigns kan du dela med dig av kommentarerna med din egen analys.
