Cum să luați și să editați imagini pentru tutoriale

Toate site-urile din rețeaua Tuts + sunt în permanență în căutarea unor contribuabili de cea mai bună calitate. Dacă sunteți interesat să scrieți pentru noi, dați-ne o linie. Înainte de a lucra ceva, totuși, asigurați-vă că ați citit acest ghid minunat care vă va duce prin procesul complet de luare și pregătire a capturilor de ecran.


Aflați de la un pro

Capturile de ecran sunt probabil cel mai important element al unui tutorial scris. Cititorii noștri le vor folosi ca îndrumători pe măsură ce vă respectă instrucțiunile, astfel încât este important ca capturile de ecran să descrie cu exactitate acțiunile care sunt luate în timpul fiecărui pas. Există multe modalități de a crea capturi de ecran pentru un tutorial, dar în acest tutorial, veteranul Psdtuts + autor, Ed Lopez va explica metoda sa de a produce capturi de ecran de înaltă calitate și descriptive, utilizând atât înregistrări de ecran, cât și capturi de ecran software pentru a înregistra videoclipuri și capturi de ecran pentru tutorialele sale scrise. Să începem!


De ce ai nevoie

Această metodă de capturare a capturilor de ecran pentru un tutorial implică utilizarea mai multor aplicații. Rețineți că această metodă a fost făcută utilizând anumite aplicații numai pentru Mac, dar puteți, de asemenea, să adaptați această metodă pentru aplicațiile compatibile cu PC-urile.

  • Screenflow (Mac)
  • LittleSnapper (Mac)
  • Adobe Bridge (opțional)

Rezultat final

Vă rugăm să aruncați o privire la un exemplu al tutorialelor lui Ed aici.


Pasul 1: înregistrarea

Când scriu un tutorial, găsesc gândul de a opri să ia capturi de ecran de-a lungul drumului de a fi foarte distrag atenția. De aceea am inventat o metodă de a face capturi de ecran, care îmi permit să creez opere de artă fără a interfera cu procesul creativ.

Primul pas este să deschideți fluxul de filme și să începeți o nouă înregistrare. Acum, creați opera de artă exact așa cum ați face dacă ați lucra la un proiect obișnuit. Filtrul de ecran va înregistra acum toate acțiunile dvs. în fundal în timp ce lucrați.


Pasul 2: Finalizați înregistrarea

Autorii petrec de obicei multe ore pe un proiect și pot răspândi adesea aceste ore în mai multe zile. Aceasta înseamnă că vă puteți întrerupe ocazional, puteți lua pauze sau puteți lucra la alte proiecte. Când faceți o pauză, nu ezitați să opriți înregistrarea. Acesta va apărea în bara laterală sub fila media. Odată ce fiecare segment a fost înregistrat, trageți-l în cronologie pentru editare.


Pasul 3: Prindeți imaginile de ecran

Acum că ați terminat înregistrarea întregului proiect, puteți începe să faceți capturi de ecran. Pentru a face acest lucru, deschideți LittleSnapper și creați o nouă colecție inteligentă.

Setați o regulă de dată după cum se arată mai jos. Astfel, toate imaginile create după această dată vor fi plasate în aceeași colecție.


Pasul 4: Definirea tastelor de scurtătură

Acum definiți o cheie de comandă rapidă pentru Zona Snap, după cum se arată mai jos. Simțiți-vă liber să utilizați oricare dintre tastele de comenzi rapide cu care vă simțiți mai confortabil. Am setat-o ​​pe Command + Option / Alt + X.


Pasul 5: Începeți fixarea

Acum, când LittleSnapper este gata, deschideți Screenflow, încărcați înregistrarea și apăsați redarea. Unul dintre lucrurile frumoase despre utilizarea Screenflow pentru a capta întregul proces este că puteți acum să măriți și micșorați, atunci când este necesar pentru a vă asigura că obțineți imaginea exactă de care aveți nevoie.

