Reguli in creearea unui logo

Cum sa faci un logo, sigla, emblema, simbol pentru o firma.

In tutorialul urmator veti trece prin toate etapele ce va vor ajuta in crearea unui logo bun.
⊙ 1. CE TREBUIE SA STII: 
- De fiecare data cand te simti multumit de logo-ul ce tocmai l-ai terminat inseamna ca te-ai intrecut pe tine si esti pe drumul cel bun. De acest lucru trebuie sa tii cont, mai mult decat parerile celorlati (GG, frumos, bet0n) si el trebuie sa te motiveze.
- Pe logo NU SE PUN texturi ! daca cineva iti spune ”Cam simplu, puteai pune niste flacari” , persoana aia la randul ei ar trebui sa urmareasca acest tutorial.
- In crearea unui logo, nu te vei ajuta de resurse (altele decat cele din photoshop). NU AI VOIE sa cauti pe google shape-uri, brush-uri, etc. si apoi sa te folosesti de ele.
- Logo-ul trebuie facut DE LA 0 de catre tine. In orice alt caz, acea imagine rezultata nu se numeste logo.
- Logo-ul trebuie sa fie VECTOR (sa se poata imprima/ mari/ micsora fara sa-si piarda calitatea). De aceea nu aveti voie sa folositi texturi sau imagini de pe internet, deoarece acelea nu sunt lucrate vectorial si va pierdeti calitatea logo-ului.
- Photoshop-ul NU ESTE UN PROGRAM VECTORIAL - In sensul ca puteti lucra cu vectori dar nu puteti salva vector.
- Pentru a face un logo bun de imprimat chiar si in photoshop lucrati la rezolutii mari (vezi imaginea 1.1).
- De fiecare data cand salvati lucrarea finala, salvati-o in format .png - In felul asta, cu ajutorul rezolutiilor mari, logo-ul vostru se va apropria de calitatile unui vector adevarat.
- In functie de performantele calculatorului vostru, la Width si Height puteti pune valori mai mici, dar la Resolution lasati 300 !

⊙ 2. CE ESTE DE FAPT UN LOGO:
- Un logo (probabil o prescurtare de la logogramă, din logo- „cuvînt” și -gramă „scriere”), numit uneori și siglă este un element grafic folosit pentruidentificarea unei firme, a unui produs, a unei organizații, a unui eveniment etc.
- Logoul poate fi compus din una sau mai multe litere, o imagine sau o combinație a acestor elemente. Un logo al unei intreprinderi trebuie să fie clar de recunoscut și să se identifice cu o caracteristică pentru întreaga întreprindere. În contextul legal logoul este și marca inregistrata a unei firme, a unui produs, a unei organizatii, a unui eveniment etc. De obicei agenții de publicitate însărcinează designerii cu crearea unui logo respectiv.
- Logoul trebuie să evidențieze semnificația numelui sau activitatea companiei și să redea renumele acesteia. Acest lucru poate fi realizat printr-unsimbol grafic și/sau al unui scris selectat. Pentru aceasta trebuie să fie aplicată formulă „KISS” (Keep It Short (and) Simple), ceea ce înseamnă —ce este simplu se memorează ușor.    (wikipedia.org)
- Cu alte cuvinte, logo-ul poate fi format dintr-ul text (Simplu sau efect pe text – vezi exemplele de mai jos, imaginea 2.1 )

- Sau dintr-ul simbol (sigla) sau text + Simbol (element grafic). ( imaginea 2.2)

- In general un logo simplu ( ca si forma/ culoare) poate fi retinut foarte usor si este un logo reusit (vezi logo-ul de la orange).
- De asemenea poti face ca un logo sa poata fi memorat , lucrand o forma (simbol) care sa atraga atentia si sa ramana intiparit in minte mai mult de 10 secunte. ( vezi logo-ul de la GodPlay imaginea 2.2)
⊙ CULORILE UNUI LOGO REUSIT:
- Trebuie sa tineti minte ca UN LOGO TREBUIE RETINUT USOR, iar o data cu el (forma sa) trebuie sa retinem si culorile.
- De aceea nu este recomandat ca intr-un logo sa folositi mai mult de 2,3 culori, dar puteti folosi mai multe nuante ale aceleiasi culori
- Pentru a nu gresi, puteti lua exemplul logo-ului Orange ( imaginea 2.2) si sa folositi o singura culoare.
- Pentru a combina 2 sau mai multe culori (vezi logo-ul GodPlay – imaginea 2.2) va recomand acest site: culori.ro-sotw.com
- In imaginea de mai jos (imaginea 2.3) gasiti cateva exemple de combinatii “lucrabile” de pe culori.ro-sotw.com.

