Hva er klokka? Det er Lag ikoner i Adobe Illustrator Time!

Hva du skal skape

Matematisk! Lag tre fantastiske ikondesigner med eventyretidskarakterene Jake, Finn og Princess Bubblegum. Vi bruker enkle figurer for å bringe hver karakter til liv, klar for bruk av skrivebord eller mobilapp. Enkle berøringer som lange gradienter og konturer gjør virkelig disse ikonene pop! Åpne opp Adobe Illustrator CC og la oss komme i gang.

1. Klargjør dokumentet

Trinn 1

Lage en Nytt dokument uansett størrelse du er komfortabel med å jobbe med; Jeg lager vanligvis et ikonsett i et dokument av 800 px torget. Bruke Rektangelverktøy (M) å tegne et stort rektangel som overlapper hele Artboard. Fyll ditt rektangel med a Radial Gradientgradient panelet går fra middelsgrå til mørkegrå.

Steg 2

Juster radiell gradientens radius med Gradient Tool (G) så radiusen er mer elliptisk enn en perfekt rund sirkel.

2. Jake the Dog: Basic Shapes

Trinn 1

Tegn en sennep gul firkant med Rektangelverktøy. Trekk på Levende hjørner innover for å runde ut rektangelet. Hvis du ikke bruker Adobe Illustrator CC, du kan bruke Avrundet rektangelverktøy i stedet.

Steg 2

Deretter tegner vi Jake øyne. Bruker Ellipseverktøyet (L), Tegn en svart eller mørkegrå sirkel. Tegn en mindre hvit sirkel i den svarte, sørg for å plassere den nærmere øverst til høyre enn midtpunktet. Gjenta med høyre øye.

Trinn 3

La oss jobbe på Jakes nese.

  1. Begynn med tre avrundede rektangler. Overlappe hver side av det horisontale avrundede rektangelet med de to vertikale. Pass på at de vertikale segene roteres utover litt.
  2. Forene alle tre former i Pathfinder panel. Bruker Pennverktøyet (P) eller Blyantverktøy (N), tegne en form som overlapper øvre venstre for å glatte det (se nedenfor). Hjørnet er for alvorlig som det er. Velg begge figurer og klikk Minus FrontPathfinder panel.
  3. Gjenta med nedre venstre side av designet: Tegn en form som glatter ut nederst til venstre og treffer Minus FrontPathfinder panel.
  4. Du kan enten gjenta de forrige trinnene på venstre side, eller gjengi venstre halvdel til høyre.
  5. Overlappe høyre halvdel av designet med et stort rektangel. Truffet Minus Front igjen i Pathfinder panel. 
  6. Kopier (Control-C) og Lim inn (Control-V) den resterende venstre side. Reflektere det kopierte objektet over a Vertikal akse og linje opp høyre side med venstre. Forene de to figurene i Pathfinder panel.

Trinn 4

Plasser snuten mellom øynene, overlapp dem litt. Tegn en ellipse for nesen og sett oversikten av nesepartiet til 2-4 pt i Stroke panel.

Trinn 5

La oss jobbe på munnen og tennene.

  1. Bruke Pennverktøy å tegne en rødbrun, smilende munn og legg den under nesen i lag panel.
  2. Jeg trakk en halv sirkel for tungen og satt fyllfarge til rosa. Hver tann er et avrundet rektangel. 
  3. Kopiere og Lim inn tre tannformer over toppen av munnen. Velg tenn og munnobjekter. Med Form Builder Tool (Shift-M), velg delene av tennene som ikke krysser med munnformen. Jeg liker å bare dra verktøyet mitt på alle disse figurene, slik at de smelter sammen fra resten av tennene.
  4. Slett de ikke-skjærende delene av tennene og legg til konturer til tennene, munnen og tungen på 1-3 pt.

3. Jake the Dog: Legge til gradienter

Trinn 1

Tegn et par lange rektangulære former med Pennverktøy fra nesen til nederste høyre hjørne. Bruk en Lineær gradient til figurene som går fra gul okker på 100% til 0% Opacity i gradient panel.

Steg 2

Velg basisrektangel og bruk a Lineær gradient går fra gul til sennep gul, med mørkere av de to farger i nedre høyre hjørne.

Trinn 3

Velg og Gruppe (Control-G) ditt ikonskomponenter sammen. Kopiere og Lim inn Baserektangelet over ikondesignet. Velg begge og Lag en Clipping Mask (Control-7) så dine lange gradienter strekker seg ikke lenger enn ikondesignen mer.

Trinn 4

Sett et mørkt gult rektangel bak ikonet og flytt det litt ned for å gi ikonet litt ekstra dimensjon. Gruppe klipping maske gruppen og nytt rektangel sammen. Velg gruppen og bruk en Drop Shadow ved å gå til Effekt> Stylize> Drop Shadow. Legg til følgende attributter:

  • Modus: Multiplisere
  • opacity: 25%
  • X Offset: 4 px
  • Y Offset: 6 px
  • Uklarhet: 1 px
  • Farge: Svart

