Retro tegning og skyggelegging med Adobe Illustrator

Med illustrasjon på datamaskiner er det alltid fristende å bruke alle de dristige og lyse farger som vises i standardfargepaletter. Noen ganger vil færre farger og litt mykere nyanser gi jobben din en viss varme og sjarm som vil la folk spørre om det ble opprettet på en datamaskin i det hele tatt!

Du kan finne kildefilene for dette prosjektet i katalogen merket kilde som kom inn i filene du lastet ned. Du kan ønske å se gjennom dem kort før vi begynner.


Introduksjon

Før vi går dykking i farge, la oss ta en titt på hvordan jeg setter sammen denne retro-stilillustrasjonen. Jeg har tatt med alle snarveiene jeg tok og peker på å se etter når du velger og plasserer fargen din.

Illustrasjonen er en humoristisk ta på datamaskinen auksjoner. Fokus ligger på lampen like til høyre for senteret. Jeg har en gruppe av databedere til venstre og auksjonarius på høyre side. Folk som kommer ut av datamaskinene ser ut til å være de mest kompliserte elementene, vi vil jobbe med dem først. Jeg liker å gjøre de harde tingene først, da jobben alltid virker lettere når det er gjort!

Jeg har utarbeidet en skisse for å følge, det er veldig løs og er bare en veiledning for stillinger, etc. Etter at jeg har skannet det inn i datamaskinen, plasserer jeg det på et lag som heter "TRACE" og låser laget slik at jeg ikke ' Ikke gå ved et uhell nå ting senere.



Trinn 1: Old Skool Reference

Jeg så opp noen referanser til min gamle skolecomputer og tenkte at denne fra 1970-tallet var en god start. Jeg liker det vinklede innebygde tastaturet og det å, så liten, avrundet skjerm! Denne illustrasjonen vil være en nysgjerrig blanding av 50-tallet, 70-tallet og dagens kultur!



Trinn 2: Linjetips

Tegn datamaskinens form ut med svart og hvitt til å begynne med. Jeg trodde at luftluftene på bildet så kult, så jeg ville bruke linjene for litt dekorasjon på siden av meg.

Den raskeste måten å kjøre ryddige linjer opp på siden av et panel [1], er å kopiere den øverste linjen og den nederste linjen (bare), og bruke BLEND TOOL (B) fra verktøylinjen og for mellomrom bruke Spesifikke trinn 6. Lag en rekke linjer som er parallelle med hverandre. Utvid valgmenyen Meny> Objekt> Utvid. Neste kopier og lim inn foran en kopi av hele sidepanelområdet og flytt linjene dine under, slik at du kan bruke de to elementene til å lage en maske.

Jeg brukte samme prosess for å lage knappene [2]. Ved å bruke spesifiserte trinn mellom to objekter, holder det virkelig avstanden ren og jevn. En siste bit dekorasjon på toppen av datamaskinen er en buet linje [3]. Den raskeste måten å gjøre det er å tegne en oval med et slag og bruke en kopi av datamaskinens toppform gjør en ny maske til å miste de uønskede delene.



Trinn 3: Dum ned farge

Du vet at vi skal kopiere og lime inn disse datamaskinene i stedet for å tegne dem alle igjen riktig! Vi vil først slippe litt farge på datamaskinen, så vi trenger ikke å tilbakekalle dem fem ganger nedover sporet. Siden bakgrunnen er myk og wishy-washy, la oss gi datamaskinene sterke, flade farger slik at de kontrastert godt mot hverandre.

Jeg brukte varm grå, turkis med cyan linjer, jeg vet! høres forferdelig ut når du beskriver det til noen, men visuelt ser det ut, det er noen ganger verdt å merke seg fargekombinasjoner som fungerer, du vet aldri når du skal trenge dem!

Jeg falt i noen merkelige midtonfarger på knappene da jeg ønsket å spille dem ned og få dem til å forstyrre folket. Jeg prøver ofte og trener hva jeg vil at folk skal se på i en illustrasjon, og prøv å tone ned alt som kan være en visuell distraksjon.

Merk: Den svarte på siden er den samme grå som toppen, men med den svarte skyveknappen presset helt til 100% på CMYK Color Palette holder den dyp og rik.



Trinn 4: Alle de unge dudene

Jeg begynner med budgiveren på baksiden, hodet er bare en oval med en rå form for hår og en grunnleggende trekant for en nese. Han ser ganske blid [4] først, men med et par velutstyrte blandinger bør vi kunne smarte ham opp. Første ting er å gi ham litt dybde ved å legge til litt skygge.