- Acest model de site-uri va ajuta sa combinati 2 culori greu de combinat fara experienta. In imaginea de mai sus puteti observa acel galben mustar care se combina foarte “armonios” cu acel mov-gri. De asemenea puteti folosi aceste site-uri pentru ca combina 2 culori complementare.
- Photoshop-ul va pune si el la dispozitie o paleta de culori de genul celei de pe colorcombos.com.  Color Libraries se numeste, si in imaginea de mai jos (imaginea 2.4) veti gasi butonul ce va duce spre acele palete de culori.

- Ati vazut probabil ca in imaginea de mai sus (2.4) am subliniat Only Web Colors. Dupa bifare veti observa ca nuanta de rosu (de exemplu) se va restrange si veti avea mai putine culori in Color Picker. Practic, acea optiune iti va pune spre folosire doar culorile recunoscute (mai usor) de browser-ele web.
- De asemenea, pentru infrumusetarea unui simbol/ text, puteti aplica un efect web 2.0 (de lucire) sau un GM (Gradient Map (G))
⊙ 3. Vectorizarea:
- Photosohp-ul are doar cateva unele care creeaza vectori.
- ATENTIE ! Brush tool, Dodge/ Burn tool, etc nu sunt unelte ce pot fi folosite in crearea unui logo (imaigne vectoriala). Deci nu le folositi ! in absoluti niciun caz/ proportie.
- PEN TOOL (P) si lista de unelte de la Rectangle Tool (U) sunt singurele unele ce creeaza vectori. (vezi imaignea 3.1)

- Am evidentiat cu rosu aceste unelte.
- Atientie la Custom Shape Tool (vezi imaginea 3.1 – ultima unealta de jos) - Teoretic n-ati avea voie sa folositi mai mult de un Triunghi si un Hexagon din formele ce vi le pune la dispozitie. Adica nu puteti face un logo folosind decat forme simple (Patrat/ Triunghi/ Hexagon/ Romb) oferite de photoshop.
- In imaginea de mai jos (imaginea 3.2) am ilustrat shape-urile (formele) bune/ sau nu pentru crearea unui logo.

- Dupa cum vedeti am evidentiat (fososind culoarea verde) shape-urile de care va puteti ajuta intr-un logo.
- Restul de forme le veti face folosind Pen Tool.
- Dupa ce selectati unealta Pen Tool (vezi imaginea 3.1) va trebui sa o setati. Veti face asta selectand Shape Layers din bara ce va aparea sus. (vezi imaginea 3.3)

- In felul asta vor aparea ancorele la fiecare forma pe care o veti lucra. Si veti lucra vectorial !
Va recomand acest tutorial pentru Pen Tool : Tutorial Pen Tool – RO-SOTW.COM
⊙ 4. Pozitionare/ efecte:
- Incercati sa nu “ingramaditi” un simbol (element grafic) printre cuvinte/ litere (DOAR DACA STII CE FACI ). Lasati-l aerisit. (vezi primul exemplu negativ din imaginea 4.1)
- Incercati sa nu inlocuiti simbolul cu Prima(sau orice) litera din Numele companiei. (vezi al doilea exemplu negativ din imaginea 4.1)
- Simbolul intr-un logo arata bine deasupra textului (centrat pe el) si dupa caz o umbra (vector, adica neblurata) sub el. (vezi al treilea exemplu din imaginea 4.1)
- De asemenea il puteti pune inaintea textului, iar dupa caz o “bara” mai stearsa (opacitatea scazuta/ gri deschis) intre simbol si text. (vezi al patrulea exemplu din imaginea 4.1)
- Incercati ca forma finala sa nu iasa colturoasa (din cauza pen tool-ului). Pentru asta incercati pentru forma dumneavoastra sa folositi cat mai putine “ancore”.
- Se poarta formele (simbolurile/ elementele grafice) aerisite (prin culori/ model), rotunjite, minimaliste (nebadarane)

⊙ 5. Textul:
- Am vorbit despre simbol dar despre text nu prea.
- Textul = font + Culoare + Efecte.
- Pentru fonturi, va recomand site-ul http://www.dafont.com
- Pentru culori, de asemenea http://www.colorcombos.com , dar trebuie sa tineti cont sa nu folositi prea multe culori.
- La efecte este vorba despre asezarea fontului (dar si a literelor). De asemenea puteti alterna 2 texte (unul gros si unul subtire) Acest “efect” se poarta.
- Pe text puteti aplica si un efect web 2.0 sau un GM (Gradient Map (G) ).
- Pentru a aplica un gradient, dati click dreapta pe layer-ul cu textul, apoi apasati pe Blending Options.  Din urmatorul meniu, alegeti Gradient Overlay. Acolo aveti niste setari ce va ajuta la pozitionarea GM-ului, opacitatea lui precum si modul de imbinare dintre layere.
- In imaginea de mai jos (imaginea 5.1) aveti cate exemple de texte.

