Lectia 28 : Simboluri in HTML

Simbol	Cod Entitate	Simbol	Cod Entitate
«	«	◊	◊
»	»	☆	☆
£	£	☂	☂
€	€	☺	☺
§	§	☃	☃
®	®	✿	✿
©	©	♠	♠
™	™	♦	♦
±	±	♣	♣
‰	‰	♥	♥
Ω	Ω	♪	♪
∞	∞	♫	♫
≈	≈	♀	♀
≠	≠	♂	♂
½	½	α	α
¼	¼	ß	ß
¾	¾	Ø	Ø
†	†	‽	‽
‡	‡	¹	¹
⇧	⇧	²	²
↩	↩	³	³
¡	¡	¶	¶
¿	¿	µ	µ
⁂	⁂	ƒ	ƒ
∴	∴	Å	Å
∵	∵	π	π
←	←	×	×
→	→	ê	ê
↑	↑	è	è
↓	↓	é	é
☜	☜	à	à
☞	☞	ä	ä
☝	☝	æ	æ
☟	☟	Î	Î
★	★	ô	ô

Din pacate nu m-am tinut de cuvant sa fac tutoriale pas cu pas pentru tot ce invat. Ritmul a fost destul de rapid si nu am avut timp sa exemplific totul pentru ca asta mi-ar fi luat mult timp si job-ul meu nu-mi permite asta. In masura timpului am sa continui sa postez mai ales ca am un nou proiect.

Adobe Photoshop este formidabil si 75% dintr-un site se face cu el. Mult de munca, multi nervi, insa rezultatul final este formidabil. Trebuie multa practica si rabdare dar daca exista placere si un scop devine distractiv.

Pentru prelucrari video folosesc Ulead si cat de curant am sa incerc sa folosesc si un Adobe Illustrator.

Am sa fac tutoriale si cu partea video.

Slow motion, title, and cut with Ulead Video Studio.

Frivole

Amazing girlfriend effect

Adobe Photoshop : Aplicarea unui tatuaj

Ca sa aplicam tatuaje este simplu. Am cautat pe internet si am gasit o multime de tatuaje care pot fi aplicate. Cel mai bine se aplica cele speciale (negru sau colorat pe fond alb) dar se pot aplica si diverse imagini, numai ca efectul nu este la fel de intens.
In fotografia de mai sus am folosit acest tatuaj:

Acum am sa aplic altul.

Deschidem poza pe care vrem sa lucram si poza cu tatuajul. Le facem ferestre mai mici, click stanga pe tatuaj, tinem apasat si-l tragem peste poza.
Schimbam Layer-ul nou format in mod Multiply.

Tot in acelasi Layer dam sus pe Edit apoi Free Transform pentru am mari sau micsora tatuajul ca sa se incadreze cat mai bine pe corp.
Dupa ce l-am modificat dam Enter.
Apoi tot de sus de la Edit dam pe Transform -> Warp
Acum putem indoi si curba tatuajul tragand de colturile patratelor pana cand se muleaza cat mai bine pe corp si pare cat mai real.
Este de preferat ca modificarile sa fie facute cat mai incet pentru ca este cam dificil sa aducem imaginea distorsionata la forma initiala.

Apoi marim poza ca sa fie cat mai usor de lucrat cu ea si folosind Erase Tool incepem sa stergem partile din tatuaj care nu sunt pe piele.

Cu cat setam unealta Erase Tool mai mica cu atat conturul sters va fi mai exact. Eu am folosit 9px. Fiecare dupa rabdarea lui.

Dupa ce am terminat de sters, am dat la Image (sus) -> Adjustments -> Hue/Saturation si am umblat putin la Lightness pentru a estompa putin negrul care era prea puternic pentru lumina din poza si pentru a parea un tatuaj mai vechi.



Aplicand tatuaje color pe fotografii alb negru putem obtine efecte deosebite:

Adobe Photoshop : Setari utile

Dupa ce lucram ore in sir si facem salvari peste salvari atunci cand credem ca ce am lucrat are cat de cat rezultatul dorit, ne trezim ca facem o greseala si nu ne putem intoarce la partea unde totul parea OK.
Se poate seta undo sa revenim cat mai mult la ce am lucrat inainte.

Edit -> Preferences -> Performance
La History States - cu cat setam valoarea mai mare cu atat ne putem intoarce cat mai mult cu Undo.
La Cache Levels - cu cat e mai mare valoarea cu atat reactioneaza mai bine programul.
La Enable OpenGL (sau 3D) acceleration - daca bifam creste viteza