Jeg finner en liten skygge bak øret og en under nesen bringer virkelig et ansikt ut. Også å legge til en mørkere hud og gjøre den til en gradient vil også få huden til liv. Graden er veldig subtil og blir bare litt mørkere til den ene enden når den brukes. I dette tilfellet blir det litt mørkere opp til pannen, litt mørkere på toppen av øret hans og det samme på nesebroen.

Klærne er grønne bare fordi jeg trodde at blå eller grå ville gå seg vill mot datamaskinen. Legg merke til hvordan jeg la til en ganske mørk gradient i bunnen av hans dress? Det er å gi inntrykk at han virkelig står inne i dataskjermen og hans nedre halvdel går inn i skyggen.

For å hjelpe fyren inn i TVen, ta en kopi av skjermen og utvide topp R / H-hjørnet for å dekke hvor hodet og armen kan gå [5]. Bruk denne formen igjen som en maske og beskjær kroppen. Se hvordan dupliserende former, lim inn foran og maske, er en fin måte å kutte ned på arbeidstiden din. Du kan dele formene og trimme dem, etc, men hvis de ikke skriver ut, hvorfor bry deg! Så legg den maskerte mannen over dataskjermen, og han skal se ut som han virkelig står der inne!



Trinn 5: Variasjoner på et tema

Nå har vi en mann og en datamaskin alle farget opp. La oss kopiere ham tre ganger og gjøre små endringer i de nye versjonene. Det tar bare et par tweaks for å gi en ny følelse av en eksisterende tegning. Den fyren som er midt på ryggen, [6] lar oss dreie armen litt fremover og også skyve øyebollen videre til ... kanskje endre den leppefargen til hvit, og strekk nedre buen ned for å få et smil. Plutselig har vi en budgiver som er spent og desperat å gjøre et bud.

På samme måte, med de andre gutta, små endringer men merkbar! Jeg gjorde dem større for å hjelpe med perspektivet og forandret munnen til å være en smirk og et halvt smil.

Det er bare et lite punkt, men jeg gjorde knappene flerfarget på datamaskinene og blandet opp mønstrene på hver enkelt. Jeg vet ikke hvorfor jeg gjorde det akkurat? Men jeg kan fortelle deg at det følte seg riktig på det tidspunktet.


Samme avtale med kvinnen. Tegn en versjon, duplikat, og gjør noen små endringer. I dette tilfellet var det hårfarge og ansiktsform. For å få sin høyre arm [7] å være helt utenfor skjermen. Jeg limte den foran alt for å sette den på toppen av stabelen (sørg for at armen ikke spredde seg inn i krageområdet og blokkerte deler ut)

Dollarsignalet BTW er bare tekst skalert horisontalt 80% med skalaverktøyet (S), og skjevt litt vertikalt med skjærverktøyet (W), og roteres deretter noen få grader. Ofte med disse barna av ting kan du justere dem manuelt til det ser ut til å sitte visuelt med det du prøver å oppnå, trenger ikke å være rakettvitenskap.


Trinn 6: Lysende Quirky Shading

Lampen er hovedfokuset i illustrasjonen, men jeg vil beholde det mager og ikke overarbeidet som med datamaskinene. Som jeg prøver å formidle ideen om noe litt avrundet, kan litt lys og skygge komme til nytte!


Jeg fant de mer uregelmessige former og quirky skyggevinklene, jo mer interessant ble illustrasjonen.

Hovedpunktet på auksjonslampen var en blanding laget av Blend Tool (B) mellom en rosa og rød oval. Enkelte lite lysskygge [8] var også en vignette mellom rød og mørk brun ved hjelp av Gradient Tool (G). Jeg ønsket også å kaste en skygge på lampens hals [9] og fant den raskeste måten å gjøre det var slik:

  • Tegn grovt en oval form bak vasen.
  • Velg vaskehalsen og kopien, mens den fremdeles er valgt Slå Lim inn foran (som holder den på toppen av seg selv, men IKKE på toppen av den gule lampeskyggen).
  • Deretter Skift Velg den ovale formen - så du har dem begge uthevet.
  • Nå velger du Intersect fra Pathfinder-paletten

Dette vil etterlate deg med din skyggeform, en liten gradient fra rød til brun vil gi den en fin skygge fra venstre til høyre.