- De asemenea puteti combina mai multe fonturi ce au/ sau nu culori diferite (imaginea 5.2).

- In unele cazuri, chiar daca ai obtinui combinatia de culori dorita, chiar daca ai gasit cele mai curate si lucrabile fonturi, ceva nu e bine…. si textului ii lipseste ceva. Atunci poti incerca sa adaugi o linie fix sub text (vezi imaginea 5.1 – al patrulea exemplu )
⊙ 6. Tagline-ul:
- Tag-ul reprezinta sloganul firmei sau pur si simplu un text informativ.
- Cateva exemple de logo-uri cu tag-uri in imaginea de mai jos (imaginea 6.1).

- Dupa cum vedeti tagline-ul se pozitioneaza sub Textul principal.
- Cand o litera te incurca (vezi logo-ul GodPlay din imaginea 6.1), atunci te poti folosi de ea sa te opresti cu tag-ul.
- Daca ai la dispozitie un Tagline mic (un cuvant), iar textul principal este format din 2 cuvinte (sau unul mai lung) atunci poti lua ca exemplu al doilea logo (imaginea 6.1).
- Atentie mare ca tagul sa inceapa fix din marginea stanga a Textului principal, si sa se termine in marginea din dreapta. Sa fie la fel de lat cat textul principal.
- Pentru a mari distanta dintre litere (de asemena pentru a lati/ lungi literele in sine) veti folosi combinatia de taste CTRL +T.
- In fereastra ce tocmai a aparut, aveti posobilitatea sa modificati cateva valori. In imaginea de mai jos (imaginea 6.2) va sunt explciate cateva optiuni.

- Puteti observa in al treilea exemplu din imaginea 6.1 ca puteti pozitiona tag-ul si sub un cuvant din textul principal.
- Ultimul exemplu din imaginea 6.1 este unul negativ. NU pozitionati tag-ul la voia intamplarii. Trebuie sa fie sub ceva (cuvant/ cuvinte).
- De cele mai multe ori, culoarea unui tagline este una neutra. Nu va recomand negru neaparat… puteti incerca un gri inchis ca in exemplul de mai jos (imaginea 6.3)
- Tag-ul nu trebuie sa fie mai mare decat jumatate din textul principal. Exact ca in exemplul de mai jos (imaginea 6.3), 2 tag-uri unul peste altul, masoara aproximativ cat textul Construct.
- Atentie ! avand in vedere ca proportiile tag-ului sunt mult mai mici decat al unui text principal, Nu-l micsorati foarte mult, astfel va ramane lizibil(vizibil cu usurinta )
- Ca un ultim exemplu/ sfat, daca aveti un tagline(tag) scurt si un text principal lung, va puteti folosi de o linie orizontala ca in exemplul urmator (imaginea 6.3):

⊙ 7. Prezentarea:
- Prezentarea este ultima etapa in crearea unui logo.
- Ea este formata in esenta(de cele mai multe ori) dintr-un background.
- Multi o neglijeaza dar trebuie sa stiti ca o prezentarea frumoasa poate face diferenta.
- NU faceti o prezentare (background/ fundal) albastru, daca logo-ul/ textul in sine este tot albastru. In cazul acela, logo-ul nu va fi lizibil.
- NU folositi pe background-ul prezentarii o culoare complementara cu cea folosita in simbol/ text.
- NU multiplicati simbolul/ logo-ul ca sa-l plasati ulterior in colturile prezentarii cu opacitatea scazuta. Asta o faci doar daca stii cum.
- NU adaugati in prezentare alte elemente inafara logo-ului (format din text si simbol dupa caz).
- Pastrati prezentarea simpla si curata/ aerisita (ca model/ culori)
- Efectul de culoare cel mai des intalnit este un GM (Gradient Map) de la negru la alb pus pe Radial cu opacitatea undeva pe la 15 – 25% ( Vezi imaginea de mai jos – 7.1)

- Acest efect il pui pe un layer nou deasupra imaginii albe de fundal. Il aplici incepand din mijlocul lucrarii, spre extreme.
- Poti schimba culorile, in locul negrului adaugand un bej de exemplu. In aceasta situatie poti adauga una din culorile logo-ului (siglei) pentru ca opacitatea mica a GM-ului va face prezentarea sa se asorteze cu logo-ul si in acelasi timp sa nu deranjeze.
- In prezentare puteti strecura varianta alba/ neagra (de imprimat) a logo-ului. Dar NU in colturi.
- Mai jos (imaginea 7.2) aveti cateva modele de prezentari pentru acelasi logo.

