Share
Ce veți creaSketch-ul este un instrument foarte versatil pe care îl puteți utiliza zilnic pentru munca dvs. ca designer de web și aplicații. În acest tutorial vă voi prezenta în cadrul Sketch graficul, stratul, umbră, umbră interioară, text, limită și umpleți funcțiile și vă va arăta cum să îl utilizați pentru a crea o simplă pictogramă.
Dacă aceasta este prima dată când deschideți schița 3, există patru lucruri pe care să le țineți cont de interfața Sketch:
Artboard-urile reprezintă o modalitate ușoară de a vă organiza desenele prin cadre delimitate. Schița 3 vă oferă un set de mărimi de tabloul de bord implicit când apăsați pe O cheie (sau faceți clic pe Inserați> Artboard). Puteți vedea că, în mod implicit, aveți dimensiuni ale ecranului pentru principalele dispozitive Apple din partea dreaptă a interfeței Sketch:
Alege Ecrane iPad> Peisaj. Acum îl puteți vedea în panoul straturilor din stânga. Dacă aveți o dimensiune mică a ecranului, nu uitați să micșorați pentru a vedea întreaga placă de artă apăsând Command-Hyphen (-).
Redenumiți placa de artă făcând dublu clic pe ea. Sună-l Icon de apă. Ar trebui să aveți așa ceva acum:
Deci, avem o placă grafică iPad, care are o lățime de 1024 px și o înălțime de 768 de pixeli. Să începem prin adăugarea fundalului. Pentru a face acest lucru, apăsați pe R cheie (sau mergeți la Inserare> Formă> Dreptunghi), faceți clic pe tabloul de bord și trageți mouse-ul / degetul pentru a face un pic dreptunghi. Acum îl puteți vedea în panoul stratului. Redenumiți-o fundal.
Apoi, vom merge la panoul din dreapta și vom seta proprietatea stratului de fundal:
Să adăugăm un anumit stil. Mergi la Frontiere și debifați-o. Acum, adăugați gradientul făcând clic pe culoarea gri implicită din proprietatea umplere. Un meniu derulant va apărea cu cinci opțiuni: Culoare plană, Gradient liniar, Radial Gradient, Gradient unghiular, Umplere model și Umplere zgomot.
De la stânga la dreapta: Culoare plană, Gradient liniar, Radial Gradient, Gradient unghiular, Umplere model, Umplere zgomotClick pe Radial Gradient. Puteți vedea acum un cursor, cu culoarea albă în centrul gradientului din stânga și culoarea neagră care este extremitatea culorii gradientului din partea dreaptă. Pentru a schimba culorile, trebuie doar să faceți clic pe ele în cursorul:
Să setăm culorile. Schița vă permite să modificați valoarea Hexadecimal, RGBA și HSBA făcând clic pe RGB sau HSB eticheta. Sunt mai familiarizat cu HSBA, deci pentru culoarea din centrul pe care o aleg H190, S50, B100, A100, și pentru cea de pe extremitate pe care o aleg H210, S50, B100, A100.
Acum vom crea pictograma care conține picătura. Pentru a face acest lucru, adăugați un nou dreptunghi. presa R, și faceți clic și trageți. Apoi redenumiți noul strat icoană.
Seteaza Lăţime la 515 și Înălţime la 515. Plasați-o în centru utilizând instrumentele din partea de sus a panoului din dreapta:
Utilizați instrumentele de mai sus Poziție pentru a seta poziția stratului dvs. față de containerul acestuiaSeteaza Radiusul frontal la 144, și ca în cazul stratului de fundal, debifați marginea și apoi completați pictograma alegând o culoare albă, plată.
Acum vom adăuga o anumită umbră. Funcția Shadows are cinci opțiuni: culoarea, poziția X, poziția Y, estomparea și răspândirea. Setați umbra la:
Ultimul pas pentru pictogramă este adăugarea unei umbre interioare în partea de jos. Shadow-urile interioare urmăresc aceleași funcționalități ca Shadows, cu excepția faptului că se răspândește la interior de formă în loc de exterior. Putem seta umbra interioara la:
Și în cele din urmă ar trebui să obțineți acest lucru:
În aceste etape finale veți învăța să creați o pictogramă cu picături de apă cu Sketch. Mai întâi avem nevoie de o ovală, deci presă O (sau mergeți la Inserare> Formă> Oval), și să definească dimensiunea sa ca Lățime: 200 și Înălțime: 200.
Apoi, creați un triunghi, mergând la Inserare> Formă> Triunghi (fără o comandă rapidă pentru acesta). Mergeți la panoul din dreapta, verificați Echilateral, și setați Lăţime la 200 și Înălţime la 200.
Acum vine partea complicată. Trebuie să poziționați straturile astfel:
Selectați cele două straturi și faceți clic pe Uniune butonul, care se află în partea de sus a interfeței Sketch.
Acum că avem forma noastră de picături, vom adăuga atingerea finală pentru ao face mai prietenoasă prin adăugarea razei deasupra acesteia. Pentru a face acest lucru, selectați forma și faceți clic pe Editați | × , care se află în bara de instrumente de sus.
Din fericire, primul punct selectat este cel pe care dorim să îl modificăm. Mergeți la panoul din dreapta și schimbați cornere valoare pentru 34.
Felicitări! Forma picăturii este acum completă! Acum puteți să o aplatizați făcând clic pe pictograma din bara de meniu de sus (din dreapta Rotate). Selectați stratul de picături din panoul straturilor și redenumiți-l Droplet. Mergeți la panoul din dreapta și setați Lăţime la 266 si Înălţime la 377. Apoi centrați-l cu scula din partea superioară a panoului din dreapta:
Și acum, ultimul pas: stilul! Mai întâi debifați marginea și apoi completați forma cu un gradient radial. Faceți valoarea centrală H190, S70, B100, A100, și valoarea de jos H210, S70, B100, A100.
Apoi vom adăuga un Umbra interioara cu:
Și…
Vă mulțumim că ați citit tutorialul. Sper că te-a ajutat să înveți să folosești unele dintre instrumentele fundamentale disponibile în Sketch. Nu ezitați să adresați întrebări în comentariile de mai jos.
Accentsconagua