Tedd ezt a cikket a kedvenceid közé!

Egyik olvasóm, Píít kérését próbálom teljesíteni ezzel a leírással, remélem tetszeni fog, és egyre többen adnak ötleteket mit is szeretnének látni az oldalon. A következő leírásba csak az a kitartóak kezdjenek bele!

Készítsünk egy 500x500-as képet. A háttérnek adjunk vörös alapszínt, majd belső árnyékot (inner shadow) ami lesötétíti a sarkokat. A méretet (size) maximumra (250), a fojtást (choke) 50-re állítsuk.








Egy új gömb nevű réteg közepére rajzoljunk egy gömböt, és adjuk neki a következő effekteket:

Belső árnyék (inner shadow):

átlátszóság 30% (opacity)
távolság 0 (distance)
fojtás 15 (choke)
méret 73 (size)

Külső ragyogás (outer glow):

keverési mód: átfedés (overlay)
átlátszóság 65%
méret: 46
szín: piros (ff0000)

Belső ragyogás (inner glow):

átlátszóság 57%
méret: 35
szín: piros (ff0000)

Színátmenet átfedés (gradient overlay):

ff4e00-ból ffa443-ba haladó színnel.
















Készítsünk egy új réteget felhő néven a gömb réteg fölé. Állítsuk a háttérszínt feketére, az előtérét pedig világos szürkére, majd alkalmazzuk a szűrő/renderelés/felhők parancsot (filter/render/clouds). Állítsuk a réteg keverési módját átfedésre (overlay), az átlátszóságát (opacity) pedig 30%-ra.
Jöjjön mégegy réteg felhő2 néven, ezúttal a szűrő/rajzolt szűrők/króm (filter/stylize/chrome) parancsot használjuk alapértéken, a réteg átlátszóság 12% legyen, a keverési mód pedig újra átfedés. Ezzel füstbe burkoltuk a gömböt.

Készítsünk új réteget fénycsík néven, és tegyük a gömb és a felhő rétegek közé. A toll eszközzel (pen tool) rajzoljunk egy görbét a gömb elé. Bármilyen forma lehet, de lehetőleg a gömb formáját kövesse.
Váltsunk az ecsetre (brush tool), és az ablak menüből nyissuk meg az ecsetek párbeszédablakot (window/brush). A méretét 4-re állítsuk, majd pipáljuk ki a alakzat dinamika (shape dinamics) kapcsolót, és állítsuk benne a méret vibrálás vezérlőt (size jitter control) tollnyomásra (pen pressure). Váltsunk a közvetlen kijelölő eszközre (direct selection tool), majd az egér jobb gombos menüjéböl válasszuk a körvonalazást (stroke path). Töröljük is a görbét.

Készítsük mégegy hasonló görbét, ha lehet keresztezze az előzőt, majd ezt is körvonalazzuk. Jöhet a réteg beállítás:

Vetett árnyék (drop shadow):

keverési mód: lineáris fakítás (linear dodge)
szín: piros
méret: 5

Külső ragyogás (outer glow):

keverési mód: fakítás (color dodge)
átlátszóság: 100%
szín: sárga (ffffbe)

Belső ragyogás (inner glow):

keverési mód: normál
átlátszóság: 100%
szín: sárga (ffffbe)

Színátfedés: narancs (ffd800)

















Maradjunk a rétegen, és rajzoljunk rá egy újabb görbét ami csak nagyjából követi a legelső görbénket. Váltsunk ecsetre és nyissuk meg újra az ecsetek ablakot. A méretet állítsuk 1-re, az ecsetdinamikát kapcsoljuk be, és állítsuk újra a méret vibrálás vezérlőt tollnnyomásra. Be kell nyomnunk mégegy kapcsolót, az ecsetszórást (scattering). A szórás (scatter) ereje 1000 legyen, a számlálót (count) 1-re, a számláló vibrálást (count jitter) pedig 1000-re állítsuk.

Váltsunk a közvetlen kijelölőre és körvonalazzuk a görbét. Így egy részecskeáramlás szerű effektet kapunk, a végein elhalványodva. Ismételjük meg ezt a lépést a másik görbével is.


















Legfelülre készítsünk egy réteget fény néven. Válasszuk a színátmenet eszközt (gradient tool) és állítsuk sugaras színátmenetre (radial). A szín világoskékből átlátszóba tartson. Most a bal felső sarokból húzzunk egy színátmenetet a kép jobb alsó harmadáig (kép). Legyen a réteg keverési módja szín (color), átlátszósága pedig 50%. Így kapunk egy kék megvilágítást és a kép hűvösebb lesz, jobban kiemeli a részleteket.





