Sper ca este cel mai complet/ complex tutorial despre logo-uri romanesc. Sper ca va trece prin toate etapele si in acelasi timp sper ca v-a ajutat mult.
Acest tutorial a fost creat de Ionescu Alin (PRO) pentru http://www.ro-sotw.com.
ps. scuzati eventualele greseli gramaticale.

Cum desenezi in creion

Tutorial Desen – Cum sa desenezi
Am facut acest tutorial cu speranta ca mai multi sa incerce si sa sustina arta traditionala.
L-am divizat in 3 categorii:
   1. Puncte de reper/perspectiva.
   2. Umbre.
   3. Lumina
Dar prima data trebuie sa stabilim care sunt tipurile de creioane si/sau foi care sa ne confere un
desen cat mai placut si reusit.
Creioane - Creioanele din cat. B (5B-9B) se folosesc mai mult pentru umbre fiind mai moi fata de celelalte tipuri de creioane.
Drept urmare, pot fi intinse foarte usor cu un servetel sau oricare alt material destinat hasurarii.
Nota: Nu intinde niciodata grafitul cu degetul. Degetele au grasime (weird,ha ?!) care distruge hartia si pe deasupra nu o sa obtii umbre uniforme.
- Cele din cat. HB au un grafit tare si trebuie sa apesi destul de tare ca sa obtii un gri mai inchis.
- Iar H-urile le recomand pentru spatii mai mari,precum fundalul.
Foaie de lucru - La desenul in creion este recomandat sa avem o foaie aspra, cartonata. Evitati foile lucioase si fine. (fugiti de ele)
Eu personal folosesc – 2 creioane: HB si creion mecanic pentru detalii.
- Foaie bloc de desen A4,110 g/m de la Pigna.
- Pentru hasurare/umbre folosesc acel material fibros care il gasiti pe tastatura unui laptop nou cumparat.
- Pentru lumina folosesc radiera.

1. Puncte de reper/perspectiva.
-Daca vrem sa desenam o figura: avand foaia A4 in fata,desenati o forma de ou in mijlocul foii (oul fiind capul).
Mai departe trasati o linie orizontala prin mijlocul figurii – ca sa stiti ca acolo vin desenati ochii.
- Trasati o linie verticala prin mijlocul figurii.
- Desenati ochii: ei se afla in mijlocul celor 2 parti ale capului.
- Trasati de la fiecare pupila o linie dreapta in jos: in spatiul dintre aceste 2 linii vom desena gura.
- Nasul il facem in mijlocul celor 2 linii trasate de la pupila si deobicei nu este mai larg ca distanta dintre ochi.
Urmariti imaginea de mai jos:

—————————————————————————————————————————–
2. Umbre
Umbrele pot fi foarte usor sau foarte greu de realizat, depinde de ce instrumente folosesti dar nu in ultimul rand de tehnica.
Pentru spatii mai mari folosesc asta:  
Iar pentru spatii mai mici/detalii,asta:  
Cam asa arata cand hasurezi cu ele pe foaie:   
——————————————————————————————————————————
3. Lumina
Pentru lumina putem folosi ori creion cu grafit alb special pentru asa ceva, sau radiera.
La fel ca la umbre:- Creionul il folosesti pentru detalii (ochi/buze/nas).
- Radiera o poti folosi pentru spatii mai mari dar daca stii cum sa o manuiesti, o poti folosii si la detalii mici.
Sursa:www.ro-sotw.com

Primii pasi in realizarea unui tag.

Tutorial semnatura

Mai jos aveti cateva sfaturi de baza in crearea unei semnaturi.
* Ok o sa incepem cu primul pas; Introducerea render-ului intr-un document nou de 400×150 si 150 la resolution.

- Dupa cum vedeti, render-ul l-am plasat putin in afara semnaturii, mai precis un sfert din cap in sus.
- Astfel vom oferii semnaturii un efect de inaltime, si in acelasi timp ne va ajuta si la flow.
Mai jos aveti cateva exemple negative, pe care va sfatuies sa le evitati.
Daca pozitionam render-ul astfel pierdem efectul de inaltime.

