Facebook Redesigned En In-Depth Analysis Of Independent Designs
Det er mye å lære ved å studere andre designers arbeid. Dette gjelder både profesjonelle prosjekter og spesifikke design for eksisterende nettsteder. Store nettsteder som Facebook serverer en veldig spesiell brukeropplevelse med noen gode elementer, og andre ikke-så gode elementer. I dette innlegget vil jeg gjerne undersøke ulike Facebook redesigner for å analysere grensesnitt konsepter som kan forbedre den nåværende brukeropplevelsen.
Jeg har trukket en håndfull tilpassede FB-redesigner fra Dribbble-brukere, hver med spesifikke forbedringer og oppdaterte brukergrensesnittelementer. Ta disse ideene i betraktning for hvordan de ser ut, hvordan de kan fungere, og hvordan de kan påvirke brukervennligheten hvis implementert bor på Facebook.
Strømlinjeformet profilside
Denne profilsiden redesign kommer fra Haris Jusovic, en designer fra Balkan-regionen i Europa.
I denne utformingen legger han mer fokus på enkelhet ved å markere sidens eier med en mer fremtredende header bilde og profilbilde.
Tidslinjeposter kan sorteres etter “nylig” eller “populær” basert på dine preferanser. Dette er stort for brukervennlighet, spesielt i kjølvannet av Twitters tilbakeslag mot den nylig mandatte algoritmeendringen.
Også mange av knappene vises større med ekstra polstring og større typografi. Siden Facebook er ment å være interaktiv, er det bare fornuftig å øke synligheten til elementer som knapper og hyperkoblinger.
Samlet sett føles dette konseptet kompakt og lettere i oppblåsthet. Det ville være fint å se Facebook plassere mer av fokus på interaktive elementer og kanskje øke skriftstørrelsen deres også.
Tidslinje med flere kolonner
Veering mot en vertikal kolonnelayout er Alejandro Osorios redesign. Denne oppsettet representerer profiltidslinjevisningen som Facebook-brukere ser når de besøker en brukers profilside.
Designet er slående, men kan være off-putting til noen brukere. Det er avhengig av flere sidekolonner å organisere brukerens profilkoblinger, sammen med en tidslinjevisning av de siste innleggene. Alle fargene og elementene er tro mot Facebooks designstil. Det føles sikkert som en Facebook-tidslinjeside.
Men noen av sidebarelementene kommer ut som litt forvirrende. For eksempel, en grønn knapp med et enkelt pluss tegn rett ved siden av a “Følg” knapp. En bruker bare et symbol, den andre bare teksten. Dette føles uoverensstemmende med designstilen og annen profilinformasjon.
Det jeg liker mest her er klar struktur av data i tidslinjen. Alt er organisert tydelig, og det er til og med sidebar lenker for å bytte mellom de siste innleggene og populære innlegg.
Innhold-tett Redesign
Større nettsteder som Facebook-avtale med mye mer data og en brukerbase som vil ha enkel tilgang til dataene. På hjemmesiden redesignet av MagicVoltage finner du en konsekvent funksjon: mye innhold i en sideoppsett.
Facebooks hjemmeside er den første tidslinjevisningen som brukere ser når de først besøker nettstedet. Den inneholder nylige innlegg fra venner, en chatliste, spill, annonser og annen relevant informasjon som kommende fødselsdager.
Opptattingen av dette oppsettet er det som gjør det både flott og potensielt kontroversielt. Å ha alt dette innholdet på en side gjør det super lett å navigere - når du faktisk lærer hvor alt ligger. Og de øverste venstre ikonlinkene er bare vage nok til å frata noen fra å interagere med dem.
Men for å beskytte dette designet håndterer det tett pakket innhold veldig bra. Det er masse mellomrom mellom elementene og det kjører en fire-kolonne design briljant.
Voluminous Navigation
Dette såkalte Facebook 2.0 redesign laget av Marcelo Silva er virkelig et syn å se. Hans demonstrasjonslayout viser en oppdatert hjemmeside med en tidslinje og delvis skjulte chat-kontakter.
Et stort stykke til dette designet er tiered navigasjonssystem. Jeg liker hvordan det er en primær nav med ikonforbindelser som viser sekundære lenker. I ovenstående skjermbilde velger brukeren profilikonet som har lenker til leser nylig historie og redigerer profilen.
I motsetning til Facebooks tradisjonelle firkantede bilder, er Marcelo redesign velger mot det sirkulære bildet. Denne stilen er allestedsnærværende både i tidslinjen og i chatlisten.
M Assistant & Nylig Aktivitetsliste
Det er mye å si om Steven McCabes FB-redesign. Faktisk har mange områder som spill og nylige aktiviteter blitt fullstendig omdesignet med en imponerende ansiktsløftning.
Stevens design er mye mørkere enn Facebooks nåværende fargeskjema. Jeg liker dette fordi det bygger mer kontrast mellom sidebjelker og primær sideinnhold. Facebooks nåværende hjemmeside har mesteparten av dette innholdet, men over tid kan det blande seg inn i bakgrunnen.
Overskriften bruker fortsatt røde bobler for å signere varsler. Det er også trending innlegg og en newsfeed med muligheten til å sortere gjennom nylig aktivitet fra venner i høyre sidefelt.
Helt nederst vil du legge merke til en liten boks for Facebooks M, the tilsvarende Siri for Facebook-brukere.
Denne funksjonen får ikke mye oppmerksomhet i redesign, men Steven gikk virkelig all-out for å gjøre konseptet hans virkelig representere moderne Facebook-teknologi.
Four-Column Timeline Layout
Her er en annen 4-kolts hjemmeside redesign laget av japansk designer Sho Kameya. Alle disse kolonnene sperre hele siden, både bredde og høyde.
Den langt venstre sidebaret legger stor vekt på tradisjonelle Facebook-koblinger for spill, apps, sider, dev-ressurser og andre lignende elementer. Neste er innholds-kolonnen som er den mest varierte blant alle redesignene. Dette beholder ikke de tradisjonelle koblingene for oppdateringsstatus / legg til bilde, men bruker i stedet a minimalistisk tilnærming med skjulte alternativer.
De to høyre sidebjørene inkluderer alt annet med flere bilder som bruker avatarer og spillikoner. Denne designen holder fremdeles alle oppdateringene som bursdager, samtaler og vennevennlige anbefalinger.
Denne designen er svært variert, men holder seg til kjernen i Facebook-funksjonene. Det kan ikke være det perfekte redesignet, men det viser mulighetene for en fire-kolonne layout.
Forenklet brukergrensesnitt med mørk chatliste
Målet med Ben Hartleys redesign er enkelhet og subtilitet. Oppsettet bruker en kombinasjon av flate designkonsepter med noen få dråpeskygger på større sideelementer.
Mange merkede elementer forblir de samme, og han stoler på Facebooks tradisjonelle blå / grå fargevalg. Men du vil legge merke til at noen av ikonene er blitt omformet enten mindre eller enklere (eller begge).
Dette oppsettet er også avhengig av sirkulære avatarer og gir god plass til bilder som deles med innlegg. Jeg liker virkelig hans oppdatert chatliste med mørkere fargevalg og mindre statusikoner.
Mens Ben's redesign fortsatt føles litt rotete, føles det mye enklere. Dette ville være et tøft design for å måle brukeropplevelsen uten UX-studier i en nettleser. Men på et øyeblikk virker det enklere å bla gjennom og gir mer plass til å forbruke tidslinjens innhold.
Wrap-Up
Selv om disse eksemplene først og fremst fokuserer på Facebook, kan de lærte erfaringene brukes på ethvert nettsted. Stor brukeropplevelse design overskrider alle språkbarrierer, og det er en viktig del av den digitale kreative prosessen.
Du kan låne ideer fra denne analysen og til og med gjennomføre lignende ideer i ditt eget prosjektarbeid. Også hvis du finner noen relatable Facebook redesigner, er du velkommen til å dele i kommentarene med din egen analyse.