Share
I denne opplæringen skal du lære å kombinere ulike metoder fra Illustrator og Photoshop for å forbedre 3D vektorkunst. Gjennom prosessen lærer du hvordan du bruker utseendet panelet, 3D ekstrudere og 3D revolve. Du vil også lage en tilpasset kunstbørste, og ditt eget symbol. Jeg skal vise deg hvordan du lager masker ved hjelp av kanaler og lag, så vel som å lage klippemasker i Photoshop.
Arbeide i et faglig miljø kan være tøft noen ganger. Klienter vil ofte se ulike skisser av deres produkt, men den endelige avgjørelsen er bare gjort når du imponerer dem med et bilde som er meget polert. Denne typen arbeid gir deg en givende følelse når klienten er enig med konseptet ditt.
Jeg skal vise deg noen teknikker for hvordan du kan forbedre vektoren 3D-kunst. Vi bruker eksemplet på en liknende pizza-leveringsrobot som er inspirert av Mobot, roboten fra iPad-spillet Monkey Labour, som ble utgitt i slutten av desember 2010.
Bare fordi dette er en digital opplæring, bør du ikke forvente at vi skal begynne med Illustrator umiddelbart. En god designers praksis bør alltid begynne med skisseboken din. Skiss noen ideer og legg dem på et papir. Du trenger ikke å definere alt på en gang. Design er en kontinuerlig prosess. Dette er et grovt konsept av kunstens retning med noen grunnleggende om følelsen og dynamikken i bildet.
Opprett et nytt dokument (jeg lagde min 600px bred med 600px høy). Legg skissen på tavla. Dobbeltklikk på "Lag 1" for å få alternativene popup, og navnet "Sketch" for eksempel. Det er bedre å nevne lag som du vil, slik at du alltid kan finne de du trenger. Slå på Lås, Dimbilder og sett den til 50%.
Alt-klikk på Create New Layer-ikonet nederst til høyre for å få lagegenskapene popup for det nylig opprettede laget, og navnet det "Robot".
Velg Ellipseverktøyet (L) og tegne en sirkel. Hold Shift- og Alt-tastene for å begrense proporsjonene. Slå på Smart Guides, som du finner under Vis> Smart Guides eller bare klikk på Command + U. På denne måten får du mer kontroll over å tegne ting som må justeres. Opprett et rektangel med rektangulærverktøyet (M), som på bildet nedenfor, og kontroller at høyre side av rektangelet er rettet inn mot sirkelens senter.
Bruk markeringsverktøyet (V) til å velge både rektangel og sirkel. Nå vil vi trekke rektangelet fra sirkelen, så åpne Pathfinder Panel og klikk Minus Front. Vi er igjen med en fin halvsirkel.
Opprett en annen sirkel for haken, og to rektangler. Hvis du glemte å slå på Smart Guides, er det nå på tide å gjøre det. Det vil hjelpe deg med å få ønsket posisjon, som i bildet nedenfor.
Med alle de valgte bildene, åpner du Pathfinder Panel og klikker på Unite for å lage en Compound Shape. Dette er vår grunnleggende form for å lage en robots hode. For å få ting ordentlig, er det godt å sette Stroke til null og Fyll til hvitt, slik at du har mer kontroll over lys når du lager en 3D-gjenstand.
Nå, la moroa begynne. Du er i ferd med å lage et 3D-robothodet. Med den valgte formen gå til Effect> 3D> Revolve. Slå på Forhåndsvisning, og klikk på Flere alternativer. Bruk følgende alternativer: 35, -65 og -38. La Perspektivet være på 0 og Revolve-alternativer som de er. Juster lysintensiteten til 40% og omgivelseslys til 53%. Klikk på OK, og vi har et hode.
Noen ganger når du roterer figurer, og du prøver å finne riktig vinkel (spesielt når du bruker et annet perspektiv enn 0, ser du 3D-formen annerledes enn du hadde planlagt. Til tross for at du opprettet en 3D-form, er det fortsatt vektor, og du kan redigere det som du vil. Med Direct Selection Tool (A) kan du velge individuelle eller flere Anchor Points samtidig, og flytte dem for å få en mer behagelig form.
Med valgverktøyet (V) kan du Alt-dra hovedformen for å lage en kopi av den. Eller du kan bare klikke på prikken på "Head" -laget, og klikk på Command + C + F for å kopiere og lime foran, som er det samme. Gi nytt navn til det nye laget til "Body".
En annen kul ting om 3D er at du alltid kan justere innstillingene senere ved å åpne Utseendepanelet. Du kan endre fargen på Fill, Opacity, legge til et slag, eller åpne 3D-alternativene igjen, og endre alternativene.
For nå skal vi omforme kroppen. Velg igjen "Body" -formen med valgverktøyet (V), og slå av synligheten av 3D-revolveringseffekten i Utseendepanelet. Opprett ønsket form ved å flytte Anchor Points, og med å trekke et lite rektangel fra grunnformen som vi lærte før. Når du er fornøyd med formen, kan du slå på synligheten til 3D Revolve-effekten igjen.
Nå, la oss gå videre til noen mer komplekse former, hendene. Som du kan se på bildet nedenfor er det ikke noe nytt. Vi kan gjøre basen av hånden ut av en sirkel som er halvert (navnet lag "Base") og fingrene fra "Head" -formen. For det bruker vi Anchor Point tweaking-metoden, som i trinn 9.
Når du har mange 3D-former, som i dette tilfellet, er det viktig å vite lagens rekkefølge. Dette er slik at fingrene gir deg følelsen av at de er satt i 3D-plass. Du kan rotere separate figurer med den interaktive kuben i vinduet 3D Revolve Options.
Hånden er ferdig. Nå trenger vi et håndledd. Derfor skal vi lære en annen 3D-metode. Opprett en ny sirkel med Ellipse Tool (L), og gå til Effect> 3D> Extrude & Command. Siden vi allerede er kjent med stillingsdelen, skal vi bruke følgende innstillinger 77, -26, 50, med et perspektiv på 0. Men vi har også en ny seksjon der du kan velge mellom forskjellige typer Bevels.
Vi skal bruke "Complex 3" Bevel for vår håndledd. Sett Extrude Depth til 10 pt, Høyde til 4 pt, og klikk OK. Velg alle håndformene, og dupliser dem ved å trykke på Command + C + F. Bestil alle lagene, og navn dem som du ønsker. Ikke glem å kopiere "Håndleddet", og sett "Wrist" -laget bak "Base" -laget.
Når vi snakker om basen, kommer vi tilbake til det grunnleggende med dette trinnet. Vi må koble hendene med kroppen. Designere må være ressursfull, så du må være oppmerksom på ting som omgir deg. Selvfølgelig kan du fortsette å søke på nettet for bilder du trenger, men det er mye mer moro hvis du kan lage alt selv (som jeg gjorde). Bare ta tak i kameraet ditt og ta bilder av en badeslange i forskjellige stillinger, men husk hvordan du skal bruke dem til arm og benposisjoner.
Åpne en av dine nye bilder i Photoshop. La oss starte med den som vi skal bruke til forarmen. Vi skal skille slangen fra bakgrunnen. En måte å gjøre dette på er via paletten Kanaler. Kanal-fanen skal være som standard ved siden av Lag-fanen, men hvis den ikke er, kan du finne den under Vindu> Kanaler.
For hvert RGB-bilde finner du tre kanaler her, en for hver farge. Den røde kanalen, den grønne kanalen, den blå kanalen og RGB-kanalen som bare er en sammensetning av alle tre. Ved å trykke på en av kombinasjonene (Command + 3, Command + 4, Command + 5) skrevet på hver kanal, kan du isolere en valgt kanal, og alle de andre blir usynlige. Prøv alle tre, og finn den som har mest kontrast mellom slangen og bakgrunnen.
I dette tilfellet skal vi bruke Blue Channel. Dra den blå kanalen for å opprette et nytt kanalikon. Nå har du opprettet en ny kanal som vi vil bruke som en alfakanal. Dobbeltklikk navnet på den blå kopikanalen, og endre navnet på "Alpha".
Pass på at du er på Alpha-kanalen. Ta opp Dodge Tool (O), og i menylinjen, velg Soft Round 100 pixel pensel og sett hardheten til 27%. I menylinjens rullegardin kan du angi rekkevidde til både Dodge Tool (O) og Burn Tool (O) til Highlight, Midtones eller Shadows.
Brennverktøyet (O) mørker området, og Dodge Tool (O) lyser det opp, derfor bør du bruke "Shadows" for Brennverktøyet (O) hvis du ikke vil mørke lysområdene. Du kan også justere intensiteten med eksponeringsinnstillingen. Når du bruker Dodge Tool (O), start med Midtones Range-innstillingen og senk eksponeringene rundt 10-20%, selv om det avhenger av bildet. Deretter kan du fortsette med høydepunktinnstillingen og 15% eksponering.
Sett brennverktøyet (O) til skygger og eksponering til 25%, og start deretter å brenne de mørke områdene. Du kan raskt få tilgang til penselinnstillingen med høyreklikk. Pass på at du foretar justeringer i henhold til bildet ditt. Du må bytte mellom Burn and Dodge-verktøyene flere ganger, samt justere børstestørrelsen og eksponeringsinnstillingene. Men vær ikke redd. Ved slutten av det siste bildet får du tak i det.
Når du ser ut til å være på slutten, kan du hjelpe deg med Lasso Tool (L). Velg de resterende områdene og fyll dem med en hvit farge ved å trykke på Command + Backspace for å fylle området med bakgrunnsfarge. Hvis du har angitt en annen farge i stedet for hvitt og svart, trykker du på D for å tilbakestille fargene. Bruk penselverktøyet (B) til å fargere de gjenværende områdene som ikke kan brennes til svart.
Med Magic Wand Tool (W) velger du det svarte området, og klikker på RGB-kanalen for å velge alle kanalene bortsett fra Alpha-kanalen. Gå til lagpaletten, høyreklikk bildet og velg Lag via Kopi eller trykk på Kommando + J for å lage et utklippslag med bare slangen på den.
Slå av "Bakgrunn" -laget og lagre bildet som en gjennomsiktig PNG-24.
Gjenta trinnene i Photoshop for alle de andre bildene for å få en annen arm og to ben.
En gang tilbake i Illustrator kan du plassere armer og ben på riktig sted, og skala dem ned i henhold til valgverktøyet (V). Bruk det grove Sketch-bildet som referanse for å plassere armene og bena, men du trenger ikke å holde fast ved det. Design er alltid en prosess i å gjøre, og de fleste av resultatene er enda bedre hvis du eksperimenterer litt.
Men hvordan skal vi holde armene og bena i kroppen hans? Vi kan bruke "Head" for skulder- og hofteleddene. Med valgverktøyet (V) Alt-dra "Head" for å duplisere det. Lag tre kopier av det. Skal dem ned og juster perspektivet ved hjelp av 3D Revolve i Utseendepanelet, som vi gjorde før. Bruk følgende stillingsinnstillinger for skulderen: 141, 3 og 38. For hofteleddet foran: -52, 60 og -56, og for hofteleddet på baksiden: 15, -21 og -159.
For å lage en hofte som forbinder hofteleddene, opprett en sirkel med Ellipse Tool (L), og et rektangel med Rectangle Tool (M). Slå sammen dem med Unite Tool i Pathfinder Panel. Gå til Effects> 3D> Extrude & Command, og fyll inn følgende innstillinger for posisjon: 20, -54, -32. Sett perspektiv til 142, Ekstruder dybde til 40 pt, og bruk følgende innstillinger for overflate: 56, 34, 60, 90, 25.
For å gjøre roboten komplett, trenger den et par føtter. Med Ellipse Tool (L) opprett en Ellipse og gå til Effects> 3D> Extrude & Bevel. Still posisjon til: 129, -37, -44, perspektiv til 160, ekstruder dybde til 20 pt, høyde til 4 pt og for kommandoen velg "kompleks 3." Trykk OK, dupliser formen og gi nytt navn til både "Høyre" og "Venstre fot". For venstre fot gjelder følgende innstillinger: Posisjon 151, -52, -71; Perspektiv 160; Extrude Depth 20 pt, Høyde 4 pt, og igjen velge "Complex 3" for Command.
La oss nå lære noe nytt for en forandring. Som du kan se armer og føtter passer ikke akkurat inn i leddene. Vi skal korrigere dette ved hjelp av Clipping Masks. La oss starte med robotens venstre fot. Hvis vi bruker perspektivet riktig, virker hans venstre ben litt lengre. Så la oss legge sin venstre fot der vi synes det burde være.
Plukk pennverktøyet (P) og tegne en form som omgir den delen av benet vi ønsker å være synlig. Velg både formen og benet (form må være foran beinet!), Høyreklikk musen og velg Lag klipping maske. Voila, vi kutter benet av. Gjør det samme med alt som trenger å bli kuttet av.
Hvis du kutter av alle ekstremiteter og legger alle lagene i riktig rekkefølge, slik at figurene ikke overlapper hverandre, bør du ha noe som ser ut som bildet nedenfor nå.
Velg alt og trykk på Kommando + C for å kopiere roboten til utklippstavlen. Gå tilbake til Photoshop og trykk på Command + N for å opprette et nytt dokument. Standardstørrelsen på bildet vil være i samme størrelse som roboten, men du kan gjøre det større fordi vi trenger litt mer plass til å manipulere bildet. Gjør det 1600 med 1200 piksler med en 180 oppløsning og kaller det Mobot.
Trykk på Kommando + V for å lime inn innholdet. Velg Lim inn som: Smart Object, klikk OK, og deretter Return for å bekrefte det. Gi nytt navn til Vector Smart Object-laget til "Mobot." Gå til Arkiv> Plasser, og velg en fil for tekstur, klikk på Plasser og trykk Enter. Du kan også slette "Bakgrunn" -laget fordi vi ikke trenger det.
Pass på at "tekstur" laget ligger over "Mobot" -laget. Høyreklikk på det og velg Opprett klipping maske. Du får noe lignende som vist nedenfor.
Etter at du har opprettet en Clipping Mask, kan du nå bevege teksturlaget (med Move Tool) fritt, og fortsett å holde oversikten over roboten. I lagpaletten angir blandemodus til lineært lys og opasiteten til 97%.
Tekstur er ujevn, og vi vil få riktige resultater, vi kan ikke bruke en tekstur for alle deler av roboten. Det er derfor vi skal lære en annen metode for maskering. Pass på at du har valgt "Texture" -laget. Klikk på Mask verktøyet. Ditt "Texture" -lag vil få mask miniatyrbildet. Som standard er masken Miniatyrbilde låst til Layer-miniatyrbildet, og i form av denne opplæringen vil vi la den være igjen, men husk at du kan låse opp miniatyrer og flytte laget, og det er Mask separat hvis du vil.
Å vite at laget og dets maske er separate enheter, kan du velge en av dem til å korrigere det. Nå må vi maskere laget slik at vi klikker på mask miniatyrbildet (hvis det ikke allerede er valgt). Plukk opp børsteverktøyet (B), og lakk bena og armene med en svart farge. Ved å gjøre det setter du en alfakanal som forteller deg de delene som er synlige og de som ikke er. Hvis du sammenligner ditt maleri med Mask Thumbnail, kan du se delene som er malt svart ikke er synlige.
Når du er ganske ferdig, kan du legge til et justeringslag over det. Klikk på den lille svarte og hvite sirkelen nederst og velg Hue / Saturation. Justeringspaletten skal åpnes som standard. Hvis det ikke er det, kan du finne det under Vindu> Justeringer. Still inn metningen til -75 og opprett en klipmaske i fargetone / fargemetningsjustering.
For å duplisere "Texture" -laget klikker du bare på det og trykker på Command + J, eller høyreklikker det og velger Dupliser Layer. Navngi det "Texture Color", og still inn blandingstilstanden til fargeforbrenning og opaciteten til 14%. Lag en annen kopi av laget, og merk det "Texture Vivid." Still blandingsmodusen til denne til levende lys, og juster Opacity til 60%.
For å få resultatene riktig, drar du Hue / Saturation Adjustment laget mellom "Texture" og "Texture Color" lagene. På denne måten vil justeringslaget kun påvirke "struktur" -laget.
Bruk nå kunnskapen samlet fra trinn 33 til 39 for å lage teksturlagene for beina og armene. Karakteren på dette punktet skal være lik den nedenfor. Lagre filen som en PSD. Gå til Bilde> Trim, velg Transparent piksler, og klikk OK. Lagre bildet som en gjennomsiktig PNG-24, og legg den i Illustrator-filen.
En gang tilbake i Illustrator vil du sannsynligvis merke at det importerte bildet er litt større enn vektorroboten. Det skyldes at vi jobbet i 180 ppi Oppløsning i Photoshop, mens standardoppløsning i Illustrator er 72. Så hvis du regner, får du den 72 ved 40% av 180. Høyreklikk på det importerte bildet, og velg Transform> Skala. Sett 40% til enhetlig skala, og klikk OK.
Velg det transformerte bildet, legg det over vektorroboten, og legg det inn i et eget lag. Gi navnet "Mobot", og mens du fortsatt velger, gå til Effect> Stylize> Outer Glow. Påfør en normal blanding modus med svart farge, 30% opasitet og 10px uskarphet.
Opprett et nytt lag, kaller det "Face", og skjul alle de andre lagene. Plukk opp pennverktøyet (P), og gjør en form som bildet nedenfor. Gå til Effekter> 3D> Revolve, og bruk følgende innstillinger: Plassering -61, 17, 14. Legg resten og sørg for at du har valgt Venstre kant for Offset. Navngi formen "Munn" og lag en kopi av den (Command + C + F).
Mens du fortsatt har det valgt, gå til Objekt> Utvid Utseende? Med valgverktøyet (V) dobbeltklikker du på "Mouth" -objektet to ganger for å komme inn i isolasjonsmodus. Hold kommandotasten og velg alle lagene du ikke trenger. Slett dem ved å klikke på det lille thrash-ikonet.
Bruk igjen markeringsverktøyet (V), hold nede Skift-tasten, og velg grupper som i bildet nedenfor. Åpne Pathfinder Panel, og klikk Unite for å bli med i en form. Velg denne nye formen, og legg til en fin grå til hvit gradient ved hjelp av Gradient Tool (G).
Gi alle de andre formene gradienter som vist på bildene nedenfor. Når du er ferdig, dobbeltklikk et tomt sted på Artboard for å gå tilbake fra isolasjonsmodus.
Skjul "Mouth" -laget du har jobbet med, og velg original Mouth-objekt (før du lagde en kopi av det), og gå til Objekt> Utvid utseende. Klikk nå på Unite Tool fra Pathfinder Panel. Du får en ganske enkel form med mange Anchor Points. For å kvitte seg med dem, gå til Objekt> Sti> Forenkle, sett kurvepresisjonen til 100, Angle Threshold til 0, og klikk OK.
La oss legge til en fin farge # FBB03B til denne formen, og litt skygge. For å sette en skygge, gå til Effekter> Stylize> Drop Shadow, og bruk følgende innstillinger: Modus for Multiply, 100% Opacity, X Offset ved -2px, Y Offset ved 2px og 1px Blur.
Når du er ferdig, omdøpe dette laget til "Mouth Color", og legg det foran "Mouth" -laget (du kan gjøre det synlig igjen). Åpne gjennomsiktighetspaletten, og sett blandingsmodus til fargebrann og opasitet til 72%.
La oss skape øyet, med samme metode som før. Med pennverktøyet (P) gjør du en form som i bildet nedenfor, og opprett en 3D-revolver med følgende innstillinger: -73, -28, -6 for posisjon. La alt annet ligge som det er.
Igjen, gå til Objekt> Utvid Utseende, og dupliser laget. Velg formen på det nederste "Eye" -laget, bruk igjen Unite Tool på Pathfinder Panel, og forenkle banen som i trinn 47. Gi den en fin brun # 42210B slag på 1px og Drop Shadow med følgende innstillinger: Multiply , 60%, -2px, 2px, 1px, svart farge. Gi nytt navn til banen til "Eye Shadow."
Velg gruppen på "Eye" -laget, og bruk samme metode som i trinnene 44 og 45 for å få noe i bildene under.
Med Direct Selection Tool (A) velger du ellipsen i midten, og går til Effect> Stylize> Inner Glow. Påfør Normal Blending Mode med svart farge, 60% Opacity og 4px Blur.
For å legge til øyets iris, opprett en form som vist nedenfor. Gi den følgende 3D Revolve-alternativer: -73, -28, -6.
Nå unhide alle lagene, og sett "Mouth" og "Eye" på riktig sted. Dupliser "Head" -laget, og legg det på forsiden av et "Mobot" -lag. Som du kan se hodet ser over venstre arm så la oss lage en form med Pen Tool (P) som på bildet, og lage en Clipping Mask.
Med Ellipse Tool (L) opprett en svart ellipse, og gå til Effects> Blur> Gaussian Blur. Gi den en 3,0px radius, og trykk OK. For å skjule den delen som ser over armen, lage en Clipping Path som i forrige trinn. Voila, Mobot er ferdig!
La oss nå lage en Pizza-logo for boksene. Lag et nytt lag "Pizza Symbol", og tegne en ellipse med Ellipse Tool (L). Plukk direkte valgverktøyet (A), og dra det høyre ankeret lenger til høyre for å få noe som ligner på bildet. Dra formen til penselpaletten. Velg New Art Brush, og klikk OK. I Art Brush Options gjelder navnet "Pizza", la alt annet ligge, og trykk OK. Du har laget din egen pensel!
Plukk Paintbrush Tool (B), og velg din "Pizza" børste i menylinjen. Tegn bokstavene for å stave "Pizza". Velg dem alle, og trykk på Kommando + G for å gruppere dem. Utvid utseendet til gruppen for å forhindre omforming av streken ved skalering. Bli med formene med Unite-knappen på Pathfinder-panelet.
Tegn et rektangel på 100px bred ved 100px høyt, og gi det fargen # C69C6D. Gå til Effect> Stylize> Inner Glow, og gi den følgende innstillinger: Normal, 10 og 15px.
Putt din pizza Tegn over rektangelet, og gi det et fint hvitt slag. Legg til noen rektangler og ord for å gjøre det mer interessant. For taket og skrifter har jeg brukt en rød (# C1272D) farge.
Tegn et rektangel i samme størrelse som den du har brukt i trinn 59, og gi den lysegrå farge (# F2F2F2). Skal det opp til 200%. Gå til Effect> Texture> Texturizer. I dialogvinduet endrer du tekstur til lerret, skalering til 120, og lettelse til 30. Trykk OK.
Gå til Objekt> Utvid Utseende for å utvide teksten. Klikk på en trekant ved siden av Live Trace-knappen i menylinjen, og velg Tracing Options. Bruk følgende innstillinger: Terskel 180, Sløring: 0,2px, Fyll, Veibeskrivelse: 0,8px, Minimumsareal: 5px, Hoekvinkel: 20, og Ignorer Hvit. Hit Trace etter at du er ferdig med å legge inn verdiene. I menylinjen finner du Utvid-knappen, og klikker på den.
Skal rektangelet tilbake til forrige størrelse. Denne gangen må du bruke 50% i transformasjonsdialogboksen. Gi den fargen # 957552. Åpne gjennomsiktighetspanelet, sett blandingsmodusen til Multiply, og opaciteten til 7%. Velg alt, og dra det til symbolpaletten. Gi symbolet "Pizza front", velg grafikk, og klikk OK. Bruk samme metode for å lage symbolene "Pizza tilbake" og "Pizza side".
Tegn en rektangel 100px ved 100px ved hjelp av rektangulært verktøy (M), og opprett en 3D Extrude (Effects> 3D> Extrude og Command) med følgende innstillinger: Plassering: 33, 38, -94, Perspektiv: 135, Ekstruder Dybde: 12 pkt. Klikk på Kart kunst, og velg symbolet "Pizza foran", som du opprettet før i Symbol-rullegardinmenyen. Klikk på den lille trekant for å gå gjennom de andre sidene av boksen. For den tredje og fjerde siden av boksen velg symbolet "Pizza side". Klikk OK for å bekrefte kartartet, og igjen for 3D Extrude-innstillingene.
Tegn noen flere rektangler i samme størrelse for å lage nye Pizza-bokser ved hjelp av 3D Extrude and Command, som på bildet nedenfor.
Hvis du vil ha flere detaljer, kan du utvide hver boks (finn den under Objekt> Utvid utseende), slett nålerlagene og eksperimentere med forskjellige gradienter. For meg har jeg brukt fargene # C69C6D og # A67C52. Lag noen skygger, og legg til en bakgrunn av din smak. Og vi er ferdige.
Jeg håper du har hatt denne opplæringen og lært noen nye teknikker. Ha det gøy til neste gang.
Accentsconagua