Mai jos aveti cateva exemple negative pe care va sfatuiesc sa le evitati.
Focalul nostru, adica centrul nostru de interes este personajul, mai exact render-ul, si mai exact fata render-ului, daca noi urcam render-ul prea sus astupam focalul.
In exemplul de mai jos rener-ul este pozitionat central, ceea ce este foarte bine, dar este foarte mic, si nu ne va ajuta deloc la flow, si in acelasi timp, prin micsorarea render-ului se pierd detaliile de pe el.
In exemplul negativ de mai jos rener-ul ofera semnaturei un efect de inaltime, ceea ce este foarte bine, dar este pozitionat in margine, lasand mult spatiu gol si negativ. Va recomand sa evitati pe cat puteti aceasta pozitionare.

* in continuare vom vorbii de integrarea render-ului, si de folosirea celor mai potrivite culori.
Dupa cum vedeti in exemplul de mai jos, eu am ales pentru fundal o culoare calda si cat mai apropiata de render; Pur si simplu am selectat cu ajutorul uneltei “Eyedropper Tool (I)” portocaliul de pe Haina ei.
Astfel putem spune foarte siguri ca render-ul este integrat.

Mai jos aveti cateva exemple pe care va sfatuiesc sa le evitati.

Pur si simplu am folosit niste culori foarte puternice care nu au nicio legatura cu render-ul, si tot ce provoaca ele este  o durere de ochi.
Pentru combinatii de culori, va recomand site-url : Palete si combinatii de culori Photoshop

Un alt exemplu in care v-am prezentat un bg. foarte urat plin de culori puse aiurea, un fundal ingrozitor, dar sM3q3rR ar spune unii ca scrie Alin BO$$ acolo :>

* Ca o paranteza, eu va sfatuiesc sa urmati cat mai multe tutoriale la incput, sa evitati sa faceti semnaturi din cap, astfel veti evolua mult mai repede.*
* OK, in continuare vom discuta de light si delpth, lasand la urma flow-ul.
Light, depth… doar la auzirea acestor 2 cuvinte deja va  ia cu ameteli, nu’i nimic , asta am patit si eu la inceput, cand spuneam ca astea 2 lucruri nu au legaturi cu semnaturile si as putea sa nu le folosesc, dar m-am inselat.
- LIGHT, sau pe romaneste lumina, sursa de lumina, iluminare. Tot ce face intr-un sig este sa ofere semnaturii un efect 3D prin adaugarea de lumina.
- DEPTH,  pe romaneste ar insemna distanta, adancime, la fel ca light-ul, acest element ofera semnatuii un efect 3D prin adaugarea de intuneric/umbre semnaturii si respectiv render-ului.
-Aceste 2 elemente, Light-ul si respectiv Depth-ul se folosesc simultan intr-un sig si sunt cu siguranta obligatorii.
-Bineinteles ca nu le vom folosii aiurea si va trebui sa ne gandim putin inainte in ce parte va fi intuneric, in ce parte lumina etc.  Normal ca daca in dreapta avem intuneric in stanga avem lumina, dar asta depinde de fiecare data de render (daca folosim un render) sau de personaj(daca folosim un stock).
In exemplul nostru vom incerca impreuna sa ne dam seama din ce parte vine lumina pe render.

Deci in semnatura noastra, datorita luminei de pe bluza ei si datorita parului ei luminat mai mult in partea stanga, am hotarat ca lumina vine din stanga.
Am ales special un render pe care nu se observa foarte bine sursa de lumina, ca sa va arat cum urmarim indiciile si mai ales cum ii csontruim noi sursa de lumina.
- Ok, acum vom folosii unealta “Burn tool” si respectiv “Dodge Tool” (O) pentru a crea efectul de lumina si intuneric.
Pentru a crea efectul de lumina si de intuneric, mai intai creati un layer nou, apoi mergeti sus la image/apply image.
Apoi urmarind imaginea de mai jos, dati cu burn si dodge tool astfel:
In zona marcata cu rosu dati cu burn tool , setat astfel:

La Hardness setati 0.
Folosind dodge tool cu setarile de mai jos, dati usor in zona marcata cu albastru.

La Hardness setati 0.
La sfarsit veti obtine o imagine asemanatoare cu :