Când sunteți gata să faceți o captură de ecran, asigurați-vă că ați întrerupt înregistrarea la locul potrivit. Apoi apăsați tastele de comenzi rapide de la tastatură pe care le-ați definit mai devreme în acest tutorial pentru a realiza capturile de ecran. Odată ce le-ați lovit, ecranul va fi estompat și vă va permite să trageți rapid zona din ecran pe care doriți să o salvați. Luați aminte de indicatorul pixel astfel încât să nu trageți o captură de ecran cu o lățime mai mare de 600 de pixeli.


Pasul 6: Faceți notații

Uneori va trebui să adăugați notații la capturile de ecran. Notațiile pot ajuta cititorul să înțeleagă ceea ce privește. De exemplu, dacă doriți să direcționați atenția cititorilor către o anumită parte a ecranului, puteți desena o săgeată pentru ao indica. Puteți, de asemenea, să desenați linii, forme și text atunci când este necesar pentru a explica acest pas. Adăugarea de text în captura de ecran poate fi utilă pentru a introduce, de exemplu, codurile de culoare.

Odată ce faceți clic pe butonul de accesare, veți putea adăuga orice notații de care aveți nevoie pentru respectivul tutorial.


Pasul 7: Exportați imaginile

Când luați capturi de ecran cu LittleSnapper, imaginile dvs. vor fi aranjate secvențial. Dacă doriți să redenumiți un fișier, puteți face acest lucru acum. Odată ce sunteți mulțumit de modul în care imaginile sunt denumite, puteți exporta după cum se arată mai jos.

Imaginile dvs. vor fi acum exportate în folderul selectat.


Pasul 8: Redenumiți fișierele (opțional)

În acest moment, poate doriți să redenumiți fișierele. Podul poate face acest lucru destul de repede. Doar deschideți podul, căutați în dosarul dvs., selectați toate imaginile din dosarul respectiv, mergeți la Instrumente> Redenumirea lotului.

Bacsis: Când numiți fișiere, există câteva imagini care necesită nume speciale. Imaginea finală de 600 de pixeli ar trebui să fie numită final.jpg, ar trebui numită versiunea mare a imaginii finale final_large.jpg, iar imaginea de previzualizare de 200x200 ar trebui să fie numită preview.jpg. S-ar putea să doriți să le puneți deoparte astfel încât să nu interfereze cu procesul de redenumire a loturilor.


Pasul 9: Conversia în JPG și optimizare (opțional)

Acum optmize imaginile pentru web și convertiți-le la fișiere JPG. Vă sugerăm să faceți acest lucru folosind o aplicație capabilă de prelucrare în bloc. Adobe Bridge, Fireworks și Photoshop pot face toate acestea. Vom folosi Bridge în exemplul de mai jos.


Pasul 10: Exportați videoclipul (opțional)

În acest pas opțional, puteți exporta videoclipul pe care l-ați înregistrat și îl puteți furniza cu restul fișierelor. Puteți face acest lucru în mai multe moduri. Puteți să eliminați fișierele audio și să furnizați înregistrări în timp real sau să eliminați sunetul, să accelerați înregistrarea și să înregistrați o melodie nouă care include o narațiune care explică ceea ce faceți.

Bacsis: Asigurați-vă că rupeți fișierele video în părți controlabile. De asemenea, asigurați-vă că imaginile video pe care le furnizați sunt bine editate și că orice sunet pe care îl furnizați este de înaltă calitate. Nu includeți muzică cu materialul video.


Pasul 11: Scrieți codul HTML

Acum puteți începe să scrieți textul și să vă asamblați codul HTML. Utilizați acest șablon pentru a vă formata fișierul HTML. Asigurați-vă că urmați instrucțiunile corespunzătoare de-a lungul drumului.


Trimiteți ceva!

Cam despre asta e! Dacă credeți că sunteți pregătiți pentru a vă trimite ceva și a vă alătura echipei Mactuts +, apăsați pe pagina nouă a autorului pentru mai multe informații despre cum să începeți. De asemenea, asigurați-vă că verificați celelalte site-uri pentru a vedea dacă puteți fi conectat oriunde altundeva.