Photoshop poate papa pana la 1 Gb de memorie si poate crea si cativa Gb de fisiere temporare.
Daca vreti sa mai alocati loc pentru salvarile temporare mai bifati inca o partitie sau doua la Scratch Disks

Toate astea daca avem un computer care ne permite.

Adobe Photoshop : Efect de cupru

Cand am vazut acest tutorial mi-a placut foarte mult efectul. Cautand pe internet am gasit numai 2 tutoriale cu acest efect. Dupa ce le-am facut de mai multe ori am inceput sa-mi bag propriile setari pentru a obtine cat mai bine efectul.
Optiunile sunt foarte variate in functie de fiecare setare.
Am sa fac un tutorial rapid:
Deschid imaginea si tastez textul. Eu am folosit Arial Black culoarea neagra.
Apoi click dreapta pe Layerul cu textul si selectam Blending options.
Mai intai bifez Drop Shadow ca sa am o umbra la text sa-i dau senzatia de spatialitate.

Am sa umblu si la Gradient Overlay sa luminez putin textul spre partea mai deschisa a fotografiei pentru a crea senzatia de lumina din lateral. Am bifat Gradient Overlay, am fixat Angle la -169, am dat click pe Gradient, am ales de la Presets a 3-a casuta de pe randul de jos (de la stanga la dreapta) cea cu maro si am tras de sageti pana am fost multumita cum pica lumina pe text.

Am facut o copie al pozei pe care am folosit-o ca fundal si am redenumit-o apoi deschis-o pentru a 2-a oara in Photoshop si am dat Edit -> Define Pattern si am adus-o ca pattern in Adobe P dupa care am inchis-o ca sa nu ma incurce.

Click dreapta pe Layerul cu textul apoi Blending Options. Bifez Bevel and Emboss apoi bifez Texture, dau click si din Pattern aleg textura ce am adus-o mai inainte. Am bifat si Contour fara sa umblu la setari.

La contour am fixat Range la valoarea 15. Apoi am bifat Inner Shadow. La Color Overlay am modificat si am pus culoarea #fc9b03.

Am facut un Layer nou (CTRL+SHIFT+N).

Din stanga selectam unealta Rectangle Tool si trasam niste dreptunghiuri pe poza in locurile unde vrem sa luminam. Mutam Layer-ul pe Overlay, dam pe Edit si Free Transform si rasucim dreptunghiurile luminate in functie de cum vrem sa bata lumina. Apoi de sus dam Filter -> Blur -> Gaussian Blur (eu am pus 20 px) si OK

REZULTAT FINAL FUGARITA:

Cand am sa am mai mult timp am sa revin cu un tutorial mai amanuntit si mai explicit.





Adobe Photoshop : Butoane transparente

Am sa va prezint cum fac eu un set de butoane transparente. Ele pot fi mult mai complexe si mai lucrate dar acum am sa fac la modul simplificat. Mai complex am sa prezint in alt tutorial.
Am sa lucrez direct pe o fotografie pentru a se vedea efectul mai bine.

Deschidem poza in Adobe Photoshop.
Alegem unealta Rounded Rentagle Tool sau alta
Punem Radius 8 px.
Alegem o culoare.
Voi desena o forma (dreptunghi cu colturile rotunjite) care va fi forma butonului.
Punem Fill 0%.

Click dreapta pe Layer-ul nou si alegem Blending Options si bifam Drop Shadow

La Blend mode punem Multiply si ne jucam cu Angle pana obtinem o umbra care ne place si care se potrivste cu umbra din poza (eu am fixat la -153).

Am bifat Inner Shadow si am fixat Distance la 3 px.

La Outer Glow si Inner Glow am pus doar Blend Mode : Screen.

La Gradient Overley nu am umblat (de acolo putem seta cat din buton sa fie transparent si in ce proportie)

In final am bifat Stroke si am pus Outside la Position si am pus Opacity 50%

Ca sa facem alte butoane dam click pe Layer apoi dam Duplicate Layer. Butoanele se suprapun dar le putem trage si aseza unde vrem. Dam Duplicate Layer pentru fiecare buton pe care vrem sa-l adaugam.

Apoi cu unealta Horizontal Type Tools am scris pe butoane.

Orice modificare adusa in Blending Options se cunoaste in aspectul final. Putem interveni in orice setare pentru a observa ce se modifica.

Am facut alte butoane respectand coloristica pozei

Optiunile sund diverse si se pot crea nenumarate stiluri si efecte.

Cand am sa am mai mult timp am sa prezint mult mai detaliat si voi arata si cum se obtine si efectul de sticla sau oglinda semitransparenta.