————————————————-
Trebuie sa stii ca intr-o semantura toate se leaga. Lumina cu umbrele cu focalizarea cu adancimea, contrastul si culorile .
- Daca folosesti vectori, in spatele lor, pune-le o umbra finuta (brush tool cu opacitate scazuta).
- Pastreaza umbra pe aceeasi parte la toti vectorii.  Asta daca sursa ta de lumina vine din extremitati si nu din mijloc.
- Daca in stanga ai sursa de lumina, in dreapta vei intuneca semnatura
- Incearca sa nu faci lumina/ umbrele (intunericul) din burn si dodge( este o metoda adresata incepatorilor). Lucreaza cu brush alb/ gri inchis. Pune fiecare brush gri inchis/ alb pe un layer nou, lucreaza in straturi, iar la unele layere incearca sa le schimbi modul de imbinare, va oferi in unele cazuri un plus de stralucire luminii, si un plus de seriozitate si de mister intuneruicului. Fiecare modificare o vei face pe un layer nou, putand oricand renunta la ea daca pe parcurs consideri ca nu-si are rostul., (CU brun/ dodge n-ai fi putut face asta, + ca in acest caz ai libertate de miscare mai mare)
- Daca nu-ti mai ies semnaturile nu-i bai. Toti trecem prin asta, semnaturile sunt destul de complicate, nu stiu cat inteleg asta….
- Incearca  sa-ti schimbi putin stilul. Sa aduci ceva nou.
- Ai incercat sa lucrezi cu vectori ?
- Ai incercat texturile vii colorate ?
- La sfarsitul lucrarii, indiferent ce resurse ai folosit sa ajungi acolo, iti recomand 1, 2 GM-uri puternice (Gradient map – layer – new adjustament layer – gradient map).
- Culorile pt. GM-uri le poti lua de pe COMBINATII DE CULORI PHOTOSHOP
- Gm-urile alese bine, ofera o noua pata de culoare semnaturii, un nou contrast si o noua atmosfera.
- Focalizarea nu se face doar din blur/ sharpen. Defapt daca tu nu lucrez in straturi BG-ul (vectori cu umbra intre ei, c4d-uri asezate in scari, etc) si ai doar un smudge uniform sa zicem…. nici nu se prea recomanda sa dai cu blur pe bg.
- BLUR-ul se aplica in trepte. De langa render(punctul focal) spre extremitati. 
- Sharpen-ul nu e musai sa-l folosesti…. doar daca lucrarea ta are o calitate mai proasta… si atunci il aplici finut.

Albire dinti in Photoshop

Cum sa editezi dintii in Photoshop

Albire dinti Photoshop

Indreptare dinti Photoshop

Daca ai ajuns la acest tutorial, sigur vrei sa-ti “remediezi” o problema dentara foarte rapid si fara costuri. De asemenea, daca vrei sa-ti testezi abilitatile in photoshop sau doar vrei sa inveti tehnici noi de retusare a imaginilor, te invitam sa urmaresti tutorialul urmator !
Indiferent daca ai o poza cu dintii galbeni sau o poza cu dintii strambi, tutorialul urmator este solutia ta. Vei afla cateva tehnici usor de pus in aplicare dar in acelasi timp si eficiente.
1. Analizarea imaginii
- Prima oara, daca vorbim de retouch (retusare digitala) este important sa analizam imaignea, sa stabilim de unde plecam, unde vrem sa ajungem si etapele prin care vom trece.
- Aceasta etapa nu ne va lua mult timp dar este extrem de importanta. Daca ne invatam sa lucram (Incepem) cu ea , imaginea noastra finala va fi curata si profesionala.
- Imaginea Stock (pe care vom lucra) este cea de mai jos.

- Salvati imaginea in PC-ul dumneavoastra.
- Penturu a salva, dati click (stanga) pe imaginea de mai sus. Apoi “Salvati imaginea ca” (Save as) si o puteti pune pe Desktop.
- Deschideti imaginea cu Photoshop-ul.
- Pentru a face asta, intrati in Photoshop, mergeti sus la File -> Open - > si selectati imaginea de pe desktop.
- Ca o analiza rapida a imaginii, cu siguranta prioritata va fi albirea si indreptarea dintilor. Dupa ne vom ocupa si de micile detalii estetice.
2. Albirea dintilor
Inainte de taote, trebuie sa stiti ca retusarea nu se face la maximum. Totul trebuie sa para real (cu atat mai mult in cazut dintilor). Asa ca nu vom exagera pe parcursul tutorialului.
- Sunt mai multe metode de a albi dintii. Unele metode nu sunt destinate incepatorilor dar rezultatul are o calitate mai buna.
- Practic, diferenta sta in selectarea (selectia) dintilor, pentru a aplica efectele de albire doar pe zona lor (nu pe gingie/ buze/ etc. )
- Pentru avansati, recomand folosirea uneltei Pen Tool (P). Pentru cei ce vor sa invete aceasta unealta, recomandtutorialul acesta : Tutorial Pen Tool Incepatori
- Pentru cei incepatori recomand metoda urmatoare:
Selectarea dintilor: (Metoda Quick Mask)
- Dupa ce am adaugat (deschis) imaginea in photoshop, pentru a intra in modul Quick Mask vom apasa tasta Q.
- Practic, acest mod de a selecta o imagine nu face decat sa aplice un brush transparent peste imagine (in cazul nostru dintii) ca o masca, pentru ca la sfarsit, ce va fi sub acel brush (zona colorata de noi) sa se transforme intr-o selectie.
- Dupa apasarea tastei Q va trebui sa aveti setarile urmatoare in Photoshop : (vezi imaginea 2.1)

