D.j.a.y: [[Category* ---> {{Category* : The romanian tutoriel was listed in the tutorials' main page

2012-05-14T10:09:49Z

[[Category* ---> {{Category* : The romanian tutoriel was listed in the tutorials' main page

Ed62 at 07:22, 3 May 2012

2012-05-03T07:22:04Z

Ed62: /* The s's and f's: Intelegerea barei pentru timp */

2012-03-23T18:55:17Z

‎The s's and f's: Intelegerea barei pentru timp

Ed62: /* Setarea spatiului de lucru */

2012-03-23T18:53:19Z

‎Setarea spatiului de lucru

Ed62: /* Introducere */

2012-03-23T08:54:19Z

‎Introducere

Ed62 at 08:52, 23 March 2012

2012-03-23T08:52:31Z

Ed62: Created page with " {{Title|Animation Basics}} {{Navigation|Category:Manual|Doc:Adding Layers}} Category:Manual Category:Tutorials Category:Tutorials Basic [[Category:..."

2012-03-23T08:47:44Z

Created page with " {{Title|Animation Basics}} {{Navigation|Category:Manual|Doc:Adding Layers}} Category:Manual Category:Tutorials Category:Tutorials Basic [[Category:..."

New page

{{Title|Animation Basics}}
{{Navigation|Category:Manual|Doc:Adding Layers}}
[[Category:Manual]]
[[Category:Tutorials]]
[[Category:Tutorials Basic]]
[[Category:Updated]]


== Introducere ==

Crearea unei animatii in Synfig Studio este simpla. Se rezuma doar la modificarea unui desen — e suficient sa creati prima si ultima scena, iar Synfig va realiza pasii intermediari.

Sa realizam un exemplu simplu: o lumina care se misca. Va trebui sa realizam un cerc care se misca de la stanga la dreapta si inapoi. Altfel zis, vom creea trei 'pasi' sau 'scene':

# Cercul se afla la stanga.
# Cercul se afla la dreapta.
# Cercul revine la stanga.

@@ Line 58: / Line 58: @@
 [[Image:Keyframes Panel 2.png|center|frame]]
-== The s's and f's: Intelegerea barei pentru timp ==
+== Secundele (seconds) si cadrele (frames): Intelegerea barei pentru timp ==
 Sa vedem ce inseamna marcajele de tip "1s 10f". Acestea indica un anumit punct pe bara timpului, exprimat in secunde (s) si cadre (f).

← Older revision		Revision as of 18:53, 23 March 2012
Line 19:		Line 19:

	== Setarea spatiului de lucru ==		== Setarea spatiului de lucru ==
		+
		+	Deschidem aplicatia Synfig Studio. Automat este creat un fisier nou. Click pe meniul 'caret' (care se afla la intersectia riglei orizontale cu cea verticala, in partea din stanga sus a spatiului de lucru), apoi selectam {{c\|Edit\|Properties}}. Va fi afisata fereastra de dialog {{l\|Canvas_Properties_Dialog}}.
		+
		+	Dati un nume si o descriere pentru spatiul de lucru, apoi click pe {{Literal\|Apply}} (inca nu dati click pe {{Literal\|OK}} — inca nu am terminat cu fereastra de dialog Properties). In eticheta {{Literal\|Time}} modificati {{Literal\|End Time}}, de la "5s" la "2s" — acest lucru va face ca animatia sa dureze doar doua secunde.
		+
		+	[[Image:File Properties Dialog - End Time.png\|center\|frame\|Canvas Properties Dialog]]
		+
		+	Acum dati click pe "OK", selectati instrumentul {{l\|Rectangle Tool}} si creati un dreptunghi negru care va servi ca fundal. nu este necesara acoperirea intregului spatiu de lucru.
		+
		+	[[Image:synfig_tut_2.png\|450px\|center\|thumb]]
		+
		+	Acum vom desena cercul. Modificati culoarea de umplere la rosu, selectati instrumentul {{l\|Circle Tool}} si creati un cerc. Nu conteaza cat de perfect este: acesta poate fi editat ulterior. Selectati instrumentul {{l\|Transform Tool}} si dati click pe cerc. Astfel comutati in mod editare - apare un punct mic de culoare verde in mijlocul obiectului selectat si un patrat (alb) in jurul acestuia. Puteti muta cercul prin tragerea punctului verde (''Originea'') care se afla in mijlocul acestuia.
		+
		+	[[Image:synfig_tut_3.png\|450px\|center\|thumb]]
		+
		+	Acestia sunt primii pasi pentru desenarea si mutarea unui obiect, dar inca nu am realizat animatia. Sa vedem cum functioneaza.
		+
		+	== Adaugarea miscarii ==
		+
		+	La inceput, am introdus o valoare de 2 secunde in fereastra de dialog Properties. Datorita faptului ca animatia este non-zero, fereastra spatiului de lucru (locul unde desenati) are un cursor gri pentru timp in partea de jos, pe bara pentru timp - {{l\|Timebar}}. Cu click pe bara, va apare un mic indicator portocaliu care indica pozitia in timp. Cu click in diferite locuri pe bara timpului se observa ca in campul din stanga barei se modifica valorile - de ex "12f", "1s 15f", etc. Se poate seta pozitia in bara pentru timp modificand valorile din acel camp. De exemplu, daca tastati "1s" si apasati {{Shortcut\|enter}}, indicatorul portocaliu se va muta la mijlocul barei de timp, iar tastand "2s" il va muta la sfarsitul barei pentru timp (in acest caz, animatia a fost setata la doar doua secunde).
		+
		+	{{Note\|Nota\|La doua secunde, indicatorul portocaliu nu va mai fi vizibil. Asta pentru ca "2s" se afla chiar la marginea din dreapta barei pentru timp, loc unde indicatorul nu mai este vizibil.}}
		+
		+	Vei observa ca nu se modifica nimic pe spatiul de lucru in acest moment. Comutati in modul {{l\|Animate Editing Mode}} cu click pe butonul verde care reprezinta un om - din dreapta barei pentru timp. Spatiul de lucru va afisa un contur rosu; aceasta pentru a va atentiona ca modificarile la obiecte vor afecta animatia la timpul afisat pe bara timpului.
		+
		+	In modul de editare a animatiei, orice modificare a obiectelor creeaza un punct de referinta {{l\|Waypoint\|waypoint}} care asociaza modificarile in spatiu cu timpul curent. Dupa cum veti vedea, Synfig poate creea modificari line intre punctele de referinta si se poate alege si modul in care vor avea loc acele modificari. Este utila si asocierea unor sau tuturor punctelor de referinta cu cadrele-cheie respective - {{l\|Keyframe\|keyframes}}.
		+
		+	[[Image:synfig_tut_4.png\|450px\|center\|thumb]]
		+
		+	Mai sus au fost men’ionati trei "pasi" sau "scene". Acestia sunt reprezentati de cadre-cheie - {{l\|Keyframe\|keyframes}}. (In cayul in care sunteti familiarizati cu “video encoding”: Nu este acelasi lucru!) Aici, un cadru-cheie este o imagine in timp unde se petrece ceva important cu obiectele de pe spatiul de lucru.
		+
		+	In caseta {{l\|Keyframes_Panel}} — click pe eticheta mica care are ca si pictograma o cheie - in partea de jos a ferestrei — pentru a edita cadrele-cheie. Acum apasati pe butonul mic care are semnul "plus" si veti obtine o noua valoare in lista, ceva de genul {{Literal\|0f, 0f, (JMP)}}.
		+
		+	[[Image:Keyframes Panel.png\|center\|frame]]
		+
		+	Acum, reveniti la primul marcaj "1s" de pe bara timpului. Micul indicator portocaliu ar trebui sa sara in acel loc. Apoi adaugati un alt cadru-cheie cu click pe semnul plus. Repetati operatia, avand indicatorul la "2s" (la finalul animatiei). Ar trebui sa aveti acum trei cadre-cheie in lista.
		+
		+	[[Image:Keyframes Panel 2.png\|center\|frame]]
		+
		+	== The s's and f's: Intelegerea barei pentru timp ==
		+	Sa vedem ce inseamna marcajele de tip "1s 10f". Acestea indica un anumit punct pe bara timpului, exprimat in secunde (s) si cadre (f).
		+
		+	Implicit, fiecare secunda este impartita in 24 de cadre, asa cum un metru este impartita in 100 de centimetri. Marcajele pentru cadre incep de la zero (0) si merg pana la 24, de unde incepe o noua secunda pe bara timpului, iar numaratoarea cadrelor reincepe de la zero.
		+
		+	De exemplu, dupa ce au trecut 5 secunde si trei cadre, notatia de pe bara timpului este "5s 3f".
		+
		+	== Caseta pentru cadrele-cheie ==
		+
		+	Caseta {{l\|Keyframes Panel}} este simpla. Afiseaza timpul - {{Literal\|Time}} care contine timpul de incepere, lungimea animatiei - {{Literal\|Length}}, salturile - {{Literal\|Jump}} pana la urmatoarea scena si descrierea - {{Literal\|Description}}.
		+
		+	Inregistrarile numite {{Literal\|(JMP)}} functioneaza ca si legaturile de pe o pagina web: la click pe acestea, indicatorul din bara timpului va sari la timpul corespunzator.
		+
		+	Acestea pot fi folosite pentru editarea imaginii la un moment dat in timp. De exemplu, puteti sari la prima secunda si sa mutati cercul rosu la dreapta. Iata! Ati realizat prima miscare si prima animatie cu Synfig!
		+
		+	{{l\|Image:synfig_tut_5.png\|center\|frame}}
		+
		+	Acum dati click pe o pozitie oarecare de pe bara timpului: observati ca cercul rosu se va deplasa intr-o alta pozitie pe care nu ati specificat-o! Deci, ce s-a intamplat? Synfig a mutat cercul si a desenat toate imaginile intermediare dintre cele doua cadre-cheie. Fiecare imagine va constitui mai tarziu un cadru in animatie, iar cercul va parea ca se misca.
		+
		+	Retineti ca nu este necesar sa mergeti la ultimul cadru de la "2s" si sa mutati cercul inapoi in partea stanga. Cadrele-cheie il fac pe Synfig sa retina starile imaginii la momente diferite. De aceea, cand am modificat pozitia cercului la "1s", acesta a ramas nemiscat la "2s" (aceeasi pozitie ca la "0s"). Daca reveniti la caseta cu parametri - Params Panel si priviti la caseta {{l\|Timetrack Panel}}, veti vedea trei romburi portocalii (sau puncte verzi in versiunile anterioare ale Synfig) care apar in dreapta paremetrului {{Literal\|Origin}}. Acestea sunt numite {{L\|Waypoints}} si reprezinta la acel timp parametrii fiecarui obiect, cum ar fi locatie sau culoare.
		+
		+	[[Image:TimetrackOriginWaypoints.png\|thumb\|center\|450px]]
		+
		+	== Realizarea (randarea) animatiei ==
		+
		+	Inainte de a vedea animatia, aceasta trebuie randata. Acest lucru poate fi facut prin doua moduri: folosind Synfig Studio (aplicatia) sau un program in linie de comanda numit "synfig".
		+
		+	Sa incercam prima metoda. Parasiti modul de editare cu click pe punctul rosu de pe bara timpului si salvati fisierul cu un nume sugestiv. Apoi, din meniul ferestrei Canvas (butonul "caret" din coltul din stanga sus) selectati optiunea {{c\|File\|Render}}. Alegeti ca fisierul randat sa fie de tip .gif ,apoi click pe Render. In functie de viteza procesorului, randarea ar putea dura cateva momente, iar la final, pe bara de stare a ferestrei va apare mesajul de confirmare a operatiei: "File rendered successfully".
		+
		+	[[Image:synfig_tut_6.png\|618px\|thumb\|center\|Calling "Render" from menu in Synfig Studio]]
		+
		+	{{Note\|Nota\|Optiunea "magick++" (daca este valabila) produce fisiere gif optimizate.}}
		+	Apoi puteti deschide fisierul.gif in browser (Firefox sau alta aplicatie) pentru a vedea animatia realizata. Felicitari! Tocmai ati realizat prima animatie!
		+
		+	{{Note\|Nota\|Puteti previzualiza animatia. Apasati pe butonul meniului "caret" din coltul stanga-sus a ferestrei Canvas si alegeti din meniu {{c\|File\|Preview}}.}}
		+	Daca doriti sa folositi linia de comanda in locul randarii cu ajutorul meniului, deschideti un terminal (in Windows, mergeti in {{c\|Start\|Run}}, tastati {{Literal\|cmd}} si apasati {{Shortcut\|enter}}), modificati directorul in care ati salvat fisierul si tastati ceva de genul:
		+
		+	synfig -t gif BasicKnightRider.sifz
		+
		+	Vor apara cateva mesaje de configurare care nu conteaza acum. In functie de viteza procesorului, dupa cateva momente va apare in linia de comanda un mesaj de tipul:
		+
		+	BasicKnightRider.sifz ==> BasicKnightRider.gif: DONE
		+
		+	Apoi puteti vizualiza fisierul gif animat folosind un browser, asa cum am mentionat si mai sus.
		+
		+	== Concluzie ==
		+
		+	Desigur, pozitia unui obiect nu e singurul lucru care poate fi modificat cu Synfig Studio. Exista si alte posibilitati, care includ marimea, conturul, culoarea etc. Synfig vine cu cateva fisiere exemplu care va permit sa analizati mai bine posibilitatile aplicatiei.
		+
		+	Acum sa continuam cu urmatorul capitol din manual: {{l\|Doc:Adding Layers\|Adaugare straturi}}.

@@ Line 12: / Line 12: @@
 Crearea unei animatii in Synfig Studio este simpla. Se rezuma doar la modificarea unui desen &mdash; e suficient sa creati prima si ultima scena, iar Synfig va realiza pasii intermediari.
-Sa realizam un exemplu simplu: o lumina care se misca. Va trebui sa realizam un cerc care se misca de la stanga la dreapta si inapoi. Altfel zis, vom creea trei 'pasi' sau 'scene':
+Sa realizam un exemplu simplu: un cerc alb care se misca pe fundal negru. Va trebui sa realizam un cerc care se misca de la stanga la dreapta si inapoi. Altfel zis, vom creea trei 'pasi' sau 'scene':
 # Cercul se afla la stanga.

← Older revision		Revision as of 08:52, 23 March 2012
Line 17:		Line 17:
	# Cercul se afla la dreapta.		# Cercul se afla la dreapta.
	# Cercul revine la stanga.		# Cercul revine la stanga.
		+
		+	== Setarea spatiului de lucru ==

@@ Line 2: / Line 2: @@
 {{Title|Bazele Animatiei}}
 {{Navigation|Category:Manual|Doc:Adding Layers}}
-[[Category:Manual]]
+{{Category|Manual}}
-[[Category:Tutorials]]
+{{Category|Tutorials}}
-[[Category:Tutorials Basic]]
+{{Category|Tutorials Basic}}
 [[Category:Updated]]
 <!-- Page info end -->