Ikon készítése Photoshopban

Szerző: Mérei Tamás   |   2010-05-07

Ikonok rajzolása vektoros alakzatokból.

A forrás PSD fájl innen tölthető le.

1. lépés

Hozzunk létre egy új dokumentumot 600×600-as méretben.

2. lépés

Válasszuk ki az Ellipse Tool-t.

Állítsuk be fixen 500x500 képpontos méretet, a módnál válasszuk Shape Layers-t!

Rajzoljuk meg a kört és nevezzük el a réteget outside-nak.

3. lépés

Alkalmazzuk az alábbi stílusokat rajta. Először Inner Glow.

Gradient Overlay

A Gradient beállításait az alábbi kép mutatja.

Stroke.

Az eredmény.

4. lépés

Rajzoljunk egy újabb kört, a mérete fixen 440x440 képpont.

Helyezzük középre és nevezzük el inside-nak.

5. lépés

Alkalmazzuk a következő stílusokat az inside rétegen. Először Inner Glow.

Bevel and Emboss

Gradient Overlay

Stroke

Az eredmény.

6. lépés

Válasszuk ki a Pen Tool-t.

A mód legyen Shape Layers.

Rajzoljunk a képen láthatóhoz hasonló alakzatot. Nem baj, ha nem követi a kör körvonalát, az a lényeg, hogy fedje a belső kört. Nevezzük el a réteget reflection-nek.

7. lépés

Ctrl billentyűt lenyomva tartva kattintsunk az inside réteg maszkjára, hogy kijelöljük.

Aktiváljuk a reflection réteget, és kattintsunk az Add Layer Mask gombra.

Ezzel kimaszkoltuk a szükségtelen részeket. Vegyük le a reflection réteg Opacity értékét 30%-ra.

8. lépés

Válasszuk a Custom Shape Tool-t.

Válasszunk egy tetszőleges ábrát.

A mód továbbra is Shape Layer.

Rajzoljuk meg az alakzatot fehérben.

Alkalmazzunk rajta Inner Shadow stílust.

Elkészültünk.

Variáljuk a színeket, feliratokat:

8 hozzászólás

  1. 2014. május 14. szerda - 18:23

    Honnan lehet ilyen plusz alakzatokat letölteni? Nekem ilyen kis vackok vannak csak. Ilyenek amik neked nem. :=/ Válaszodat előre is köszi. 🙂 Tök jók lettek.

    • 2014. május 28. szerda - 19:20

      Guglizz arra, hogy “photoshop custom shapes”.

  2. 2013. március 10. vasárnap - 09:04

    Szia. Ezek szabadon felhasználhatók honlaphoz is?

    • 2013. március 20. szerda - 12:35

      Persze, arra használod amire csak akarod.

  3. 2013. január 18. péntek - 12:41

    Szia, remek munka szép ikonok. Érdeklődni szeretnék hogy weblapra ikont olyat mint pl. az aprod.hu-n találhatóak (a kategóriák megnevezése fölött) azt milyen technológiával csinálják? Fényképből rajzolják át vagy a semmiből kezdik rajzolni?

    • 2013. január 19. szombat - 22:15

      Ezek az ikonok szerintem fotókból és vektoros illusztrációkból vannak megcsinálva.

  4. 2012. december 28. péntek - 09:07

    Na ez kifejezetten tetszett, köszi

  5. 2012. június 6. szerda - 18:41

    Király

Hozzászólás

Keresés a blogon
Kategóriák
Legújabb hozzászólások
  • A villanyszerelés örömei panelben

    Ha három fázisod van, akkor három fázisú Fi relét kell venni....

  • A villanyszerelés örömei panelben

    Szia, ha panellakásba három vezetéken jön be az egy fázis, akkor három fi relét kellene berakni?...

  • A villanyszerelés örömei panelben

    "3 vezeték jön be, fázis-nulla-föld, tehát már az óránál szétválasztották a PEN vezetéket PE-re és N-re vagy más módon, de külön vezetéken jön az N és...

  • Dia szkennelés házilag

    Ezt a fajtát nem tudom, hogy lehet még kapni. Normál diavetítőt lehet kapni nagyobb játékboltokban például....

  • Bootstrap carousel

    Ennél a réginél nem tudom, hogy volt e már ilyen opció, de az újnál már van olyan, hogy touch="true"...

  • Adobe XD VS. Lunacy

    Sketch-et nem használok, mert nincs mac-em. Axure-t használok, arról találsz anyagot az oldalon....

  • Adobe XD VS. Lunacy

    Kedves Cyrex! A Sketch és az Axure UX-UI designer programok? Te melyiket használod ha használsz ilyen programokat? Köszönöm, üdv Balázs...

  • Bootstrap carousel

    Kedves Tamás! Az megoldható, hogy mobilon ne a nyilakra koppintva, hanem ujjal húzva váltsam a képeket? Köszönöm a sok hasznos videót. Üdvözlettel:...

  • Dia szkennelés házilag

    Ilyen diavetítőt hol lehet beszerezni?...

  • A villanyszerelés örömei panelben

    Ha nincsen a házban központilag rendbe rakva, akkor veszett fejsze nyele... Kialakíthatsz otthon EPH sínt, de ez már egy másik szint. 7kW felett 10m...

  • A villanyszerelés örömei panelben

    Ez a kábelcsatornás szegőléc nagyon jól néz ki. Szinte biztos, hogy a fürdő / konyha földelése lesz. Máshova nem vittek régen földet. Ha te húzod be a...

  • A villanyszerelés örömei panelben

    Köszönöm a gyors választ, akkor megpróbálom multiméterrel megkeresni, remélem csak a fürdő és a konyha földelését vitték innnen, nem a szomszéd lakásé...