Design af et visuelt system i skala

For omkring et år siden tog jeg på mig udfordringen med at lede anstrengelsen for at designe et sammenhængende visuelt system til alle Facebooks forretningsprodukter - de værktøjer, virksomheder bruger til at oprette forbindelse til milliarder af mennesker rundt om i verden.
 
Mens hvert af værktøjerne udførte deres tilsigtede funktioner godt, leverede de ikke en tilfredsstillende samlet oplevelse eller inspirerede tilliden til de virksomheder, der betroede deres vækst til os. Vores UI-mønstre, brug af farve og ikonografi varierede alt fra produkt til produkt. Den samlede oplevelse så ikke kun forældet ud, men også ude af kontakt med Facebook, som disse professionelle brugte i deres personlige liv.
 
Vi ønskede at skabe en konsistent, tilfredsstillende, menneskelig oplevelse, der er værdig til den værdi, vores forretningsprodukter kan låse op for både virksomheder og mennesker. Vi ønskede også at demonstrere vores engagement over for disse virksomheder ved at forbedre de værktøjer, de stoler på.

Et system, mange oplevelser

Jeg vidste, at projektet ville være en teamindsats, men jeg blev skræmt. Indtil det tidspunkt havde jeg designet UI til The Sims og skabt en omfattende stilguide til SFMOMA, men disse projekter havde kun et publikum og et produkt. Oprettelse af et sammenhængende visuelt system, der spænder over flere annonceværktøjer til forskellige kundesegmenter, inklusive millioner af små virksomheder, store mærker og bureauer samt vores marketingwebsted, var en helt anden skala af udfordringer og meget mere kompliceret end noget andet jeg ' d nogensinde gjort. Ikke kun havde hvert produkt et andet look og præg, men der var 150 designere på tværs af disse produkter; systemet ville være nødt til at fungere for dem alle.
 
Jeg vidste ikke, hvordan systemet ville se ud, men jeg vidste, at det ikke kunne være for recept. Det måtte være strækkeligt og fleksibelt med evnen til at udvikle sig, når vi voksede. Før jeg dykkede ind i visuals, var jeg nødt til at forstå, hvordan vi ville have folk til at opleve vores produkter. Jeg begyndte at arbejde med vores designlederteam for at definere vores attributter. Hvordan ønskede vi, at oplevelsen skulle føles? Vi kom med en række beskrivelser for forskellige sammenhænge, ​​som menneskelige, professionelle, pålidelige og venlige.

Tilpasning af interessenter

Dernæst foretog jeg en revision på tværs af alle Facebooks forretningsprodukter såvel som vores forbrugerillustrationer og farver. Jeg viste vores forskellige hold, hvor usammenhængende den samlede oplevelse var. Derefter lettede jeg workshops med de forskellige hold, ved hjælp af dotstemning og sticky-note-skrivning til hurtigt at identificere design, som vi troede var succesrige.

Da vi først kom til enighed om en grundlæggende retning - en, vi kaldte ”abstrakt geometrisk stil” - gennemgik vi mange, mange runder af forfining. Vi havde en klar retning nu, men vi havde stadig brug for en delt måde at forstå, hvordan det kunne anvendes på alle de forskellige produkter, som systemet ville omforme.

Binder det hele sammen

Jeg trådte langt tilbage for at se på systemet som helhed. Da jeg gentog den øvelse, vi havde gjort for at definere vores brandattributter, så jeg, at de kunne anvende på tværs af alle de forskellige oplevelser, vi havde til formål at samle. Det var bare et spørgsmål om at justere intensiteten af ​​hver attribut langs et spektrum afhængigt af publikum og produkt.
 
For eksempel ønskede vi, at Power Editor, en annoncegrænseflade, der primært bruges af fagfolk på annoncebureauer, skal føle sig mere sofistikeret og avanceret. På den anden side er folk, der bruger Pages, for det meste små og mellemstore virksomheder, så produktet skal føles enklere og mere tilgængelige.
 
Det samme gjaldt farve. Et publikum har muligvis brug for, at det er pålideligt og roligt, mens et andet har brug for det for at føle sig venlig. Jeg studerede farvesystemet og prøvede at kortlægge det til de dimensioner, som vi udviklede til Facebook-forretning. Ved at anvende dimensioner som disse på tværs af alle de oplevelser, projektet ville påvirke, begyndte jeg at se, hvordan vi kunne adressere alle vores målgrupper på en sammenhængende, systematisk måde.
 