4. Finn mennesket

Trinn 1

Kopiere og Lim inn Baserektangelet fra Jake-ikonet. Still gradientfyllingen til hvit til lysegrå. Legg til dråpeskyggen i grunnformen som vi gjorde med det forrige ikonet.

Steg 2

For Finns ansikt tegner du en ferskenfargede ellipse midt på ikonet. Sett fyllfarge til lett fersken til middels fersken i gradient panel. Sett slagfargen til samme svart eller mørkegrå som vi brukte i Jake-ikonet med en vekt på 2-3 pt.

Trinn 3

To små sirkler danner Finns øyne. Jeg la til en Lineær gradient i hver går fra mørkegrå til svart. For munnen tegnet jeg en buet form med Blyantverktøy. Tenk deg at dette er en gelébønne eller nyreform. Du kan også tegne den med Pennverktøy hvis du finner det mer behagelig. 

Trinn 4

Som Jakes tenner er Finns også små avrundede rektangler. Han har et hull i tennene hans, så man er til venstre og to overlapper hverandre til høyre. Som med Jakes munn, bruk Form Builder Tool å slette de ikke-kryssende tannkomponentene fra munnformen.

Trinn 5

For omrissene, Kopiere og Lim inn hver av tennene. Sett kopiene til svart med svarte konturer og Rette inn dem bak de hvite tennene former. Deretter tegner du en halv sirkel eller et halvt hjerte for den rosa tungen.

Trinn 6

Som med Jake-ikonet, tegne en rektangulær gradientform som går fra ansiktet til nederste høyre hjørne av ikonet. Plasser den bak ansiktskomponentene i lag panel. Bruk en Clipping Mask å klippe gradientformen til rektangelet.

For Finns skjorte, tegne et blått rektangel over den nederste delen av Finns ikon. Bruke Form Builder Tool for å slette ikonets ikke-kryssende komponent. Bruk en Lineær gradient av lyseblå til middels blå til formen.

Trinn 7

La oss legge til et par siste detaljer i dette ikonet. Tegn et mørkblått avrundet rektangel bak resten av ikonet for å legge til dimensjon til selve ikonet. Bruke Ellipseverktøy å tegne en lys fersken ellipse på toppen av ansiktet. Pass på at graden går fra lett fersken på 100% til 0% Opacity.

Trinn 8

Kontroller at hvert ikon er gruppert sammen med egne komponenter. Pass også på at strekkene i hvert ikon har samme bredde versus variasjonen du ser nedenfor. La oss gå videre til vårt siste ikon, Princess Bubblegum!

5. Prinsesse Bubblegum

Trinn 1

Tegn en rundet rosa firkant. Overlappe torget med en lyserød sirkel på nederste halvdel av ikonet. 

Steg 2

Overlappe toppen av ansiktet med et rektangel og trykk Minus FrontPathfinder panel for å lage sin stumpe frynse. 

Trinn 3

For PBs kronen tegner du et langt, tynt, gult rektangel over toppen av hodet. Tegn et lite vertikalt rektangel i midten av spissen oppover. Deretter tegner du en gul sirkel for å slå den helt av.

PBs øyne er to små svarte sirkler, og hun har en liten blå sirkel midt på toppen av kronen. Endelig er nakken hennes et tynt rosa rektangel under ansiktsformen som slutter i nederkanten av ikonet.

Trinn 4

Forene ansikt og nakke former sammen i Pathfinder panel. Legg til en oversikt over ansiktet og den gule kronen på 2-4 pt.

Trinn 5

Bruker Pennverktøy, tegne en halv sirkel eller en myk kurve for munnen. Sett fyllfarge til null og streken til 2-3 pt vekt med Avrundede CapsStroke panel.

Trinn 6

Til slutt, la oss legge til noen enkle gradienter og gradientformer.

  1. Kronen har en gul til gul okker Lineær gradient.
  2. Ansiktet er rosa til middelsrosa.
  3. Det er to gradientformer: en under kronen og en under ansiktet. Begge er mørkrosa på 100% til 0% Opacity. 

Som med de andre ikonene før denne, bruk a Clipping Mask å klippe ikonkomponenter og legge til en Drop Shadow til den siste ikondesignen.

Oh, min Glob, du er ferdig!

Samle ikonene dine sammen i en fin liten rad fordi du er klar til å gå. Legg til flere tegn i ditt sett som Marceline, B-MO, og min favoritt, klumpete romprinsesse. Det er så mange fantastiske tegn som henger ut i Candy Kingdom, klar til å bli omgjort til ikoner for skrivebordet eller mobilpanelet. Del dine kreasjoner i kommentarseksjonen nedenfor!