Hvis du ikke har din stifterpalett (og det er ingen grunn til at du ikke skulle! Det er et praktisk verktøy). Det finnes under Meny> Vindu> Pathfinder (Shift + Command + F9).

For å gi lampen en følelse av å være en elektrisk gjenstand, ga jeg den en plugg [10] og gjorde flexen a 2pt slag med en bindestrek av 2 og a mellomrom av 2 i lysebrun. Jeg limte en kopi av flexen bak seg selv i en mørk brun for å gi en fin kontrast.


Trinn 7: Lag en mengde

Ved å bruke en annen kopi av en av mennene vi tegnet tidligere, vri han vertikalt med Reflect Tool (O), og hold ham bak et podium. Podiet bruker de samme fargene som datamaskinen uten linjene på siden. For å gjøre den nye Auksjonæren en littler forskjellig fra den vanlige jøden gjør budet, ga jeg ham noen fine runde briller og en bue (stilig fyr!). Den samme skyggeteknikken, lav på jakken, fungerer på podiet, akkurat som det gjorde på innsiden av TV-skjermen.


Nei, vi har alle våre folk og elementer, det er på tide å begynne å massere dem sammen! For å unngå valg av uhell, er det best å kopiere / lime foran og gruppe OBJEC / GROUP (G) hver auksjonsbudgiver, slik at vi kan flytte folk og datamaskiner rundt sammen bare ved å bruke SELECTION TOOL (V)


Trinn 8: Ikke gå på nøtter!

Nå som du har gjort alt det harde arbeidet med å skape litt forskjellige menn og to kvinner, kan det være fristende å kopiere dem alle for å lage en orc hæren som i "Ringenes Herre", og virkelig lage et show av alt ditt arbeid. Men for å være ærlig, alt som gjør det er fortynn det du har gjort, ikke forstørr det. Hvorfor bruke seks hundre mennesker til å formidle en idé når seks vil gjøre. I hvert fall med seks kan folk få se noen av de finere detaljene du har satt inn.



Trinn 9: Spred handlingen rundt

Når folk ordner seg, er det ingen harde og raske regler. De tingene jeg vanligvis ser etter er:

  • Spreading interessen rundt - i dette tilfellet er kvinnene interspersed med mennene som gir en naiv blandet gruppe føler.
  • Å sørge for at elementer av interesse ikke er skjult - så hodene blokkerer ikke andre hodene bak dem, og auksjonen flaggermusene er tydelig synlige mellom mennesker og datamaskiner.


Trinn 10: Bakgrunn

Hvis vi slipper en flat blå bakgrunn bak illustrasjonen, ser det litt kjedelig ut, selv om vi legger til en stjerneskud bak lampen.


Hva ville være fint å gi det som cyberspace føler ville være å få datamaskinene flytende i midten av luften og kanskje noen mystiske vitenskapelige stjerner spredt rundt og litt myk skygge. La oss starte med den bakgrunnen. I stedet for å innføre en ny farge, kan det være fint å introdusere en mykere nyanse av en farge som allerede er i illustrasjonen.

Jeg tror en mykere nyanse av det varme grået på toppen av datamaskinene vil se bra ut. Og for å bringe fokuset til midten, la vi legge til en gradient fra datamaskinens topp grå til vår nye bakgrunnsfarge. Formen må bare være grove trekanter som de vil blø av kanten av illustrasjonen.


For å få fram noen av elementene i illustrasjonen, som gavlen og noen budspenner, vil en sirkulær gradient fra bakgrunnsfargen til en offwhite forhåpentligvis fange seerens øyne! Jeg legger også en bak lampestjernen, bare for å myke den litt. Den sirkulære gradienten av fyren på baksiden går faktisk under stjernespranggradienten. Jeg kan fikse dette ved å tegne kretsene igjen og bruke noen gjennomsiktighetsalternativer, men jeg føler at det bare er et lite punkt jeg skal la det gå ... denne gangen!


Så, nesten der nå! Jeg tror noen solide grunnskygger som er veldig opplagte (i stedet for disse spissete hvite haloene) og vil la folk få vite at disse menneskene virkelig flyter der ute, og noen spiky stjerner laget av 2 pt linjer vil virkelig legge til blandingen. Prøv å gjøre stjernene litt avbalanse, ikke for symmetrisk, og bruk noen av fargene som allerede er i illustrasjonen.



Konklusjon

Lett, eh! Hold det magert, vær så snill. Har noen velvalgte farger og gjenbruk dem når som helst, og bruk funksjonen Kopier og lim inn foran så ofte som mulig. Jubel.