Utolsó lépésként adjunk a gömbnek egy kis turbulenciát. Ehhez készítsünk egy ilyen nevű réteget, majd tegyük a gömb réteg fölé. Nyomjunk jobb gombot a gömb réteg ikonján, és válasszuk a képpontok kijelölését (select pixels). Váltsunk vissza az új rétegre és a szűrő (filter) menüből válasszuk a renderelés/felhők (render/clouds) parancsot. Ráengedhetjük az ugyanitt lévő negatív felhők (difference clouds) parancsot is párszor, míg egy jó darabos felhőt nem kapunk. Állítsuk a keverési módot fakításra (color dodge), majd készítsünk 2 másolatot a rétegről és utána vonjuk össze mindhármat (kijelöljük őket és merge layers parancs).






















Készen vagyunk. Akinek van kedve hozzá, a maszatolóval (nudge tool, 50-es erősség) húzhat csíkokat a gömb peremétől kiindulva a turbulencia rétegen, így a gömb felszíne egyenetlen lesz.

A PSD innen letölthető.

Tedd ezt a cikket a kedvenceid közé!

Tudom hogy a neon szín néha már már gagyit jelent, de a webkettes oldalak előszeretettel használják őket. Megfelelően használva nagyon jól mutat. Éppen ezért mi is játsszunk egy kicsit velük.

Egy 500x300-as dokumentummal kezdünk. A háttér rétegre tegyünk színátfedést (color overlay) feketéből sötétkék felé haladva.

A toll eszközzel (pen tool) készítsünk tetszőleges feliratot. Úgy húzhatunk íves görbét, hogy először megadunk egy kezdő pontot sima bal klikkel, aztán mikor a következő pontot megadjuk, tartsuk nyomva az egér bal gombját, és az egeret mozgatva beállíthatjuk a görbe formáját. A következő pontokat ugyanígy tegyük le. Ha nagyjából kész a felirat, váltsunk a közvetlen kijelölés eszközre (direct selection tool), és igazítsuk meg a görbe pontjait.
















Készítsünk új réteget szöveg néven, váltsunk rá. Most állítsuk az ecset eszöz méretét 3-ra, válasszunk világoskék, majdnem fehér színt, majd váltsunk vissza a közvetlen kijelölőre, a görbén jobb gombot nyomva körvonalazást (stroke path) válasszunk. Azután töröljük a görbét.

Adjunk a rétegnek a szöveg színéhez hasonló külső ragyogást (outer glow). Kis méretet használjunk, nem kell túlzásba esni.
















Készítsünk másolatot a szöveg rétegről, majd tegyük az eredeti alá. A kép/színkorrekció/szín és telitettség (image/adjustments/hue and saturation) menüben a színezet (hue) csúszkát húzva adjunk lilás színt neki. Tegyük homályossá a szűrő/életlenítés/sugaras életlenítéssel (filter/blur/radial blur), 23-as értékkel. Ez olyan hatást hoz létre mintha picit bemozdulna a kamera.
















Készítsünk 4 új réteget karikák néven. Mind a 4-re rajzoljunk különböző méretű köröket, majd mindnek adjunk különböző színátfedést, a kép tónusához hasonló színekkel. Homályosítsuk különbözőképpen mindet  a szűrő/életlenítés/gauss életlenítés parancsot (filter/blur/gaussian blur) 0.2 és 2 közötti értékeken használva. Játsszunk picit a rétegek áttetszőségével amíg hasonló eredményt kapunk:





























Készítsünk újabb réteget fények néven és tegyük legfelülre. Válasszunk egy nagy puha ecsetet, a szövegünkhöz hasonló színnel. Állítsuk az áttetszőségét 35-re, és szórjunk el pár foltot a neon írás közelében. Ahol az írás vonalai keresztezik egymást vagy kicsúcsosodnak, szintén rajzoljunk egy egy pamacsot. Tegyük a réteg színkeverési módját színfakításra (color dodge).

Legvégül a háttérnek adjunk belső árnyékot (inner shadow) 0 távolsággal (distance) és 120-as mérettel (size). Ezzel kicsit lesötétíjük a sarkokat, azt a hatást keltve mintha a fény elenyészne a szövegtől távolodva.


















A PSD fájl letölthető innen.

Most vegyes felvágott következik néhány érdekes oldalból.

boxstr.com - Elég sokszor van szükségem tárhelyre, ezért jó néhányat kipróbáltam már. Ez az oldal kiemelkedik a többi közül: 5 GB tárhely, max. 250 MB fájméret, napi fél giga sávszélesség, és publikussá tehető mappák.

