Share
Vi ville være sikre på at du har sett Haraldur "Halli" Thorleifssons arbeid i naturen. Med store prosjekter under beltet hans, for eksempel Google + -informasjonssiden, informasjonssiden for Google Disk, samt å jobbe for Square, Pinterest, Microsoft og andre høyprofilklienter, er Hallis arbeid overalt. Men i dag fokuserer vi på hans vakre porteføljeside, som du kan se på haraldurthorleifsson.com.
Vi hadde sjansen til å snakke med Halli om hvordan han nærmer seg design, og vi snakket spesielt om hvordan han nærmet seg prosjektet for å sette sitt eget arbeid der ute. Her er hva han måtte si.
Tuts +: Når du nærmet seg problemet med å bygge opp din egen portefølje, hva var designets imperativer og mål?
Halli: Først av alt var det for meg selv. Som du vet, har du vanligvis ikke full kontroll over prosjekter du jobber med [i kontraktsverdenen] - de kan ha kommersielle eller forretningsmessige årsaker til å gjøre noe du foretrekker å gjøre på en annen måte. Jeg tror de fleste designere er stolte av sitt arbeid og de vil vise det i best mulig lys, så det var det jeg tenkte i begynnelsen - hovedsakelig for meg selv, og åpenbart når jeg hadde noe jeg var komfortabel med å vise, kunne jeg sette det å tiltrekke flere kunder.
Jeg har gjort dette i lang tid, så jeg har hatt flere porteføljer tidligere, de var alltid i utgangspunktet endeløse rader med skjermbilder, fordi det er den enkleste tingen å gjøre. Det er litt kjedelig skjønt, så jeg ønsket å bryte det opp, sette disse skjermbildene i en kontekst, sette designelementer rundt dem, og gjøre disse case-studiene sine egne ting.
Men selv om det startet som et prosjekt for meg, ble det også raskt om andre ting. Hvis du har en fin portefølje, kan du skyve den til priser, og forutsatt at du vinner noen, som vil gi deg mye trafikk og forhåpentligvis et sted i den trafikken, er det noen nye, interessante kunder.
Jeg bruker også Dribbble mye, og jeg så porteføljen og min Dribbble-konto som koblet til. Jeg ønsket å kjøre trafikk fra min Dribbble til min portefølje, og fra min portefølje til min Dribbble, så det er en slags selvmating "båndorm". Hvis vi gjorde det riktig, ville vi få mye trafikk til nettstedet, og utnytte det for å få flere Dribbble-tilhenger. Det er ikke bare en forfengelighet eller en søken etter et resultat, Dribbble blir en så viktig plattform for å få nytt klientarbeid. Jo flere følgere du har, desto høyere er du på søkeresultater på Dribbble selv.
Tuts +: Så det er nesten som SEO for Dribbble?
Halli: Ja, det var en av hovedårsakene til at jeg bestemte meg for å ha Dribbble-indeksen nederst. Jeg ønsket så mange som kom til nettstedet (vi fikk om 100 000 i den første måneden) som mulig å følge meg på Dribbble.
Tuts +: Så har du sett en økning i det følgesvennskapet?
Halli: Ja, jeg så om 3.000 tilhengere ut av denne lanseringen.
Tuts +: Det er fantastisk! Så, du har nevnt at du tidligere har hatt skjermbilder på nettstedet ditt, som fortsatt er et primært element i denne designteerasjonen. Hvordan har du funnet sted for disse å sitte? Hver av disse porteføljebrevene er sine egne dyr-spesifikke elementer for hver porteføljeoppføring med sine egne interaktive egenskaper. De er slags "metaprosjekter", eller prosjekter om prosjekter. Hvordan har du gjort siden støtter disse varierte skjermbildene alt på ett sted, samtidig som du beholder sammenhengskraft i hele designet?
Halli: Problemet med å bruke et nettsted som en måte å vise nettstedet på, er - vel, du har en person som kommer til nettstedet, og du har en ramme for nettstedet du prøver å vise, og hvordan viser du det i nettleseren ? Ved å vise dem en annen nettleser? Det blir så kjedelig. Noen prosjekter er vanskeligere enn andre. Google + -prosjektet var for eksempel alt layoutarbeid, og det var egentlig ikke mye jeg kunne gjøre der, så jeg måtte prøve å stable dem på en interessant måte, men det gir egentlig ikke noe bra for noe slikt. På den andre enden er noe som Santa Tracker eller mer enn et kart mye annerledes fordi det er så mange visuelle elementer utenfor det du kan finne på en vanlig nettside, og siden de begge var fullskjermopplevelser, har alle skjermbildene det samme aspektet rasjon. Google+ i den andre enden er mange veldig lange sider, det er ikke lett å vise det.
I begynnelsen ville jeg ikke ha en mal, fordi jeg visste at prosjektene ville være annerledes - det ville ikke være noe for meg å designe en mal som passer dem alle sammen. Jeg ønsket også stilen for hvert prosjekt å ta over siden. De fleste av disse er veldig flate, eller rettet mot flate ting, men jeg ville være i stand til å la et prosjekt som ikke er flatt passform på nettstedet. Derfor har nettstedet ikke noen andre kontroller enn topplinjen, og jeg kan endre fargen til den. Nettstedet er ganske mye et tomt lerret når jeg begynner å vise et prosjekt. Og jeg tror det må påpekes at min utvikler er så utrolig at han bare aksepterer at han ikke vil kunne gjenbruke noen elementer. * (ler) *
Tuts +: Det er et annet interessant aspekt av dette prosjektet. Du fortalte oss før intervjuet at du ikke kode, noe som kan være en god begrensning. Dette er et varmt tema i designverdenen. Folk som Chris Coyier har sagt positive ting om å la designere ha full kreativitet over sitt arbeid, å designe uten å oversette det til nettleseren i takt med designprosessen, og deretter ta det til utvikleren som en utfordring. Har du med vilje holdt deg borte fra kode, eller har det vært mer personlig valg å ikke lære det?
Halli: Jeg tror nesten alle kan lære noe, så jeg tror ikke det er så mye. For meg eller noen som skal bli veldig gode på noe, må de virkelig fokusere på det i lang tid. Og det er bare ikke der jeg vil fokusere tiden min. Jeg kunne kode et grunnleggende super-enkelt sted, men det ville ta meg lang tid, og det ville bli veldig dårlig gjort - det er folk der ute som er mye bedre på det enn jeg, og for meg å fange opp, jeg Jeg må gjøre det heltid. Folk snakker om disse "enhjørningene" (designer-developer hybrider som er flotte på begge) ... og det er ærlig ikke mange av dem. Når du ber om en liste, får du alltid de samme navnene. Når du har en designer som også er utvikler, tenker de vanligvis "hvordan kan jeg designe dette slik at det er lett for meg å kode", der jeg ikke trenger å tenke på det, så jeg kan bestemme hva jeg vil design. Ganske mye noe på dette tidspunktet kan oversettes til kode. Det var ikke tilfellet da jeg startet for femten år siden. Nå, alt jeg kan drømme, noen kan kode.
Problemet jeg har med "designers should code"-argumentet er at det også er så mange andre ting de egentlig burde gjøre. De bør vite om markedsføring, de bør forstå forretninger, copywriting, storytelling - det er så mange ting de må huske på. Jeg ville ikke sette kode på det andre prioriterte stedet på listen over ting å lære for en designer. Men etter å ha sagt alt dette, tror jeg ikke det er virkelig en regel for "dette er hva en designer burde være" - hvis folk ønsker å designe og kode så mer kraft til dem, er det bare ikke for meg.
Tuts +: Et av hovedargumentene for designere som trenger å lære kode er at det hjelper designere å forstå responsivt design og enhetens agnostisisme. Hvordan påvirker problemet med kompatibilitet på tvers av enheter hvordan du tenker på en designtilnærming? For eksempel, med nettstedet ditt, størrte vi det til 220px bredt, og det så bra ut, men det ser også fantastisk ut på 2000px bredt. Hvordan gjør du det med et nettsted som destinasjonssiden for Google + -informasjon når du designer statisk?
Halli: Jeg tror sin erfaring, for det meste. Jeg ser på nettsteder hele dagen lang og har det veldig lenge. Nå, etter at responsiv design kom på scenen, når jeg kommer til et nettsted, endrer jeg størrelsen på det for å se om det svarer. Jeg prøver å se hvordan de beveger elementene - ikke nødvendigvis hvordan de teknisk sett gjør det i kode, fordi noen andre kan finne ut det for meg.
Det ser ut til at problemer med å designe helt i nettleseren er at designene pleier å se like ut, men kanskje jeg er bare for gammel, har gjort dette for lenge. Kanskje de nye designerne vil finne ut dette bedre enn jeg har.
Hvis jeg jobber med en veldig god utvikler som James Dickie, som kodet nettstedet mitt, hvis jeg har en ide om hvordan ting skal se ned til mobil, og jeg har en ide om hvor brytepunkter er og hvordan de skal fungere, Vanligvis det jeg gjør er å gi ham skrivebordsdelen. Han legger det inn i rutenettet, og vi ser hva som skjer. Vi gjentar bare derfra. Jeg designer ikke alle breakpoints lenger. Jeg vet at hvis designen er en bestemt måte, så vi ikke har mange stablede elementer, vil det sannsynligvis dimensjonere seg grasiøst. Det er alltid problemområder, men vanligvis er det best å løse disse problemene direkte ved deres bruddpunkt. Noen ganger forbauser det meg hvor godt det virker å sette et design i rutenettet. Så kanskje du hevder at jeg gjør design i nettleseren når alt kommer til alt ...
Tuts +: Så det er nesten som en intuisjon på et visst nivå - du har lært at dette er slik folk interagerer med nettlesere. Dette er måten nettlesere jobber med, så la oss se om vi for eksempel kan holde dette mer vertikalt lagt ut.
Halli: Det er en av de viktigste tingene jeg gjør - jeg prøver nesten alltid å sette ting vertikalt. Ikke nødvendigvis på grunn av respons, men fordi jeg vil at brukeren skal fokusere på en ting om gangen - jeg vil ikke at de skal se flere ting. Jeg vil at de skal bla nedover siden, oppleve en progresjon, en slags historie som jeg prøver å fortelle, og treffer de emosjonelle tingene du vil treffe. Hvis du prøver å selge noe, kommer du til slutt i slutten av historien etter å ha slått disse punktene, og det er en kjøpeknapp der.
Denne tilnærmingen er åpenbart mye lettere med kommunikasjonsdesign. Det er ikke så enkelt i produktdesign, der det vanligvis er mange flere handlinger du vil sette foran brukerne, noe som er mer utfordrende. Det er en av grunnene til at ingen av disse virkelig store produktene er lydhøre helt ned.
Å gå tilbake til spørsmålet ditt om publikum - publikum for dette var virkelig byråer eller klienter som vil ha en stor skjerm, vanligvis. De vil ha de dyre tingene, og jeg ville ha det til å se veldig bra ut på en 27-tommers skjerm. Det må se veldig bra ut på en stor skjerm, så når vi trenger, har vi store bilder på toppen av noen av disse ting - som 2500px bredt - og du vet, jeg trengte ikke å tenke mye om begrensninger som båndbredde, for det er vanligvis ikke en begrensning for det publikum.
Når det gjelder responsen, fortjener min utvikler mye av kreditten der. Jeg trodde i første omgang å gjøre dette nettstedet responsivt, ville bare være altfor mye arbeid jeg fortalte ham i begynnelsen at han ikke burde bekymre seg over det i det hele tatt, men han insisterte. Så, han burde faktisk få mesteparten av kreditten.
Tuts +: Og det er også noe vi vil snakke om her - hvor mye verdi legger du på hvor godt du kan kommunisere med utvikleren din? Du har nevnt ham et par ganger, og det ser ut som at samarbeidet er veldig viktig for prosessen.
Halli: Det er ingen nettside uten designer, og det er ingen nettside uten en utvikler. Det kan være den samme personen, og det kan ikke være godt utformet eller godt utviklet, men det er ingen måte å ha et nettsted uten begge elementene. Som jeg sa tidligere tror jeg at de fleste virkelig egentlig bare kan være gode på en av disse tingene. Å ha en utvikler som kan ta noe som jeg designer og kodes det er ekstremt viktig, så det er også veldig viktig å ha et godt forhold til den utvikleren. Jeg har jobbet med James en stund, og jeg legger ham for hvert prosjekt jeg jobber med.
Det viktigste er vanligvis kommunikasjonen. Hvis du er i stand til å snakke med noen, og de svarer på notatene dine og er enige om at det er verdifullt å flytte den ene tingen 1px til venstre, er helt verdt det. På dette prosjektet ville jeg forandre meg, og James ville gå frem og tilbake med meg, foreslå måter å gjøre ting på, flytte ting rundt, etc. Uten den prosessen ville det ikke være halv så godt. Så, jeg synes det er ekstremt viktig å ha den involverte utvikleren. Mange ganger vil jeg avlevere et design, og jeg får ikke engang beskjed når det lanseres. Det er ingen kommunikasjon i prosessen, og som du kan forestille deg det ikke fører til de beste resultatene.
Tuts +: Ja - du vil ha åpne kommunikasjonslinjer så mye som mulig.
Halli: Du vil være uenig, og ha noen som kan fortelle deg at det er en bedre tilnærming. Hvis utvikleren har et godt øye for design, vil han gjøre alt bedre. Noen av de beste tilbakemeldinger jeg får er fra utviklere. Så lenge det kommer fra det stedet de vil ha godt arbeid i motsetning til å gjøre det enkleste, så hører jeg.
Tuts +: Ja, det virker som mange utviklere må veie dette hele tiden - at forretningsverdien av designforespørselen samsvarer med hvor mye arbeid det tar å fullføre denne forespørselen. Hvordan balanserer du seesaw mellom godt arbeid og god forretningsverdi?
Halli: Jeg tror alltid at de til slutt er de samme. Hvis jeg kommer til et nettsted, og det er stygg, så vil det sannsynligvis ikke selge meg noe. Hvis jeg kommer til et nettsted og det er vakkert, men ikke fungerer, vil det heller ikke selge meg noe. Jeg liker virkelig å jobbe med folk som vil gå den ekstra mile (eller noen hundre miles) fordi de vil ha noe å være veldig bra. Jeg tror det er vanskelig å sette en dollarverdi på den, men det er fortsatt verdt det.
Tuts +: Helt enig. Vi skal skifte til et slags varmt emne som er blitt kastet rundt over hele nettet som du fremhevet tidligere i intervjuet. Du nevnte at nettstedet har en flat estetikk. Det er mange kritikere i brukeropplevelsen og mange mennesker som er for eller imot "flat" heftig - det er en stor krig med design i dette området. Jeg er sikker på at i femten års arbeid med design har du opplevd lignende drama. Noen sier om "flat" at det er ekte, at det styrer den digitale opplevelsen å være ekte digital. Hva er dine tanker om dette argumentet?
Halli: Vel, jeg tror det er en forenkling. Jeg tror at grunnen til flat er kompleks. Responsive spiller en rolle - hvis du har en flat overflate, er det veldig lett å skalere det opp eller ned. Hvis du har en flat overflate, tar det ikke mye båndbredde. Men det er også bare tidkrevende å designe de gamle Apple-stilikonene - det tok så mye tid.
Så jeg tror det er mange forskjellige grunner, og så idealiserer folk noen av disse tingene etter det faktum. Mange mennesker behandler dette som en religion og sier ting som "det er ikke flatt nok", som om det ultimate målet er å ha ingen skygger, ingen gradient hvor som helst - som om den beste designen er helt flat, noe jeg helt uenig med.
Det er et problem når du får en trend der alle går inn i alt - alt begynner nå å se det samme. Hvordan skiller du ut, eller gjør noe minneverdig?
Jeg tror flat, eller i det minste flattere enn det vi hadde, er bra for mange ting. Men jeg liker fortsatt gradienter og slippe skygger. De kan være mye subtilere enn de pleide å være. Folk begynner å forstå at en knapp ikke må se ut som en fysisk knapp. Men det trenger fortsatt å skille seg ut, og det må se ut som om du kan trykke på det. Jeg synes "flattere" enn hva vi kollektivt hadde før, er bra. Jeg tror helt flatt tjener ikke noe formål. Hvis det virker, så er det bra for prosjektet ditt. Vi bør ikke gjøre det til et mål i seg selv. Jeg har faktisk vært i møter der folk ville si "det er ikke flatt nok" - det er egentlig ingen måte å svare på det.
Tuts +: Absolutt. Design bør respekteres som en høyere nivå enn bare å bestemme at vi ønsker å gå mot en flat estetikk, så la oss kjøre alt til flatt. Det er ikke å oppnå noe annet enn ønsket om å være flatt.
Halli: Ja, for å følge trenden. Med mindre du har en grunn, som for eksempel Google. Jeg vet ikke om du husker, men Google pleide å være veldig stygg. En av grunnene var at de hyret sin første designer rundt sju år inn i selskapet, det var, og på mange måter er det fortsatt et utviklingsdrevet selskap. Men de har også så mange uavhengige divisjoner, i motsetning til et selskap som Apple der det er en massiv topp-down design imperative. Google har disse mange avdelinger som har mye frihet, så regjeringen alt det inne er en stor innsats.
Jeg tror at designteamet hos Google gjorde en fantastisk jobb med det. Jeg tror de plukket den flate stilen de har nå delvis fordi det lett kunne forklares. Du kan bringe folk inn og skala det designet, fordi du kan sette en stilguide som lett kan følges samtidig som du opprettholder mye frihet du hadde før.
Tuts +: Og det er fantastisk at du hadde en hånd i det skiftet i Googles design. Og det er en god grunn til å gå flatt. Og du kan se hva du snakker om fortsatt i Google - med stykker som Analytics er helt forskjellig fra noe som Google+ eller Gmail.
Halli: Og med iOS 7 tror jeg ikke det er flatt i det hele tatt. Det er mye dybde, det er mange gradienter. Og btw, jeg liker virkelig iOS 7, det er noen tøffe kanter, men samlet tror jeg det er et godt sprang fremover for Apple. Det kan ikke være så skeuomorphic lenger, men det er ikke flatt.
Tuts +: Ja, det er en vanlig misforståelse - som når noen sier at noe er parallax når det egentlig ikke er parallax. Misforståelsen er, hvis knappene ikke ser ut som knapper lenger, hvis ting minimeres til færre farger, færre grenser - folk vil merke det som "flatt".
Halli: Yeah. En ting jeg liker om flat er, du kan ha flere elementer. De konkurrerer ikke med hverandre. Hvis hver knapp er veldig tung, begynner å ha en haug med dem på en side - graden av siden går av. Flat vil tillate deg å ha et mer komplisert brukergrensesnitt og fortsatt ikke ta for mye visuelt plass.
Brukergrensesnittet til iOS 6 Finn mine venner er et godt eksempel på dette. Brukergrensesnittet er i veien. Det er så tungt at alt annet faller tilbake. Det skal være motsatt av det - brukergrensesnittet skal være i bakgrunnen, opplevelsen og innholdet skal være i forkant.
Tuts +: Absolutt. Vi skal rundt dette med et spørsmål om porteføljen din, og dette er et bredt spekter. Hvilke utfordringer var det vanskeligste i denne prosessen? Alle er deres egen verste kritiker, og det er empirisk vanskelig å bygge noe for deg selv, fordi det er en følelse at det aldri kommer til å bli ferdig hvis du har nøklene. For eksempel begrensede du deg selv til de fire prosjektene ved lanseringen, og så spiste folk til Dribbble. Har du satt en tidslinje eller begrensninger for å starte?
Halli: For omtrent et år siden begynte jeg å gjenopprette porteføljen min. Jeg visste at jeg ønsket å ha fleksibilitet, jeg visste at jeg ønsket å virkelig ta meg tid, og jeg visste at jeg ikke koden. Jeg startet faktisk ved å bygge ut hele nettstedet helt ut av PNG, inkludert tekst. På den måten kunne jeg sette opp en casestudie i min egen tid - jeg måtte ikke stole på en utvikler. Jeg kunne se det leve en stund. Jeg kunne ta tiden min å designe det mellom å betale prosjekter.
Det var ekstremt enkelt, og det gjorde noen utviklere cringe, men det betydde at jeg virkelig kunne ta tid til å tenke på disse stykkene. Da vi endelig flyttet, visste jeg at disse case-studiene var de jeg ønsket å bruke. Jeg ønsket å vise bredde, noen få ting jeg kunne gjøre.
Etter at vi startet på nytt, var stedet ganske mye som det er nå, bortsett fra at sakstudiene var i en karusell. Men det ga for mye vekt til Dribbble-fôret, da det er så mye mer visuelt komplisert enn casestudien. Så James foreslo å kutte dem ut av karusellen, vi gjorde det og da tenkte jeg endelig at nettstedet var ferdig.
Folk spør noen ganger om Dribbble-nettet, som jeg tidligere sa, en av grunnene var å kjøre trafikk der og få tilhengere, men jeg ønsket også å kunne vise nye ting lett. Noen prosjekter er ikke store nok til en case studie, men jeg vil fortsatt vise dem på en eller annen måte. Jeg ønsket også den følelsen av at folk kom inn og sa, "ok, det er mange ting her." så Dribbble-nettet er en måte å unngå å bli oppfattet som noen som bare designer for Google.
Tuts +: Og det er interessant, fordi det sikkert skisserer arbeidet ditt med Google mest foran. Det er selvfølgelig det mest synlige for verden, slik at avgjørelsen gir mening ut fra perspektivet på å prøve å få nye kunder. Men så ser du på Dribbble, og det er et mye bredere utvalg av arbeid og stil.
Halli: Og det går tilbake til et tidligere spørsmål - da jeg begynte å gjøre min portefølje og saksstudiene, leste jeg en artikkel. De gjorde dette eksperimentet hvor de satte en virkelig flott fiolinist, Joshua Bell, i en DC Metro-stasjon. Han spilte som en time eller to, og gjorde kanskje $ 20. Neste kveld spilte han på et teater i Boston og solgte et auditorium på $ 100 et sete.
Mens jeg leser at jeg bare husket å tenke, har jeg prosjekter jeg virkelig liker. Jeg har satt dem på Dribbble, og de tok ikke av seg i det hele tatt. Som designer bør du virkelig vite at konteksten er alt, men uansett grunn det bare aldri klikket på at det er akkurat det samme når du viser deg ditt eget arbeid.
Folk trenger hjelp til å oppdage verdi. Folk kan tro at noe er verdifullt fordi det koster mye, eller i mitt tilfelle fordi det er satt inn i en slags kontekst, slik at du kan se at det er omsorg som legges inn i det. Jeg tenkte på Joshua Bell, den samme fyren spiller det samme stykket på begge steder. Kanskje var akustikken ikke den samme, men det var noe med sammenhengen som gjorde en gruppe mennesker i en situasjon forstå verdien av arbeidet, og en annen gruppe mennesker i en annen situasjon verdsetter det helt annerledes, eller mer nøyaktig, verdsetter ikke det i det hele tatt.
Nettstedet mitt tok mye tid og krefter for meg. Så spørsmålet var, er det berettiget for meg å legge til side betalende klientarbeid og fokusere på mine egne ting? Jeg bestemte meg endelig for at det kanskje er viktig for folk å se arbeidet mitt i riktig sammenheng. Og jeg kan snakke av erfaring etter det faktum og si at det var helt verdt det. Det hjalp meg med å få større og bedre prosjekter, og det gjorde meg faktisk en bedre designer.
Så jeg tror alle skal gjøre dette - for å vise frem sitt arbeid i best mulig lys. Hvis ikke for verden, så bare for seg selv.
Tuts +: Det er en stor utfordring. Takk for din tid Halli - vi kaller det en vikle!
Accentsconagua