- Verificati daca aveti aceleasi setari, verificati daca prin apasarea tastei Q, s-a selectat Brush Tool (  - Unealta din imaginea 2.1, si verificati daca prin utilizarea ei, aplicati acelasi strat roz-portocaliu ca in imaginea de mai sus.
- Daca totul functioneaza bine, veti incepe, folosint Mouse-ul, sa aplicati un strat roz-portocaliu peste dinti (respectiv peste partea care o doriti selectata – apoi albita). (imaginea 2.2)
- Pentru a apropia imaginea, folositi combinatia de taste CTRL+ “+”. (respectiv ctrl+”-” pentru micsorare)

- Pentru zolene mai dificile (colturi, margini, zone mici) puteti micsora marimea brush-ului, cum am facut eu de la24 la 13 (vezi imaginea 2.2 - partea de sus ).
- Dupe ce veti acoperi toata zona “galbena” pe care vrem s-o selectam ca apoi s-o modificam, veti obtine unrezultat asemanator cu cel din imaginea 2.3.

- In continuare, vom apasa iar tasta Q pentru a iesi din Quick Mask.
- In caz ca gresiti vre-un pas (combinatie de taste, va tremura mana, incurcati butoanele, etc), puteti folosi combinatia de taste CTRL+Z pentru a merge un pas inapoi si a va repara greseala.
- Dupa apasarea tastei Q veti obtine o selectie ca in imaginea de mai jos : (imaginea 2.4)

- Acum va trebui sa inversam selectia.
- Pentru a face asta, mergeti sus la Select apoi selectati inverse. Sau putei folosi combinatia de tasteCTRL+SHIFT+i
- In continuare sus la Layer -> New -> Layer Via Copy (imaginea 2.5) sau apasati  CTRL + J. Veti obtine o copie a dintilor intr-un layer nou (pe care vom aplica imediat alte procedee).

- Pe layer-ul nou, cel cu dintii, va trebui sa schimbam modul de imbinare al layer-ului. Pentru asta. dam dublu-click pe layer (in partea dreapta a ecranului se afla). Sau click dreapta pe layer -> Blending options, si setati modul de imbinare de pe Normal pe Color. (vezi imaginea 2.6)

- Apoi mergeti sus la Image - Adjustments - Hue/Saturation si adauga valorile din imaginea urmatoare: ( imaginea 2.7).

- Aceste valori nu sunt standard si difera de la imagine la imagine.
- Veti obtine o imagine asemanatoare cu urmatoarea: (imaginea 2.8)

- Pentru petele galbene “insistente” de pe dinti (cele mai puternice in intesitate), de obicei cele care va raman dupa selectia dintilor(cele mai apropiate de gingie), va recomand unealta Dodge Tool (O), care “lumineaza” dintii.
- Utilizati urmatoarele setari pentru Dodge Tool: (vezi imaginea 2.9).

3. Indreptarea dintilor
- Pentru indreptarea dintilor ne vom folosi de Liquify.
- Mergeti sus la Filter -> Liquify
- Setati unealta ca in imaignea de mai jos: (imaginea 3.1)

- Liquify-ul se foloseste prin tragerea colturilor iesite afara spre interior, prin indreptarea colturilor strambe, prinindreptarea dintilor.
- Incercati sa va “jucati” cu aceasta unealta inainte sa incepeti sa indreptati dintii. Este un procedeu migalos, asa ca va sugerez sa folositi miscari scurte si dese. Pentru  o acuratete mai mare va puteti micsora marimea brush-ului de la 25 la 15 sa spunem.
- Urmariti imaginea de mai jos ( imaginea 3.2)  pentru a va face o idee. Indreptati toate colturile.

Ce faceti daca un dinte se suprapune peste altul ? 
- Il indreptati cu Liquify, apoi, folosind Burn Tool (O) (opusul lui Dodge) vom creea o umbra. Vom creea o umbra noua. cea veche o vom astupa inainte cu Dodge Tool, astfel : (imaginea 3.3)

- Repetati acesti pasi pentru fiecare dinte in parte, pana ii veti indrepta pe toti.
- La sfarsit, pentru putina stralucire (si adancime) puteti aplica un Burn Tool foarte finut intre fiecare dinte in parte.
- Atentie mare ! Ca niste sfaturi va pot spune:
- Nu va uitati doar la partea din interior a dintelui sa vedeti daca este drept. Uitati-va si la partea din spregingie. Pentru a indrepta zona aceea, folositi un brush de marime mai mare in Liquify.
-  Atentie la cei 2 dinti din fata, acolo fuge privirea prima data, deci este indicat sa le acordati putin mai multa atentie.Iata un exemplu mai jos: 

- Pentru un rezultat mai placut puteti aplica o culoare mai “vie” gingiei, buzelor, etc. Pentru asta puteti folosi gradient map. (Layer -> New Adjustament Layer -> Gradient Map ).
- Daca nu sunteti multumiti de selectie si nici de tutorialul de Pen Tool de mai sus, va pot pune la dispozitie unTutorial Pen Tool Video
- Combinatii de culori photoshop/ web design/ 3d/ pictura/ accesorii/ etc: Combinatii de culori
4. Rezultat final

* Tutorial facut de PRO (Ionescu Alin) pentru www.ro-sotw.com . Scuzati eventualele greseli gramaticale.

Tutorial CSS+HTML incepatori

Tutorial HTML Incepatori

Tutorial CSS Incepatori

Pentru inceptul trebuie sa intelegeti ca singurul mod prin care puteit invata HTML, CSS, PHP, etc. este exersarea. Doar citind acest tutorial, nu inseamna ca stiti tot.
01. Structura de baza a unui document HTML.





Continutul site-ului meu web.

- Mai sus v-am prezentat structura de baza a unui document HTML.
- Acest “Document” este defapt un fisier Text cu extensia .html
- Pentru a face acest document este de ajuns sa urmariti pasii urmatori:
- Click dreapta pe desktop - > New - > Text Document, iar cand vine randul sa redenumesti fisierul “New Text Document.txt”, schimba-i si extensia o data cu numele. Astfel, vei avea un fisier de forma “index.html”. 
- Urmariti pasii din imaginea urmatoare( imaginea 1.1):

- Daca nu resusiti sa treceti singuri de acest pas, aveti mai jos un link de Download, de unde puteti descarca un fisier index.html.
- DESCARCA FISIERUL index.html .
- Atentie ! Este important ca numele paginii principale dintr-un site sa fie index.html (sau index.php)  pentru ca in momentul accesarii unui domeniu (ex: televizoare.ro),  hostul cauta pagina index.html / index.php sa o acceseze.
- Dupa ce faceti fisierul index.html, adaugati continutul din codul urmator:

         



         Continutul site-ului meu web.

- Atentie ! Cei ce au descarcat fisierul de mai sus, au deja codul inserat in fisier. Deci vor sari peste pasul de mai sus.
- Bun, acum printr-un dublu click pe index.html (de pe desktop), veti accesa prima dumneavoastra pagina web.
- In intorul paginii noi deschise, nu se observa multe lucruri.
- Prima data observam numele site-ului (vezi imaginea 1.2) iar apoi continutul sau (vezi imaginea 1.2 )

- Haideti sa analizam putin continutul fisierului nostru.

- Evident, un site(chit ca va contine, css, html, php, jQuery, js, etc.) va incepe cu si se va termina cu
-   este un tag ce are nevoie de o deschidere (  ) si de o inchidere  ) continutul aflandu-se intre cele 2.