www.360desktop.com - Bár ez a program még készülőben van (ingyenes lesz), érdemes odafigyelni rá. Webes felületet hoz létre háttérkép helyett, ami hatalmas virtuális asztalként működik. Nézzétek meg a demó videót!

www.papercdcase.com - Egy jó kis alternatív megoldás cd tokra, papír hajtogatás! Csak beírod az adatokat és kapsz egy pdf-et, benne a nyomtatandó papírformával, és segítség a hajtogatáshoz.

www.imaginationcubed.com - Elsőre egyszerű rajzprogramnak tűnhet, eszközeit tekintve az is. Ám van benne egy csavar: az oldalon keresztül meghívhatjuk barátainkat, hogy együtt rajzoljunk! Ilyen a közösségi paint.

www.scrapblog.com - Végére hagytam a legjobbat. Segítségével jó kis prezentációkat készíthetünk, egyszerűen. Mindenképp próbáljátok ki, regisztráció nélkül is működik.

Egy nagyon látványos, ám annál egyszerűbben megvalósítható effekt következik. Bár a PS 2 dimenziós képeket készít, egy kis optikai tuninggal 3 dimenziós hatást is elérhetünk.

Hozzunk létre egy 800x300-as dokumentumot, fehér háttérrel. Készítsünk egy réteget logó névvel. Az alakzat menüből válasszunk egy nekünk tetsző formát, ezt fogjuk 3 dimenzióssá tenni.

Rajzoljuk meg a formát, amit ezután töltsünk ki egy színnel. Töröljük is a rögtön a görbét. A szerkesztés/alakítás menü perspektíva parancsával (edit/transform/perspective) nyomjuk össze a tetejét (az egyik felső sarokpontot befelé húzva), majd a méretezés (scale) paranccsal lapítsunk az egészen. Ezután forgassuk el (rotate) a logót egy kicsit jobbra (a képen balról jobbra láthatóak a lépések).











Adjunk vastagságot a formának! Ehhez nincs más dolgunk mint hogy másolatot készítünk a logóról amit picit lejjebb viszünk. Aztán mégegyet, és ezt még lejjebb visszük. 10 másolatra lesz szükségünk. Elég bonyolult lenne minden réteget egyenként a helyére tenni, de van könnyebb megoldás is!
Nyomjunk a logó rétegre, és válasszuk ki a mozgató eszközt (move tool). Tartsuk nyomva az ALT gombot, és nyomjuk meg a lefelé nyilat 10x a billentyűzeten. Minden egyes nyomással elmozdítottuk lefelé a réteget, és lemásoltuk. Az így létrejött 10 másolatot vonjuk össze úgy, hogy a SHIFT-et nyomva tartva az első és az utolsó rétegere nyomunk, majd a rétegek összevonását (merge layers) választjuk. Nevezzük 3d-nek a réteget, és tegyük a logó réteg alá. Adjunk rá effekteket: színátfedést fehérrel (color overlay), és belső árnyékot (inner shadow). A távolságot (distance) 0-ra, a méretet (size) 25-re, az átlátszóságot (opacity) pedig 65-re állítsuk (képen az első két ábra).










Jöjjön az árnyék. Készítsünk egy árnyék nevű réteget, a logó réteget lemásolva, majd tegyük a 3d réteg alá. Adjunk fekete színátfedést (color overlay) neki, majd a szerkesztés/alakítás menü torzítás parancsával  (edit/transform/distort) mozdítsuk el a tetejét jobbra és lefelé. Ezután a szűrő/életlenítés menü gauss életlenítést (filter/blur/ gaussian blur)  használjuk 6-os erősségen (fenti képen a 3. és 4. ábra).

Készítsünk egy vektor maszk réteget hozzá, váltsunk rá, és a színátmenet eszközzel (gradient tool) (fekete-fehér színnel) húzzunk az árnyék aljától a tetejéig egy átmenetet. Így az árnyék távolabbi vége elhalványodik (kép).

 







Erősítsünk a logó 3d hatásán! A logó rétegnek adjunk tetszőleges színt a színátfedés (color overlay) effektel, és egy fekete-fehér színátmenetet (gradient overlay) is. Ebből nem látszódik semmi mert a színátfedés letakarja, ezért az áttetszőségét tegyük 70-re. Ezzel megmarad a választott szín, de egy kis színátmenettel (kép).


















Készen is van. Én még adtam egy színátmenetet a háttérnek, és szöveget is írtam mellé, de ezt már azt hiszem rátok bízom. A példafájl innen letölthető.

Éppen ezért ma egyetlen linket ajánlok nektek, de szerintem sokáig elidőztök majd rajta.

472 (folyamatosan emelkedik) hasznos oldal webdizájnereknek