Det betyder ikke, at det var let. At udvikle en farvepalet, der kunne arbejde på tværs af alle forbruger- og forretningsprodukter - holde dem sammen uden at slette meningsfulde forskelle - var en af ​​vores største udfordringer. Mødet krævede meget samarbejde mellem flere hold.

Vi brugte tone-til-tone for at styrke Facebook-mærket og skabe mere konsistens på tværs af forbruger- og forretningsillustrationer. Inden for det overordnede skema brugte vi forskellige farveskemaer til forskellige forretningsprodukter til at skabe klare skelnen mellem overfladerne og hjælpe folk med at forblive orienterede.

At holde det menneske

Farve var blot en del af vores bestræbelser på at skabe forretningsværktøjer, der bragte forskellige oplevelser sammen med at bevare passende sondringer. Facebook handler om at forbinde mennesker, og hvis vores forretningsværktøjer - selv de mest avancerede - føles dehumaniserende eller løsrevet, vil de ikke føle sig som en del af Facebook.
 
Vi havde brug for vores nye visuelle system for at være enkelt og universelt nok til at få forbindelse følelsesmæssigt med bredden af ​​mennesker, der bruger vores værktøjer rundt om i verden. Jeg skrev retningslinjer for at repræsentere mennesker i vores visuelle system, inklusive en masse forskellige hudfarver og frisurer til at repræsentere mangfoldighed.

De menneskelige figurer måtte også afspejle en række forskellige arbejdspladser (agentur vs. restaurant, for eksempel). Forbrugertalene skal se ud som hverdagslige mennesker, aldrig stive eller robuste. På tværs af alle produkter skal folk bruges til at fortælle en historie eller formidle et budskab - aldrig tilfældigt placeret i en komposition. Enhver illustration, der er nødvendig for klart at kommunikere, hvordan de relaterede til vores produkter.

Fem ting lærte jeg

Jo længere væk jeg kommer fra projektets begyndelse, jo klarere bliver dens største lektioner. Nogle af dem er specifikke for Facebooks unikke skala, men jeg håber, at andre er nyttige for alle, der bygger et visuelt system til en bred vifte af oplevelser - eller leder komplekse designprojekter generelt. Her er de fem største takeaways:

  1. Arbejd med teams for at definere klare mål tidligt. Dette projekt havde meget uklarhed og afhængighed. I forskningsfasen afholdt vi intensive arbejdsmøder med alle vores forretningsdesignteam. Den indsigt, vi fik, hjalp os med at etablere klare vejledende principper.
  2. Tage styring. Når disse principper er blevet fastlagt, må overdrivet demokrati ikke overdrives. Forlængede, følelsesladede debatter kan føre til et design, der sammenlægger alles ideer sammen og mangler en stærk personlighed. Når du er i tvivl, skal du se tilbage til de vejledende principper.
  3. Hold kontakten med bevægelige mål. Mange af vores forretningsprodukter blev omdannet på samme tid, da dette arbejde var under udvikling. Kommunikation med de rigtige interessenter fra disse hold til de rigtige tidspunkter hjalp os med at påvirke deres arbejde. Det hjalp os også bedre med at forstå deres designbehov.
  4. Uddanne, uddanne, uddanne. Meget af mit vigtigste arbejde fokuserede på at opbygge en bredere forståelse af, hvad systemet var, og hvorfor det betyder noget. Vi evangeliserede systemet tidligt og ofte gennem en bred vifte af begivenheder og spørgsmål og spørgsmål med forskellige designteam.
  5. Bliv involveret. Uanset hvor sammenhængende og fleksibelt dit system er, skal du stole på, at det har brug for løbende aktiv vedligeholdelse. For at hjælpe med at holde alle vores bevægelige dele på sporet har jeg været involveret, ikke kun som en kilde til svar, men også som lytter. At spørge designteam om deres udfordringer har gjort det muligt for os at implementere flere forbedringer, der har gjort det lettere for designere at passe deres arbejde ind i systemet.

Mod stærkere forbindelser

Ikke enhver oplevelse på tværs af hver Facebook-virksomhed og forbrugerprodukt skaber en perfekt balance mellem særpræg og enhed med den samlede Facebook-oplevelse. Men det visuelle system har hjulpet os med at gøre et stort spring mod dette mål. I stigende grad fungerer vores forretningsværktøjer ikke bare; de har også det godt at bruge. De føler sig mere som en del af Facebook og mere i harmoni med, hvorfor folk bruger dem i første omgang - til at skabe meningsfulde forbindelser med andre mennesker og virksomheder.