Éles szembogár készítése Photoshoppal

Írta: | 2007. október 30. | kategóriák: Photoshop, Speciális effektek | 1 megjegyzés

Készíts egy 100×100 képpontos, fehér hátterű dokumentumot. Válaszd ki a neked megfelelő két színt, amelyet a szem elkészítésére fogsz használni, majd a világosabbat állítsd be az előtér színének, a sötétebbet a háttér színnek (foreground és background színek).
Az első széleffekt utánA Rectangular Marquee Toolt használva, jelöld ki a dokumentumod kb. egynegyedét (a bal oldalát), majd töltsd ki a sötétebb színnel (Edit / Fill). Következő lépésként fordítsd meg a kép színeit, Image / Adjustments / Invert vagy üss Ctrl-I kombinációt. Erre a szélhatás tulajdonsága miatt van szükség, hogy a sötétebb színre fújja a világosabb színt. Most, hogy megvagy a színfordítással, add hozza a széleffektet: Filter / Stylize / Wind. Ezt ismételd meg kb. 3szor, amíg hasonló képet nem kapsz. Az ismétlést a Ctrl+F gomb leütésével is elérheted, mivel az mindig a legutolsó effektet fogja újból elvégezni.

Elolvasom a teljes bejegyzést »

Windows Live stílusú menü

Írta: | 2007. október 18. | kategóriák: Design, Interface, Photoshop, Speciális effektek | 16 megjegyzés

A web 2.0 világában élünk és sok szép, úgynevezett glossy effektes dolog létezik, minden csillog villog. Valamelyest ebben jelentkezik, grafikai szinten a web 2.0. A következő leírásban egy, a Windows Live navigációs menüjéról mintázott, üveges hatású menü elkészítését fogod elsajátítani.

Windows Live stílusú menü
Kezdésnek hozzunk létre egy új, fehér hátterű dokumentumot, lehetőleg téglalap alakút (500x60px). Hozz létre egy új réteget a menü alapjának elkészítésére. Válaszd a Rectangular Marquee eszközt és készíts egy kijelölést, amekkorára a menüt akarod készíteni, pl. 480x40px, majd színezd ki a következő színnel: #005b95. A kellő effektelés érdekében végezd a következőket: Layer / Layer Style / Gradient Overlay a következő színekkel (balról jobbra, vagyis a világosabb szín legyen felűl): #2473a5, #005b95, #3585b9, #7eb1d2. Egy Stroke effekt is kell, a következő paraméterekkel: 1px széles, outside, opacity (láthatóság) 100%, a szín pedig #003150.

Windows Live stílusú menü

Elolvasom a teljes bejegyzést »

Aero vista gomb készítése

Írta: | 2007. október 07. | kategóriák: Design, Interface, Speciális effektek | 2 megjegyzés

Aero Vista gomb alapA leírásban Aero Vista stílusú gombokat fogunk elkészíteni. Több okból is érdemes elsajátítani ezt a fajta stílust: aránylag egyszerű az elkészítése és a weben is jól néz ki, afféle web2.0 stílusnak is megfelel. Vágjunk is bele, hozz létre egy új dokumentumot, majd válaszd a Rounded Rectangle eszközt. A radius paramétert állítsd 5 képpontra, majd rajzolj egy ehez hasonló méretű lekerekített sarkú téglalapot.
Ha készen vagy, akkor kezdődhet a nagy átalakítás. Néhány effektet használva, hamarosan befejezed a képet és megtanulod a Photoshop néhány, leggyakrabban használt, effektét is. Kattints duplán a rétegen és válaszd a Stroke egységet, vagy Layer/Layer style/Stroke. Állítsd be a következő értékeket: size 1, position outside, blend mode normal, opacity 100%, fill type color, color fekete.

Elolvasom a teljes bejegyzést »

A webdesignerek hét bűne

Írta: | 2007. október 06. | kategóriák: Alapok, Blogolok, Design, Web | 37 megjegyzés

Figyelem!Azért született ez a bejegyzés, mint a webdesignerek hét bűne, mert rengeteg idegesítő weboldalt lát az ember nap, mint nap. Ezen lehet segíteni, mindössze oda kell egy kicsit figyelni, hogy mik az esztétikum határai. Nem akarok most minden apró hibát felsorolni, éppen ezért összegeztem a, szerintem, legnagyobb bakikat.
.1. A leggyakoribb hiba a rossz színek választása. A nem jól összeválasztott szín paletta, főleg az éles színek, ?szétverik? a weboldal kinézetét, sértővé vállnak a szem számára és olvashatatlan oldalt eredményeznek. Persze a hasonló oldalakon nem is időznek sokáig a látogatók.
.2. A második leggyakoribb hiba a fontok nem megfelelő összeválasztása. Maradjunk meg az alap betűtípusoknál, vagy legalább a legeltrejettebeknél. Ha nem ezt tesszük, akkor a látogató egy csúnya oldalt fog látni, annak ellenére, hogy a mi gépünkön gyönyörű. Mi erre a magyarázat? Az, hogy mi nem az alap fontot méretezzük, hanem a sajátunkat. Más és más fontok, más és másként méreteződnek, ezért szétnyomhatja az oldalt, vagy éppen olvashatatlanul picik lesznek a betűk. Ha a Photoshoppos tervezésre gondolunk, ott ne használjunk anti-alias effektet, mivel valóságban nem azt fogjuk kapni, amikor lekódoljuk az oldalt.

Elolvasom a teljes bejegyzést »

Klassz szöveg effekt

Írta: | 2007. szeptember 16. | kategóriák: Photoshop, Szöveg effekt | 12 megjegyzés

Klassz szövegRég volt már, amikor legelső Photoshoppos szövegeffektemet készítettem. Most az eredeti képeket szeretném megosztani veletek, természetesen leírom azt is, hogyan jutottam a semmitől a megadott képig.

Az első lépés egy új dokumentum készítése, én egy 300 x 100 képpontost (pixel) használtam, fehér háttérszínnel. Ezt követően, a Type tool segítségével, írsz egy szövegetOuter glow a #ffaa00 kodú színt használva. Amiután készen van a szöveg, elkezdheted az effektelést, a formalist. Válaszd a Layer/Layer Style/Stroke opciót. Használj egy 3 képpont vastag körvonalat, amelynek a áttetszősége legyen maximális (vagyis teljesen átlátszó, hogy a háttérszín látszodjon). Azért van erre szükség, hogyha nem egyszínű hátteret használsz, látszoljon át a mintázat is. Majd az Outer Glownál (ugyancsak a Layer/Layer Style menüben találod) használd a képen látható paramétereket.

Elolvasom a teljes bejegyzést »