- Pentru moment, in interiorul  , noi avem decat tag-ul title, ceea ce este foarte bine pentru inceput. Cu cat veti evolua, cu atat veti descoperii mai mult lucruri despre acest HEAD.

- Evident, cuvintele “SITE-UL MEU WEB”, se pot inlocui cu orice doriti voi. (ex: televizoare, Muzica online, Filme noi, etc.)

- Tag-ul BODY, este de asemenea un tag cu deschidere si inchidere.
- In interiorul acestul tag (   ) se va contrui intregul site (imaigni, text, video, etc. )
02. Atributele Tag-urilor.
- Va pot spune ca majoritatea tag-urilor au propriile lor atribute. Vom vorbi despre aceasta pe masura ce introducem in discutie un nou tag.
- O sa incerc sa va fac sa intelegeti dand mereu exemple concrete si modificand in acelasi timp fisierul index.html, fisier pe care l-am facut imrpeuna mai sus.
- Pentru Tag-ul  vom adauga atributul bgcolor=”CULOARE” (unde CULOARE va fi inlocuit cu codul hexazecimal al culorii naostre.
- Astfel, in index.html, modificam  cu 
- Vom obtine rezultatul din imaginea de mai jos:

- Practic, am adaugat tag-ului  (de deschidere) un atribut (bgcolor=” “} care seteaza culaorea background-ului (fundalului) din site. Am ales ca schimb albul de pe fundal cu un gri aerisit, ce are codul hexazecimal #efefef . 
 Sursa:www.ro-sotw.com