Den tekniske designer

Jeg lærte at kode midtvejs i min designkarriere, og det har hjulpet mig på måder, jeg aldrig forventede ... især med at arbejde ved en opstart. Det har gjort mig mere skræmmende, mere konsistent, og det har givet mig perspektiv at indstille mit designteam til fremtiden.

Foto af Chris Ralston

Jeg var heldig at starte min designkarriere lige da Web 2.0 eksploderede. Blanke knapper, AJAX og animation overalt. Som design freelancer arbejdede jeg sammen med udviklere for at bringe mine designs til live i kode. Ofte gange, der bestod af en overlevering, der ventede en uge eller to, og derefter en (temmelig anspændt) tszujing-session med udvikleren.

Kan du få disse tekstblokke til samme bredde? Kan du flytte dette billede 2px til venstre og 1px nedad?

Det var frustrerende for udviklere, men det var dybt frustrerende for mig også. Ikke kun på grund af det ekstra arbejde, men fordi jeg næsten altid endte med at gå på kompromis med min designvision på en (tilsyneladende) triviel måde. Ingen animation her. Mangel på konsistens der. ”Det er ikke muligt i kode.” Jeg levede i en verden, hvor mine Photoshop-mockups altid var meget pænere end hvad der blev sendt. Sådan var tingene.

Jeg brugte også en overdreven tid på at forsøge at co-vælge ingeniørvenner til at hjælpe mig med at opbygge websteder, apps og falske sideprojekter. Jeg kunne designe hvad jeg ville, men jeg kunne ikke bygge noget. Det sugede.

Jeg tog noget tid mellem eksamen og at finde mit første startjob for at lære at kode. Jeg startede med at opbygge min personlige hjemmeside og sende masser af irriterende iMessages til kodevenner, der bad om hjælp, da jeg sad fast. Det var virkelig hårdt til at begynde med, fordi jeg vidste, hvordan jeg ville have, at tingene skulle se ud, men ikke hvordan man kode det, og hvordan man kunne Google med de rigtige ord. Det var langsomt og hårdt, men efterhånden tog jeg mønstre op og lærte lingo. Det blev meget lettere at søge efter kodeeksempler og stille de rigtige spørgsmål.

Til sidst byggede jeg Startups, sådan fungerer design - det første sideprojekt, jeg nogensinde har sendt på egen hånd - og til sidst følte jeg, at jeg fik fat på kodning. Jeg designede endda et gittersystem ved en fejltagelse, fordi jeg faktisk ikke vidste, at ting som Foundation og 960 gitter eksisterede . Et par projekter senere føltes HTML og CSS som anden karakter. Jeg er overbevist om, at det var den vigtigste færdighed, jeg nogensinde har lært som designer.

Den skræmmende designer

Da jeg tiltrådte Envoy, var teamet (f.eks. De 5 personer, der trængte rundt om et bord i en SoMa-lejlighed) behov for at sende den offentlige beta på syv dage. Vi havde også brug for et nyt websted for at vise det frem.

De to ingeniører var fokuseret på at opbygge produktfunktioner og squash-bugs, så jeg fik til opgave at designe og bygge hjemmesiden på min egen. Ingen problemer! Jeg havde gjort dette før. Men det viser sig, at vi også ønsket at simulere hele iPad-loginoplevelsen med animation som en del af landingssiden ... så måske kom jeg lidt over hovedet.

Heldigvis med grundlæggende HTML / CSS-viden gjorde det lettere at stille de rigtige spørgsmål, da jeg sad fast. Jeg snublede gennem StackOverflow (en fantastisk teknisk ressource!) Og opdagede en uheldig måde at simulere indtastning og svejse med Javascript. Det nye websted var så sjovt at bygge, og animationen var noget, jeg aldrig ville have overvejet, hvis jeg startede i Sketch, som jeg plejede at gøre. IPad-animationen var let at blive gravid og eksperimentere med i kode, men meget vanskeligere at formidle i en statisk mockup. Vi var i stand til at bevæge os hurtigt og give et fantastisk resultat i tide til lancering.

Systemdesigner

Med min nyfundne færdighed til at designe produkt i kode voksede jeg til at hate hadoffs. Det blev lettere at realisere et UI-design i kode og arbejde med en ingeniør til at trække det op end at dumpe mockups i en ingeniørs skød. Jeg lærte også, at det var meget lettere for mig at skabe en god oplevelse for brugerne, da jeg arbejdede i et partnerskab med ingeniører fra starten. At have ordforråd i HTML og CSS (mindst) gjorde denne proces meget lettere på begge sider.

Kort efter lanceringen genopbyggede og redesignede vi vores webapp for at imødekomme ny funktionalitet og tilføjet kompleksitet. At designe hele frontenden af ​​et nyt produkt var en utroligt skræmmende opgave: at holde komponenterne konsistente, definere et typesystem og sætte os op til fremtiden var et stort spørgsmål til et lille team med en designer.

En af mine venner foreslog at bruge en CSS-ramme til at designe genanvendelige komponenter i kode, med forudindstillinger til skrifttyper, typeskala, farver og andre elementer. Denne åbenbaring gjorde et skræmmende websted på 50 skærme til en håndfuld af komponenter arrangeret på forskellige måder på forskellige skærme. Det var stadig et kæmpe projekt, men meget mere håndterbart for vores lille team.

Rammerne satte os også op til vækst. Med et designteam på fem bruger vi stadig en version af den originale ramme i dag. Vi har masser af planer for at gøre det endnu mere udvideligt konsistent i fremtiden!

Holddesigneren

Da designteamet voksede, skiftede mit job fra designer til mentor. Holdet spøger med, at min Sketch-version altid er forældet ... og desværre har de normalt ret. I stedet for at designe grænseflader er mit nye job at hjælpe med at designe det bedste designteam i verden.

Envoy er stadig et lille firma, så enhver designer og tekstforfatter har brug for forskellige hatte. Vi samarbejder stærkt med produktledere for at forstå problemer og definere løsninger, vi arbejder tæt sammen med ingeniører for at bringe disse løsninger til live, og QA det arbejde, vi sender til kunderne for at opretholde et niveau af håndværk og kvalitet, som vi alle kan være stolte af.

Mange af designerne på Envoy kom med en begrænset kodningsoplevelse, men alle (ja, endda forfattere) har rørt kode på en meningsfuld måde. Vi investerer i at lære hinanden færdigheder (ikke begrænset til kodning!), Og det er en del af vores kultur at hjælpe hinanden med at være bedre designere. Vores mål er at blive en uvurderlig partner for vores teknik- og produktholdkammerater gennem hele produktudviklingscyklussen.

Jeg tror (sandsynligvis ikke kontroversielt), at designere er mere end pixel-pushere. At designe digitale grænseflader i 2018 uden kendskab til kode ligner en maler, der ansætter en anden til at bære penslen, uden at forstå malingens viskositet, hvordan farver blandes, eller hvad en børste kan og ikke kan gøre. Designet og mediet er et.

Lær at kode. Hvis du ønsker at skubbe grænserne for design i en virksomhed fra en tidlig til midten fase, har du brug for denne færdighed i 2018. At forstå det grundlæggende og skubbe grænserne for dine færdigheder vil hjælpe dig med at arbejde skrånende, opbygge fantastiske designsystemer og skabe ting du har aldrig forestillet dig muligt.

Hvordan har det at lære at kode hjulpet dig i din karriere? Jeg vil meget gerne høre dine historier i kommentarerne

Tak for at have læst! Sørg for at besøge envoy.design og abonnere for at blive underrettet, når vi offentliggør noget nyt.