Share
I denne opplæringen vil jeg vise deg hvordan du tegner et retro typografi design fra bunnen av, og deretter legger du til dimensjon, toner og gradienter og så bringer alt til liv! Jeg skal jobbe fra en skisse og gjøre det i Adobe Illustrator. Jeg skal deretter avslutte det i Adobe Photoshop. La oss komme i gang!
Før du begynner, er det alltid en god ide å lage en grov blyantskisse av ideen din. Selv om du ikke redraverer det nøyaktig i Adobe Illustrator, kan det tjene som referanse senere.
Lage en Nytt dokument ved å gå til Fil> Nytt (Kontroll + N). Bruk følgende dokumentstørrelse: Bredde satt til 280mm, Høyde satt til 340mm.
Velg Linjesegmentverktøy (\), og mens du holder nede Skifte Tegn en horisontal linje over dokumentets bredde, et sted i den øverste fjerde delen av siden.
Sett Fyll farge (X) til ingen og Stroke Weight til 1pt.
Bruker Rotate Tool (R) roter den av 10 °, så dupliser den nedover med Utvalgsverktøy (V) mens du holder nede Alt + Skift. trykk Kontroll + D å duplisere linjen igjen til like stor avstand. La oss nevne vårt nåværende lag 'Guides' og lås den. Lag et nytt lag og navnet på det 'Skrivefeil'.
Vi vil nå lage vår skrivefeil kun ved hjelp av geometriske former: linjer, sirkler og rektangler med avrundede hjørner. Hvert enkelt brev er opprettet ved hjelp av disse figurene, så det er ikke noe stort triks her, vi må i utgangspunktet kutte opp sirkler av forskjellige størrelser og plassere buene nøyaktig.
La oss lage brev 'o' av 'av' først. Bruker Rektangelverktøy (M) tegne et rektangel som er omtrentlig 18mm bred og 56mm høy.
Sett Fyll farge (X) til ingen, Stroke Weight til 22pt, Lokk til Butt Cap, og Hjørne til Round Join. Gå til Effekt> Stylize> Round Corners og skriv inn 9pt.
La oss lage den første 'f' av 'av' nå. Å holde samme slagvekt tegner en vertikal linje ved hjelp av Linjesegmentverktøy (\) mens du holder nede Skifte. Det bør være nær 'o' og skal nå over grunnlinjen (guide).
Bruker Ellipseverktøyet (L) lag en sirkel med en diameter på 35mm. Bruker Saksverktøy (C) klipp sirkelen klokken 9 og ca. 12.30, så du er igjen med en lysbue som vil være den øvre kurven på 'f'.
Forsikre Smart Guides er slått på (Vis> Smart Guides, Det bør kontrolleres, eller bare trykk Kontroll + U), og bruker nå Utvalgsverktøy (V) Du kan enkelt plassere buen på toppen av linjen, som smarte guider vil vise deg nøyaktig hvor de krysser. Velg de to endepunktene og Bli med dem (Kontroll + J).
La oss fullføre "av" nå. Vi bruker de samme verktøyene som tidligere.
Å holde samme slagvekt tegner en annen vertikal linje ved hjelp av Linjesegmentverktøy (\) mens du holder nede Skifte. Det burde være nær den første "f" og skulle komme ned over baseline igjen. Lag en ny lysbue akkurat som før for den øvre buen i den andre 'f'. Bli med buen og den vertikale linjen.
Lag to nye buer og et linjesegment som roteres av 10 ° (akkurat som våre guider) for å lage tverrstangen. En gang til, Bli med Endpoints, så du er igjen med en bane.
Sted banen der den tilhører, men ikke delta i de tidligere opprettede banene.
Klikk to ganger på Skalverktøy (S), og kontroller boksen foran Skala Strokes & Effects er ukontrollert. Klikk på OK. Dette vil forhindre skalering av slagvekten når skaleringsbaner i fremtiden.
De to andre ordene gjøres nøyaktig på samme måte, ved hjelp av de samme verktøyene og bygger opp bokstavene i de samme grunnleggende former. Legg merke til at noen bokstaver (f.eks. E, c etc.) slutter med en runde hette. Hvis du slår av Synlighet av 'Guides' laget, bør bildene dine se slik ut.
Det er viktig å sørge for at stiene krysser over og koble to eller flere bokstaver (f.eks. Stien som forbinder 'o' og 'f' i 'av', og banen som forbinder 't' og 'h' i 'de') er skille og ikke bli med noe.
Selvfølgelig, hvis du foretrekker det, kan du endre bokstavene dine for å oppnå et unikt resultat.
Når bokstavene er trukket og plassert på plass, Å velge alt på 'Skrivefeil' lag (Kontroll + A) og klikk på Objekt> Sti> Oversikt over strekk fra menyen.
Nå må vi ta vare på endene av de vertikale linjene. Låse opp de 'Guides' lag. Å velge alle tre guider og Duplisere dem (Skalverktøy> Kopier). Vi skal bruke Del verktøyet fra Pathfinder panel, men vi kan bare velge to baner om gangen, ellers vil de overlappende områdene også deles opp, og vi vil ikke ha det. Så Å velge Den første "f" og en av de øverste guiderne (husk, det er to guider nå ovenpå hverandre), og klikk på Dele opp.
Del opp gruppe resultatet, og ganske enkelt Slett formen på bunnen.
Den vertikale linjen til den andre 'f' og delen av 'e' i den andre linjen som kommer opp må slås sammen, så Å velge dem og klikk Forene fra Pathfinder panel.
Vår andre guide på toppen krysser denne formen to ganger, noe som ikke er bra, så bruk Saksverktøy til Kutte opp guiden som vist.
Slett den delen som er til høyre. Nå kan du Å velge f-e-formen og hva som er igjen av toppguiden, og klikk på Dele opp, Del opp gruppe objektene, da Slett formen på bunnen. Bokstavene på første linjen slutter nå med en skråning, som er det vi ønsket.
Bruk fremgangsmåten ovenfor til å skape en skrå slutt og begynn hvor det er nødvendig.
Pass også på at følgende figurer ligner det som er uthevet i rødt under: Den første 'R' i 'Record' må være en form, men swash er en egen bane. Den andre "R" skal være en bane, og "h" i "the" skal være som vist, med linjen som forbinder 't' og 'h' som en egen bane.
Du kan slette 'Guides' lag nå, siden det er tomt uansett, og vi vil ikke trenge det lenger.
Å velge alt (Kontroll + A) og endre Fyll farge til 20% svart.
Fra menyen velg Effekt> 3D> Extrude & Command, og bruk følgende verdier.
Ikke frykt! Det ser forferdelig ut på dette stadiet.
Men vi kan fikse de fleste problemene ved arrangering objektene. Bruk Objekt> Ordne> Send til Tilbake å omorganisere elementene.
Etter å ha omorganisert objektene, ser kunstverket litt bedre ut, men legger merke til hvordan noen av elementene har blitt feilposisjonert. Bare plasser disse (uthevet av de røde kretsene) manuelt, og juster om nødvendig noen biter og stykker for å oppnå det riktige utseendet.
Noen av de overlappende elementene er fortsatt problematiske, men vi vil fikse dem i dette neste trinn.
Å velge alle objekter, og gå til Objekt> Utvid Utseende. Del opp gruppe objektene, og løse disse problemene manuelt. For eksempel for 'o' må du slette den mørkere gråformen som vises og justere noen av ankerpunktene for å gjøre den perfekt.
Gjør det samme for det andre 'f', 't' og det andre 'R'. Når du er ferdig, bør bildene dine se slik ut.
Lag nytt lag, navngi det 'Bg' for bakgrunn, og Flytt det er det første laget fra bunnen. Lage en 100% svart rektangel med Rektangelverktøy (M) som er størrelsen på dokumentet. Dette vil tillate oss å se hvordan lys og skygger av typografien virker mot en mørk bakgrunn. Låse laget.
Nå som bokstavene våre er tredimensjonale, er de alle laget av en front, en side og en toppdel, som må skygges i henhold til dette. Vi må bestemme hvor hovedlyset kommer fra, i mitt tilfelle bokstavene lyser fra høyre midtpunkt, så forsiden av bokstavene vil være den letteste.
Generelt hva vi trenger å være oppmerksom på er hvordan bokstavene støtter skygger på hverandre på grunn av vår imaginære lyskilde. Områder som dekkes av overleggende deler, må for eksempel være mye mørkere. Å finne den riktige balansen mellom skygger og lys er nøkkelen.
Alle forsider består av en bane med flere fyllinger for å lage metallisk glans, og 3 ekstra baner inne i en kappemaske for å skape kantene. La oss se hvordan de er opprettet.
Å velge alt, og Del opp gruppe objektene. Vi starter med den andre 'f' av 'off' og 'e' av 'the'. Bli med de fremre sidene av disse bokstavene. (Jeg har skjult noen av de andre bokstavene, men du trenger ikke.)
Med den fremre siden valgt, legg til en Ny fylling i Utseende panel.
Denne nye fyllingen vil være a gradient som vist nedenfor, med fem stopp: den første på 0% med 22% svart, den andre på 8% med 0% svart, den tredje på 69% med 0% svart, den fjerde på 78% med 100% svart, og den siste på 89% med 0% svart. Det skal ha en rotasjon av 105 °.
I åpenhet panelet angir Blandingsmodus av gradienten til Multiplisere. Den mørkeste stoppen på graden blir skyggen bak overlegget. De Utseende panelet vil se slik ut nå:
Den andre fyllingen som vi nettopp har brukt, varierer fra bokstav til bokstav, avhengig av posisjon og skygger av andre bokstaver. Det tar litt tålmodighet å finne alle de riktige gradienter, men samtidig er det spennende å se hvordan kunstverket utvikler seg fra å være flatt til å bli tredimensjonalt.
Jeg har nevnt tre stier inne i en kappemaske, la oss gjøre disse nå.
Holde nede alt og bruke Utvalgsverktøy (V) lage en Kopiere av "f-e" -banen. Denne nye (offset) banen skal være nær den opprinnelige banen, da dette vil være kanten av brevet.
Bruker Skalverktøy (S) lage en Kopiere av den opprinnelige banen. Å velge kopien og forskyvingsbanen og klikk på Minus Front i Pathfinder panel.
Legg til en sekund Fylle i Utseende panel til denne banen, som skal være a gradient som vist, rotert til 105 °. Denne gradienten har tre skyveknapper, på på 9% med 84% svart, den andre på 69% med 10% svart, og sist på 100% med 99% svart. Endre Blandingsmodus av gradienten til Multiplisere i åpenhet panel.
Gå nå til Effekt> Uklarhet> Gaussisk uskarphet, og skriv inn 2 piksler. I Utseende panelvalg 'Gruppe' (fordi veien din fortsatt skal være en gruppe), og endre dens Blandingsmodus til Skjerm.
Den andre banen vil være skyggen av denne kanten. Ganske enkelt Kopiere kanten vi nettopp har opprettet og satt Blandingsmodus av 'Gruppe'i Utseende panel til Multiplisere i stedet for Skjerm. Endre Gaussian Blur ved å klikke på den eksisterende Gaussian Blur i Utseende panel, fra 2 til 6.
Den tredje banen er kanten fra den andre siden. Gjør de samme trinnene som for den første kanten, det vil si: Kopier og flytt den "f-e" banen, Trekke fra det fra kopien av den opprinnelige "f-e" -banen, Legg til en ny gradient med en Multiplikasjonsblanding og legg til Gaussian Blur. Ikke glem å sette 'Konsernets' Blandingsmodus til Skjerm. Den eneste forskjellen fra den første kanten er at gradienten skal være som vist nedenfor, og uskarphet bør være 3 piksler i stedet for 2. Du kan endre begge disse til enhver tid ved å enten klikke to ganger på 'Innhold'i Utseende panel for gradienten, eller klikk en gang til Gaussian Blur.
Vi har alle tre ekstra banene nå, det eneste problemet er at kantene deres ikke er skarpe.
For å fikse det problemet, la oss Kopiere igjen "f-e" -banen, og ta den til forsiden ved å klikke Objekt> Arranger> Ta med til fronten fra menyen. Sett Fyll farge til ingen, og mens denne banen fortsatt er valgt, Å velge de tre nye banene også.
Gå til Objekt> Clipping Mask> Make (Kontroll + 7), og til slutt er kantene våre skarpe!
Du kan gjøre forsiden av alle bokstaver nå basert på den nettopp beskrevne metoden.
Neste vil vi legge til skygger og toner til sidene og toppen av bokstavene. De fleste av våre brev er buede på toppen, og siden og toppen er ikke helt skilt, så dette vil tillate oss å håndtere dem sammen.
Vi skal gjøre nesten samme trinn som før, men toner, gradienter og uskarphet vil være forskjellige.
Å velge siden av 'e', og legg til en Ny fylling (som før). Det er ikke noe problem at dette ikke er en sti, men en gruppe stier. Denne gangen gradient bør være som følger, og 'Konsernets' Blandingsmodus bør være Multiplisere i stedet for Skjerm.
Opprett den første banen som før, med forskjellen om at motsetningen skal være større. Etter subtraksjon banen, Bevege seg den resterende banen til høyre slik at den delvis dekker forsiden av brevet. Denne banen er fylt med 60% svart, det er Blandingsmodus er på Multiplisere og har a Gaussian Blur med 15 piksler.
Den andre banen vil bli opprettet med en mindre forskyvning, og vil også bli flyttet litt til høyre. Denne banen er fylt med 20% svart, det er Blandingsmodus er på Multiplisere og har a Gaussian Blur med 3 piksler.
Den tredje banen er opprettet på samme måte som den tredje banen ble opprettet på forsiden. Det er fylt med samme gradient som siden av 'e', men den opacity er på 50% denne gangen. De Blandingsmodus av hele gruppen er på Skjerm, og har a Gaussian Blur med 3 piksler.
Like som før, vil vi duplisere banen som er siden av bokstaven "e", bringe den til forsiden, og velg Klar utseende fra Utseende panel. Hold valget av denne banen, pluss velg de tre ekstra banene vi nettopp har laget, og Opprett en ny Clipping Mask (Control + 7) å bli kvitt de uskarpe kanter.
Med ovennevnte metoder bør du kunne lage alle toner og skygger av bokstavene. Det tar litt å eksperimentere og tid for å få gradienter, farger og uskarphet rett, men når du er ferdig, bør bildene dine se ut som dette.
Legg merke til hvordan tverrstangen og 'o' ikke kobler seg pent til 'av'. Jeg brydde seg ikke med det, da vi vil legge noen blinkende lys over hele kunstverket som vil dekke opp disse typer feil.
Lag nytt lag oppkalt 'Sparkles'. Det burde være den øverste.
Med Pennverktøyet (P) opprett de to endepunktene til en bane, på samme måte som dette (endepunktene vises i de røde kretsene). De Fyll farge skal være hvit for nå.
Velg banen (begge endepunktene) og bruk Reflekteringsverktøy (O) lage en Kopiere av denne banen (refleksjon bør være rundt den vertikale aksen, som vist). Bevege seg den reflekterte banen til de øverste endepunkter møtes, enn velg disse to endepunktene og Bli med dem.
Gjør nå en annen kopi ved hjelp av Reflekteringsverktøy, men denne gangen rundt den horisontale akse. På denne måten vil banen vår være nøyaktig symmetrisk. Bli med de to banene.
I stedet for den hvite fylle legger du til en gradient med følgende verdier. Forandringen i ugjennomtrengelighet vil utgjøre en fin fading til bakgrunnen.
Med banen valgt klikker du på Effekt> Distort & Transform> Transform fra menyen. Sett det som vist (90 ° rotasjon, 1 kopi).
Bruke Roter verktøyet å lage en Kopiere på 22,5 °.
Å velge Forvandle fra menyen igjen, og klikk på Påfør ny effekt når du blir bedt om det. Sett det som vist (22,5 ° rotasjon, 2 kopier).
Rescale dette andre settet med stråler til 55% ved hjelp av Skalverktøy. Gruppe alle strålene.
(Du kan oppnå det samme resultatet ved å bruke Roter verktøyet bare, og gruppér objektene på slutten.)
Sett opacity til 20% og legg til en Gaussian Blur med 4 piksler.
Opprett en ny sirkel med størrelsen på ca. 15 x 15 mm, med gradient vist. Sett opacity til 80%.
Ta strålene frem og plasser dem på toppen av sirkelen, slik at deres sentre møtes. Rotere strålene tilfeldigvis så hele gnisten ser litt mer naturlig ut.
Kopiere og Lim inn gnisten til deler av kunstverket der du vil legge til høydepunkter. Du kan også justere gradienter, opacity og rotasjon så gnisten smelter godt inn.
Vi vil skape refleksjonene neste.
Bruker Pennverktøyet (P) tegne et objekt som ligner dette. Legg til gradient som vist.
Dupliser forsiden av 'o', 'f' og 'f-e', Klar deres opptredener og Forene dem. trykk Kontroll + 8, eller alternativt gå til Objekt> Forbindelsesvei> Lag.
Bringe denne banen Framover, Å velge den nyopprettede gradienten og Lag en utklippsbane. Arrangere det går så til riktig sted: over forsiden av bokstavene, men under kantene.
Hvis du gjentar disse trinnene for 'the' og 'record', bør du også kunne lage refleksjoner for dem.
Hvis du tror refleksjonene er for sterke, kan du redusere opaciteten til stiene, jeg har satt opacity av mine refleksjoner til 90%.
Lag et nytt lag nedenfor 'Skrivefeil', og nev det 'Tekstur'. Du kan slå av synligheten til 'Skrivefeil' og 'Sparkles' mens vi jobber med bakgrunnen.
Med Rektangelverktøy (M) opprett et rektangel i øverste venstre hjørne med følgende verdier: Bredde: 8 mm, Høyde: 7 mm. Legg til en gradient som vist.
Med rektangelet valgt, gå til Objekt> Sti> Legg til ankerpoeng, så med Slett ankerpunktsverktøy (-) Slett de 5 poengene som er angitt, slik at du er igjen med en jevn trekant.
Med trekanten valgt klikker du på Effekt> Distort & Transform> Transform fra menyen. Sett det som vist (horisontal bevegelse: 8 mm, 33 kopier).
Med trekanten valgt klikker du to ganger på Roter verktøyet, og skriv inn 180 °. Klikk på Kopiere. Du kan flytte den nye trekanten manuelt til høyre, slik at de nye trekanter passer riktig på plass. (Du kan også flytte dem numerisk, med 4 mm.)
I gradient panel endrer rotasjonen av gradienten til 125 °.
Velg alle trekanter og Kopiere dem nedover hver 7 mm til du fyller siden.
Vi kunne sette sammen alt i Illustrator, men jeg har funnet ut at gradienter er mye bedre i Photoshop, pluss vi kan justere farger lettere, slik at vi skal fullføre de siste trinnene der.
Lage en Ny dokument som er like stor som vårt Illustrator-dokument.
Sett Forgrunnsfarge til en ganske mørk farge som C = 73 M = 67 Y = 67 K = 85, og Fyll bakgrunnen (Alt + Backspace) med det. Lag en rektangulær telt med Rektangulært markeringsverktøy (M) som vist.
Nå Angi forgrunnsfarge til en enda mørkere farge, for eksempel C = 80 M = 75 Y = 75 K = 90.
På menyen, gå til Velg> Endre> Feather (Shift + F6), og sett fjærradiusen til 250 piksler. Nå Velg Inverse (Kontroll + Alt + I), Lag et nytt lag, navngi det 'Edges', og Fylle dette valget med mørkere farger for å gjøre kantene på tavlen mørkere.
I Illustrator Kopiere bakgrunnstekstur, og Lim inn det inn i Photoshop-dokumentet. Jeg foretrekker vanligvis å legge inn som Smarte objekter for å holde laget redigerbart, men du kan også lime inn som piksler hvis du vil. Sett opacity av laget til 16%, og Gi nytt navn laget 'Tekstur'.
Vi vil nå lage en fading. Ganske enkelt Ctrl-klikk på laget som heter 'Edges' for å laste inn sitt valg (eller velg Last inn valg fra menyen, Kanal bør lese 'Transparenter i kantene', i operasjon 'Nytt utvalg' bør kontrolleres).
Med dette valget aktive, gå til menyen og velg Lag> Lagermask> Skjul utvalg.
For å gjøre tekstur litt mørkere, Duplisere laget, Endre lagordre slik at dette duplikatet er under det opprinnelige laget (men over 'Edges' lag), Slett de Maske, sett Blandingsmodus til Multiplisere og opacity til 58%. Det skal se slik ut nå.
I Illustrator Kopiere skrivefeltet, og Lim inn det inn i Photoshop-dokumentet. Gi nytt navn laget 'Skrivefeil'. Legg til en Drop Shadow.
Den problematiske delen av 'o' var ikke helt dekket av gnisten, og det er også en liten ufullkommenhet ved den første 'R'en i Record, så jeg laget to Nye lag, oppkalt de 'fikse' og 'fikse R', og brukte Klonstempel å fikse disse små problemene.
Det eneste som gjenstår er å endre fargene på typen. Kontroller + klikk på laget av 'Skrivefeil'for å laste inn valget, og opprett en Nytt justeringslag av Fargetone metning.
Laste utvalg av nytteprat, og denne gangen Legg til et lysstyrke / kontrastjusteringslag med verdier som vist.
Gjenta dette trinnet igjen av Laster inn valget av 'Skrivefeil' og Legge til et lysstyrke / kontrastjusteringslag, men denne gangen med disse verdiene: Lysstyrke: -48, Kontrast: 100. Still inn opacity av laget til 71%.
Ja, det er litt lang og det tar tålm
Accentsconagua