diff --git a/07/README-fa.md b/07/README-fa.md
new file mode 100644
index 0000000..86d6eb5
--- /dev/null
+++ b/07/README-fa.md
@@ -0,0 +1,231 @@
+
+
+## اشکال
+
+بالاخره! برای این لحظه آماده شده ایم، شما بیشتر مبانی و توابع GLSL را آموخته اید. معادلات شکلی دهی را تمرین کرده اید، اکنون زمان جمع بندی است. شما برای این چالش آماده هستید! در این قسمت شما نحوه رسم اشکل ساده را بصورت موازی می‌آموزید.
+
+### مستطیل
+
+تصور کنید کاغذی شبکه ای مانند آنچه در کلاس ریاضیات داشتیم در اختیار داریم، و تکلیف ما رسم مربع است، اندازه کاغذ 10*10 و مربع باید 8*8 باشد. شما چه کار خواهید کرد؟
+
+
+
+شما به جز سط های اول و اخر و ستون اول و آخر همه را رنگ می‌زنید، اینطور نیست؟
+
+این مثال چه ربطی به شیدر ها دارد؟ هر مربع کوچک از کاغد شبکه مان مانند یک ترد(پیکسل) است. همچنین هر مربع کوچک مانند صفحات شطرنج مختصات خودر را می‌داند. در قسمت های قبلی ما رنگ های قرمز و سیز را به مقادیر x,y مپ کردیم، و یاد گرفتیم چگونه در مسائل دو بعدی از مقادیر بین 0.0 تا 1.0 استفاده کنیمو چگونه میتوان از این موضوع برای ترسیم یک مربع در وسط صفحه کنوس استفاده کرد؟
+
+بیایید با استفاده از دستورات شبه کد شروع کنیم، یعنی دستورات if را در آن قسمت های مکانی استفاده کنیم. اصول انجام این کار به طرز چشم گیری شبیه سناریوی کاغذ شبکه ای است.
+```glsl
+if ( (X GREATER THAN 1) AND (Y GREATER THAN 1) )
+ paint white
+else
+ paint black
+```
+
+حالا که می‌دانیم چگونه کار میکند بیاید بجای استفاده از دستور شرطی از [`step()`](../glossary/?search=step) استفاده کنیم, و همچنین بجای استفاده از 10*10 از مقادیر بین 0.0 و 1.0 استفاده کنیم.:
+
+```glsl
+uniform vec2 u_resolution;
+
+void main(){
+ vec2 st = gl_FragCoord.xy/u_resolution.xy;
+ vec3 color = vec3(0.0);
+
+ // Each result will return 1.0 (white) or 0.0 (black).
+ float left = step(0.1,st.x); // Similar to ( X greater than 0.1 )
+ float bottom = step(0.1,st.y); // Similar to ( Y greater than 0.1 )
+
+ // The multiplication of left*bottom will be similar to the logical AND.
+ color = vec3( left * bottom );
+
+ gl_FragColor = vec4(color,1.0);
+}
+```
+
+تابع [`step()`](../glossary/?search=step) پیکسل های زیر 0.1 را به سیاه تبدیل میکند (`vec3(0.0)`) و بقیه تبدیل به سفید می‌شوند (`vec3(1.0)`) . ضرب بین left و bottom مانند عمکرد اند کار میکند، جایی که هردو باید 1.0 باشند، 1.0 برمی‌گرداند. این عمل باعث کشیدن دو خط در پایین و سمت چپ کنوس میشود..
+
+
+
+در کد قبلی ما ساختار را برای قسمت پایین و چپ تکرار کردیم. میتوان با پاس دادن یک بردار دو بعدی یه [`step()`](../glossary/?search=step) چند خط در کد صرفه جویی کنیم. به این شکل خواهد شد:
+
+```glsl
+vec2 borders = step(vec2(0.1),st);
+float pct = borders.x * borders.y;
+```
+
+تا الان فقط دو حاشیه پاین و چپ مستطیل را رسم کرده ایم. بیایید دو مورد دیگر را هم انجام دهیم. کد زیر را بررسی کنید. :
+
+
+
+خطوط 21 و 22 را از کامنت خارج کنید و دقت کنید که چگونه مختصات St را معکوس کردیم و عملکرد Step را بصورت مشابه روی آن اعمال شد. در این حالت `vec2(0.0,0.0)` بالا سمت راست کنوس خواهد بود. این یک مثال دیجیتالی از برگرداندن ورق کاغذ و استفاده مجدد عملیات است..
+
+
+
+توجه کنید در خط 18 و22 تمام طرفین در هم ضرب می‌شوند که معادل نوشتن عبارت زیر است:
+
+```glsl
+vec2 bl = step(vec2(0.1),st); // bottom-left
+vec2 tr = step(vec2(0.1),1.0-st); // top-right
+color = vec3(bl.x * bl.y * tr.x * tr.y);
+```
+
+جالب بود؟ این تکنک تماما در مورد استفاده از[`step()`](../glossary/?search=step) و ضرب و برگرداندن مختصات است.
+
+قبلا از ادمه دادن سعی کنید تمرینات زیر را انجام دهید:
+
+* اندازه و نسبت مستطیل را تغییر دهید.
+
+* با استفاده از همین کد از [`smoothstep()`](../glossary/?search=smoothstep) بجای [`step()`](../glossary/?search=step) استفاده کنید. توجه کنید با تغییر مقادیر می‌توانید از لبه های بلوری به حاشیه های صاف و ظریف بروید.
+
+* عملیات دیگری انجام دهید که از [`floor()`](../glossary/?search=floor) استفاده کند.
+
+* یک شکل مورد علاقه خود را پیاده سازی کنید، و تابعی در آن ایجاد کنید که در آینده هم بتوانید از آن استفاده مجدد کنید، عملکرد خود را انعطاف پذیر و کارامد کنید.
+
+* ِک تابع دیگر بسازید که فقط اضلاع مستطیل را نمایش دهد..
+
+* فکر می‌کنید چگونه میتوان مستطیل های بیشتری در بیلبورد قرار داد و آن ها را متحرک ساخت? اگر راهش را پیدا کردید ترکیبی از مستطیل ها و رنگ های مختلف شبیه نقاشی [Piet Mondrian](http://en.wikipedia.org/wiki/Piet_Mondrian) بکشید.
+
+
+
+### دایره ها
+
+ترسیم مربع و مستطیل روی کاغذ شبکه و مختصات دکارتی آسان بود. اما دایره ها به روشی دیگر احتیاج دارند، به خصوص که ما الگوریتمی لازم داریم که روی هر پیکسل به صورت جدا اجرا میشود. یک را این است که مختصات را تغییر دهیم و با تابع[`step()`](../glossary/?search=step) برای ترسیم دایره استفاده کنیم.
+
+چگونه? بیایید برگردیم به کلاس ریاضی و کاغذ شبکه ای مان, زمانی که پرگار را به اندازه شعاع دایره مان باز می‌کردیم, یکی از نقاط پرگار را به وسط دایره فشار می‌دادیم و بقیه را در امتداد آن دایره می‌چرخاندیم.
+
+
+
+در شیدر ما برای هر پیکسل این سوال را می‌پرسیم، که آیا این پیکسل یا همان ترد در داخل منطقه دایره مورد نظر ما هست یا خیر. این کار را با محاسبه فاصله پیکسل تا مرکر دایره میتوان انجام داد..
+
+
+
+راه های زیادی برای محاسبه فاصله وجود دارد. راحت ترین آن استفاده از [`distance()`](../glossary/?search=distance) است, که همان طول [`length()`](../glossary/?search=length) بین دو نقطه را محاسبه میکند (در مثال ما فاصله بین پیکسل مورد نظر و مرکز دایره). تابع `length()` کوتاه شده [hypotenuse equation](http://en.wikipedia.org/wiki/Hypotenuse) است که از جزر ([`sqrt()`](../glossary/?search=sqrt)) استفاده میکند.
+
+
+
+برای محاسبه فاصله می‌توانید از هر کدام از [`distance()`](../glossary/?search=distance), [`length()`](../glossary/?search=length) یا [`sqrt()`](../glossary/?search=sqrt) استفاده کنید. کد زیر حاوی هر 3 این عملکرد ها است، همانطور که پیش بینی می‌کنید هر یک نتیجه مشابهی را بر می‌گردانند.
+
+* خطوط را از حالت کامت خارج کنید و روش های دیگر را کامنت کنید تا نتیجه یکسان را مشاهده کنید .
+
+
+
+در مثال قبلی فاصله پیکسل تا مرکز کنوس میزان روشنایی را ترسیم میکند. هرچه پیکسل به مرکز نزدیکتر باشد، مقدار آن تیره و کمتر است. توجه کنید که مقادیر خیلی زیاد نمی‌شوند زیرا فاصله یک پیکسل از مرکز حداکثر کمی بیش از 0.5 است. این راه را در نظر بگیرید و فکر کنید:
+
+* چه چیزی از آن می‌توانید استنباط کنید?
+
+* چگونه از این روش برای کشیدن دایره میتوان استفاده کرد?
+
+* کد بالا را طوری تغییر دهید که تمام گرادیان دایره داخل کنوس باشد..
+
+### Distance field
+
+میتوان مثال بالا را مانند یک نقشه ارتفاع در نظر گرفت، جایی که هر چه تاریک تر باشد یعنی بلند تر است. گرادیان تولید شده الگویی مانند مخزوط را به ما نمایش می‌دهد، خود را در بالای آن مخروط در نظر بگیرید، فاصله افقی تا لبه ی مخروط برابر 0.5 است، این عدد از همه جهات ثابت است، با انتخاب محل برش مخروط، میتوان یک دایره در آن سطح بدست آورد..
+
+
+
+اساس ما برای ساخت اشکال از تفسیر مجدد فضا در این مثال بر اساس فاصله تا مرکز، استفاده میکنیم. این تکنیک بعنوان“distance field” و به روش های گوناگون در outLine فونت ها تا گرافیک سه بعدی از آن استفاده میشود.
+
+تمرین های زیر را انجام دهید:
+
+* از تابع [`step()`](../glossary/?search=step) استفاده کنید تا همه چیز بیش تر از 0.5 را به سفید و کمتر از 0.5 را به سایه 0.0 تبدیل کند.
+
+* رنگ بکگراند و فورگراند را عوض کنید.
+
+* از تابع[`smoothstep()`](../glossary/?search=smoothstep), با مقادیر مختلف استفاده کنید تا یک مرز نرم برای دایره بسازید.
+
+* وقتی ار نتیجه راضی بودید، از آن یک تابع بسازید تا بعدا بتوانبد استفاده کنید.
+
+* به دایره رنگ اضافه کنید.
+
+* آیا می‌تواندی مانند یک قلب تپنده، دایره خود را کوچک و بزرگ کنید؟ می‌تواندی از انیمیشن های فصل قبل الهام بگیرید.
+
+* آیا می‌توانید دایره را حرکت دهید؟ اضافه کردن دایره های بیشتر چطور؟
+
+* اگر فیلد فاصله را با عملکرد های دیگر ترکیب کنید چه اتفاقی می‌افتد؟
+
+```glsl
+pct = distance(st,vec2(0.4)) + distance(st,vec2(0.6));
+pct = distance(st,vec2(0.4)) * distance(st,vec2(0.6));
+pct = min(distance(st,vec2(0.4)),distance(st,vec2(0.6)));
+pct = max(distance(st,vec2(0.4)),distance(st,vec2(0.6)));
+pct = pow(distance(st,vec2(0.4)),distance(st,vec2(0.6)));
+```
+
+* با استفاده از این تکنیک سه ترکیب بسازید، اگر به حالت انیمیشنی باشد که چه بهتر!
+
+#### جعبه ابزار
+
+ بار محاسباتی تابع [`sqrt()`](../glossary/?search=sqrt) و توابعی که از آن استفاده می‌کنند، زیاد است. این یک راه دیگر برای ساخت فیلد فاصله دایره ای با استفاده از ضرب داخلی [`dot()`](../glossary/?search=dot) است.
+
+
+
+### فواید دیگر فیلد(میدان) فاصله
+
+
+
+با استفاده از فیلد فاصله تقریبا میتوان هر چیزی کشید. مشخصا هر جه شکل پیچیده تر باشد@ معادله آن پیچیده تر خواهد بود، اما وقتی فرمول فیلد فاصله برای رسم یک شکل را بدست آورید، خیلی ساده میتوان آن را با افکت های دیگر ترکیب یا اضافه کرد، مانند لبه های نرم یا outLine ها . برای همین استفاده از فیلد فاصله در ردر کردن فونت ها بسیار رایج است, مانند [Mapbox GL Labels](https://blog.mapbox.com/drawing-text-with-signed-distance-fields-in-mapbox-gl-b0933af6f817), [Matt DesLauriers](https://twitter.com/mattdesl) [Material Design Fonts](http://mattdesl.svbtle.com/material-design-on-the-gpu) و [as is described on Chapter 7 of iPhone 3D Programming, O’Reilly](http://chimera.labs.oreilly.com/books/1234000001814/ch07.html#ch07_id36000921).
+
+نگاهی به کد زیر بیاندازید.
+
+
+
+برای شروع مختصات را به مرکز انتقال دادیم و برای مپ کردن مقادیر بین 1 و -1 آن را به نصف فشرده کردیم. همچنین در خط 24 ما فیلد فاصله را با استفاده از تابع [`fract()`](../glossary/?search=fract) نشان می‌دهیم، این تابع پترن ساخته شده را راحتر به نماش می‌گذارد. الگوی میدان فاصله مانند حلقه های باغ zen مکررا تکرار می‌شوند.
+
+بیایید نگاهی به فرمول فاصله فیلد در خط 19 بیاندازیم. در آنجا ما فاصله تا مکان (.3و.3) را در هر چهار ربع مختصات محاسبه میکنیم (به همین علت از قدر مطلق [`abs()`](../glossary/?search=abs) استفاده کردیم).
+
+اگر خط 20 را از کامنت خارج کنید، ترکیب تابع فاصله با این چهار نقطه به همراه[`min()`](../glossary/?search=min) استفاده کردیم و الگویی جالب را بدست آوردیم.
+
+حال خط 21 را از کامنت خارج کنید، همان کار را انجام می‌دهیم اما اینبار توسط تابع [`max()`](../glossary/?search=max) . نتیجه مستطیل هایی با گوشه های خمیده است. توجه کنید که حلقه ها هر چه دورتر هستند، نرم تر می‌شوند.
+
+خطوط 27 تا 29 را یک به یک از حالت کامنت خارج کنید و کاربرد های مختلف الگوی فاصله فیلد را درک کنید..
+
+### اشکال قطبی
+
+
+
+در فصل رنگ ها با محاسبه شعاع و زاویه مختصات دکارتی را به قطبی تبدیل کردیم، از فرمول زیر استفاده کرده بودیم:
+
+```glsl
+vec2 pos = vec2(0.5)-st;
+float r = length(pos)*2.0;
+float a = atan(pos.y,pos.x);
+```
+
+در اول این فصل از قسمتی از این فرمول برای رسم دایره استفاده کردیم. با استفاده از [`length()`](../glossary/?search=length) فاصله پیکسل تا مرکز را محاسبه می‌کردیم. حالا که در مورد فیلد فاصله می‌دانیم، میتوان از راه دیگری برای رسم اشکال در مختصاب قطبی استفاده کرد.
+
+این روش کمی محدود کننده، اما بسیار ساده است. این روش از تغییر شعاع دایره بسته به زاویه برای رسم اشکال مختلف استفاده میکند. اما چگونه؟ با استفاده از توابع شکل دهی.
+
+در مثال زیر همان توابع در مختصات دکارتی را در مختصات قطبی مشاهده ، در خطوط 21 تا 25.می‌کنید . یک به یک خط ها را از حالت کامنت خارج کنید، به رابطه بین مختصات های مختلف توجه کنید.
+
+
+
+
+
+سعی کنید:
+
+* این اشکال را انیمیت کنید.
+* توابع مختلف شکل دهی را ترکیب کنید تا برشی وسط شکل بتوانید ایجاد و اشکالی مثل گل، دانه برف و چرخ دنده ایجاد کنیدو
+* از تابع `plot()` که در فصل توابع شکل دهی ساختیم استفاده کنید تا فقط حد فصل دور اشکال را رسم کنید.
+
+### ترکیب قدرت ها
+اکنون که با استفاده از [`atan()`](../glossary/?search=atan) یاد گرفتیم چگونه شعاع دایره را با استفاده از زاویه آن تنظیم کنیم و اشکال مختلف بسازیم, حال میتوان از `atan()` با فیلد فاصله استفاده کرد و تکنیک های که یاد گرفیم روی آن استفاده کرد..
+
+این ترفند از لبه های چند ضلعی برای ساخت فیلد فاصله با استفاده از مختصات قطبی استفاده میکند. [این کد](http://thndl.com/square-shaped-shaders.html) از [Andrew Baldwin](https://twitter.com/baldand) را نگاهی بیاندازید.
+
+
+
+* با استفاده از این مثال تابعی ایجاد کنید، که مقدار گوشه ها و موقعیت یک شکل را دریافت و یک فیلد فاصله برگرداند.
+
+* فیلد های فاصله را با استفاده از [`min()`](../glossary/?search=min) و [`max()`](../glossary/?search=max) با هم ترکیب کنید.
+
+* یک لوگو هندسی را انتخاب کنید، و سعی کنید آن را با استفاده از فیلد فاصله بسازید.
+
+تبریک! بخش سختی را گذراندید! کمی استراحت منید و اجازه دهید این مفاهیم جا بیوفتد، ساخت اشکال در نرم افزار Processing آسان است، ولی اینجا خیر. در سرزمین شیدر ها طراحی شکل پیچیده است، و سازگاری با این الگوی جدید می‌تواند طاقت فرسا باشد!.
+
+در آخر این صفحه به شما [PixelSpirit Deck](https://patriciogonzalezvivo.github.io/PixelSpiritDeck/) معرفی شده. این کارت ها به شما توابع شکل دهی را بخوبی یاد می‌دهند, compose them into your designs and use on your shaders. از آن ها در طرح ها و شیدر های خودتان استفاده کنید. این دسته کارت دارای یک منحنی یادگیری تدریجی است. بنابر این تمرین کردن یک کارت در هر روز می‌تواند تا 30 روز شکا را به چالش بکشد.
+
+اکنون که می‌دانید چگونه اشکال را رسم کنید، مطمئنم ایده های جدید در ذهنتان ایجاد میشود. در فصل بعدی، نحوه حرکت، چرخش و مقیاس پذیری اشکال را خواهید آموخت. و امکان ترکیب انان را خواهید داشت.
diff --git a/08/README -fa.md b/08/README -fa.md
new file mode 100644
index 0000000..28d016e
--- /dev/null
+++ b/08/README -fa.md
@@ -0,0 +1,101 @@
+## ماتزیس های 2D
+
+
+
+### انتقال
+
+در قسمت های قبل یاد گرفتیم چگونه اشکل مختلف بسازیم - ترفند برای حرکت دادن اشکال، حرکت دادن خود محور های مختصا است. می‌تاون با اضافه کردن یک بردار به ```st``` که مقدار محل هر پیکسل را در خود نگه داشته است، این ترفند را انجام داد. با این کار تمام فضای محتصاتی حرکت میکند.
+
+
+
+دیدن شکل بالا آسان تر از توضیح است، پس خودتان ببینید.:
+
+* خط 35 را از حالت کامن خارج کنید، تا ببینید چگونه فضا خود به خود حرکت میکند.
+
+
+
+حالا تمرین زیر را انجام دهید:
+
+* از ```u_time``` همراه با توابع شکل دهی، طوری استفاده کنید، که شکل بالا به طور جالبت تری حرکت بکند. حرکت خاصی که در نظر دارید را جستجو کنید و سعی کنید حرکت شکل بالا را مثل آن شبیه یازی کنید. ایده گرفتن از حرکات دنیای واقعی می‌تواند مفید باشد، مثلا حرکت آونگ، توپ، شتاب گرفتن ماشین یا توقف دوچرخه..
+
+### چرخش
+
+برای چرخاندن یک شکل، باز هم نیاز است تمام فضا را بچرخانیم. برای اینک کار از [matrix](http://en.wikipedia.org/wiki/Matrix_%28mathematics%29) استفاده میکنیم. ماتریس مجموعه ای متشکل از اعداد در سطر ها ستون هاست بردار ها با قوانین خاصی در ماتریس ها می‌توانند ضرب شوند تا مقادیر آن بردار اصلاح و عوض شود..
+
+[](https://en.wikipedia.org/wiki/Matrix)
+
+در GLSL پشتیبانی از ماتریس های 2و 3 و 4 بعدی تعبیه شده است: [```mat2```](../glossary/?search=mat2) (2x2), [```mat3```](../glossary/?search=mat3) (3x3) and [```mat4```](../glossary/?search=mat4) (4x4). همچنین GLSL از ضرب ماتریس ها پشتیبانی میکند (```*```) همچنین از تابع خاص ماتریسی ([```matrixCompMult()```](../glossary/?search=matrixCompMult)).
+
+بر اساس رفتار ماتریس ها، می‌توانیم ماتریس هایی تولید کنیم که رفتار هاصی انجام می‌دهند، مثلا از ماتریس میتوان برای حرکت یک بردار استفاده کرد :
+
+
+
+جالب تر اینکه از یک ماتریس برای چرخش سیستم مختصات می‌توانیم استفاده کنیم:
+
+
+
+به تابعی که چرخش دو بعدی را انجام می‌دهد نگاهی بیاندازید، این تابع برای چرخص مختصات حول نقطه 0و0 از فرمول فوق پیروی میکند [formula](http://en.wikipedia.org/wiki/Rotation_matrix) .
+
+```glsl
+mat2 rotate2d(float _angle){
+ return mat2(cos(_angle),-sin(_angle),
+ sin(_angle),cos(_angle));
+}
+```
+
+با توجه که روش که در رسم اشکال داشتیم، این دقیقا آن چیزی نیست که میخواهیم. شکل ضربدری ما در مرکز کنوس کشیده شده است، پس قبل از چرخواندن فضا باید شکل را از مرکز به نقظه 0و0 انتقال دهیم، فضا را بچرخوانیم، سپس در نهایت شکل را به مکان اصلی آن برگردانیم.
+
+
+
+مانند کد زیر:
+
+
+
+تمرین های زیر را انجام دهید:
+
+* خط 45 را از حالت کامنت خارج کنید و ببینید چه اتفاقی در حال رخ دادن است.
+
+* انتقال در خط های 37 و 39 را قبل و بعد از چرخش را مانت کنید و ببینید چه اتفاقی می‌افتد.
+
+* برای بهبود انیمیشن در در تمرین انتقال، از چرخش استفاده کنید.
+
+### اندازه
+
+دیدم که چگونه ماتریس ها کمک به جابه جایی و چرخش در فضا کمک می‌کنند. (یا به طور دقیق تر، انتقال سیستم مختصات برای چخرش و انتقال.) اگر با نرم افزار های سه بعدی یا توابع push و pop در نزم افزار processing کار کرده باشید، می‌دانید که ماتریس ها برای تغییر اندازه اشکال هم استفاده می‌شوند.
+
+
+
+طبق فرمول قبلی میتوان نحوه ساخت ماتریس مقیاس دو بعدی را فهمید::
+
+```glsl
+mat2 scale(vec2 _scale){
+ return mat2(_scale.x,0.0,
+ 0.0,_scale.y);
+}
+```
+
+
+
+تمرینات زیر را انجام دهید تا عمیق تر نحوه عملکرد آن را متوجه شوید..
+
+* خط 42 را از کامنت خارج کنید و تغییرات فضای مختصات را مشاهده کنید.
+
+* کد های انتقال در خطوط 37 و 39 را کامنت کنید و ببینید چه اتفاقی رخ می‌دهد.
+
+* سعی کنید ماتریس انتقال را با ماتریس اندازه(مقیاس) ترکیب کنید، توجه داشته باشید که ترتیب مهم است. ابتدا ماتریس ها را با هم ضرب کنید و سپس آنان در برداز ضرب کنید.
+
+* حالا که نحوه کشیدن و انتقالو چرخش شکل های مختلف را می‌دانید، وقت آن است که یک شیدر ترکیبی با آن ها بسازید. یک UI مثل [fake UI or HUD (heads up display)](https://www.pinterest.com/patriciogonzv/huds/) بسازید. از این مثال داخل shader toy هم می‌توانید ایده و انگیزه بگیرید [Ndel](https://www.shadertoy.com/user/ndel).
+
+
+
+### سایر کاربرد های ماتریس: YUV رنگ
+
+[YUV](http://en.wikipedia.org/wiki/YUV) یک فضای رنگی است، که برای رمز گذاری آنالوگ عکس و فیلم آز آن استفاده میشود، که برای کاهش پهنای باند رنگی از دامنه درک انسان استفاده میکند.
+
+کد زیر این عملیات ماتریسی را در GLSL برا تبدیل رنگ ها از حالتی به حالت دیگر نشان می‌دهد.
+
+
+
+همانطور که می‌بینید با رنگ ها مانند بردار رفتار میکنیم و آنان را در هم ضرب میکنیم به این صورت ما مقادیر را به اطراف منتقل میکنیم.
+
+در این قسمت یاد گرفتیم، چگونه با استفاده از ماتریس ها انتقال، تغییر مقیاس و چرخش انجام دهید. این انتقال ها برای ساخت ترکیب هایی از شکل های که قبلا آموختیم ضروری خواهند بود. در فصل بعد از آنچه تا کنون آموختیم برای ساخت پترن های رویه ای procedural patterns استفاده خواهیم کرد، و متوجه خواهید شد تکرار و تغییر کد نویسی می‌تواند یک تمرنی هیجان امگیز باشد.
diff --git a/09/README-fa.md b/09/README-fa.md
new file mode 100644
index 0000000..5355ce0
--- /dev/null
+++ b/09/README-fa.md
@@ -0,0 +1,120 @@
+## الگو ها
+
+از آنجا که شیدر ها پیکسل هب پیکسل اجرا می‌شوند@ مهم نیست که چقد یک شکلر ا تکرار کنید. محاسبات ثابت است. انی به معنی این است که شیدر ها برای الگو ها و پترن های تکرار شونده مناسب هستند.
+
+[  ](../edit.php#09/dots5.frag)
+
+در ایم فصل قصد داریم آنچه تا کنون آموخته ایم را بکار ببریم و در امتداد کنوس اشکال را تکرار کنیم. مانند فصل های قبلی استراتژی ما مبتی بر عملیات رو مختصات فضای بین 0.0 و 1.0 است، به این ترتیب شکل هایی که بین 0.0 و 1.0 کشیده بودیم تکرار می‌شوند.
+
+*"شبکه بندی چارچوبی را فراهم میکند که به انسان ها قدرت شهود و اختراع می‌دهد. در هرج و مرج های الگو های طبیعی هم یک انعطاف و نظم نهفته است، از الگو هایاولیه روس سفال گرفته تا موزاییک های هیندسی در حمام های رومی، مدت هاست مردم از شبکه ها برای بهبود و تزئیین زندگی خود استفاده می‌کنند "* [*10 PRINT*, Mit Press, (2013)](http://10print.org/)
+
+بیایید اول تابع [```fract()```](../glossary/?search=fract) را بیاد بیاوریم. قسمت اعشاری یک عدد را بر می‌گرداند, ```fract()``` مانند ([```mod(x,1.0)```](../glossary/?search=mod)) است. به عبارت دیگر, [```fract()```](../glossary/?search=fract) عدد بعد از نقطه اعشار را بر می‌گرداند. سیستم محتصات نرمالایز شده ما (```st```) بین 0.0 و 1.0 است، پس منطقی نیست همچین کاری انجام دهم:
+
+```glsl
+void main(){
+ vec2 st = gl_FragCoord.xy/u_resolution;
+ vec3 color = vec3(0.0);
+ st = fract(st);
+ color = vec3(st,0.0);
+ gl_FragColor = vec4(color,1.0);
+}
+```
+
+اما اگر سیستم مختصات را به بالا اسکیل کنیم - مثلا سه برابر - ما سه توالی درون خطی بین 0و1 داریم: اولی بین 0و1 است, بعد از آن مریوط به نقاط شناور بین 1 و 2 و همچنین بعد از آن نقاط شناور بین 2 و 3.
+
+
+
+ حال وقت آن است با برداشتن خط 27 در هر زیر فضا، شکلی ترسیم کنیم. (از آنجا که x,y ما به یک اندازه ضرب می‌شوند، نسبت ابعاد فضا تغییری نمی‌کند و اشکال مطابق انتظار تغییر می‌کنند.)
+
+برخی از تمرینات زیر را امتحان کنید تا درک عمیق تری پیدا کنید:
+
+* فضا را در اعداد مختلف ضرب کنید، با مقادیر اعشاری و همچنین مقادیر مخلف برای x و Y.
+
+* از عملکرد فوق، تابعی که قابل استفاده مجدد باشد بسازید.
+
+* فضا را به سه ردیف و سه ستون تقسیم کنید، راهی پیدا کنید که بفهمید هر ترد در کدام ستون و ردیف است، از آن برای تغییر شکل و نشان دادن آن استفاده کنید. سعی کنید شکل یک مسابقه دوز را بسازید
+
+### اعمال ماتریس داخل الگو ها
+
+از آنجا که هر سلول نسخه کوچکتری ار سیستم مختصات نرمال شده است، میتوان مثل قبل برای چرخش و انقال از ماتریس ها استفاده کرد..
+
+
+
+* به روش های جال برای متحرک سازی این الگو ها فکر کنید، رنگ و شکل و و حرکت را می‌توانید انیمیت کنید، سه انیمیشن متفاوت بسازید.
+
+* با ترکیب اشکل مختلف الگو های پیچیده تر را از نو بسازید.
+
+
+[](../edit.php#09/diamondtiles.frag)
+
+* لایه های محتلف پترن را با هم ترکیب کنید و سعی کنید [الگوی اسکاتلندی](https://www.google.com/search?q=scottish+patterns+fabric&tbm=isch&tbo=u&source=univ&sa=X&ei=Y1aFVfmfD9P-yQTLuYCIDA&ved=0CB4QsAQ&biw=1399&bih=799#tbm=isch&q=Scottish+Tartans+Patterns) خود را بسازید.
+
+[  ](http://graphicriver.net/item/vector-pattern-scottish-tartan/6590076)
+
+### جابجایی الگو ها
+
+فرض کنیم میخواهیم یک دیوار آجری بساطیم. با نگاه کردن به دیوار می‌فهمید هر ردیف، نصف اندازه آحر جابهجا شده است چگونه می‌توانمی انی کار را انجام دهیم?
+
+
+
+برای اولین قدم باید بفهمیم ردیف ترد ما یک عدد زوج است یا فرد. چون می‌توانیم با دانستن آن، مقدار x را در آن ردیف جابجا کرد.
+
+____دو پاراگراف بعدی را با کمک هم باید اصلاح کنیم____
+
+برای تعیین این که نخ ما در ردیف زوج یا فرد است از تابع باقیمانده [```mod()```](../glossary/?search=mod) بر عدد 2 استفاده میکنیم و سپس مشاهده کنیم که آیا نتیجه زیر 1.0 است یا خیر. به فرمول زیر نگاهی بیاندازید و دو خط آخر را از حالت کامنت خارج کنی.
+
+
+
+همانطور که در خط دوم مثال بالا دیدید، می‌توانیم از [اپراتور سه گانه](https://en.wikipedia.org/wiki/%3F:) استفاده کنیم و چک کنیم اگر [```mod()```](../glossary/?search=mod) بر 2 زیر 1 است یا بطور مشابه در خط سوم از تابع [```step()```](../glossary/?search=step) استفاده کنیم, روش دوم سریع تر است، اما چرا? اگرچه دانستن عملیات اجرا و بهینه سازی هر نوع کارت گرافیک دشوار است، اما توابع داخلی سریعتر اجرا می‌شوند هر موقع می‌توانستید از توابع داخلی استفاده کنید، حتما بجای کد های ظرطی از آنان استفاده کنید.
+
+بنابراین اکنون که فرمول اعداد فرد خود را داریم، میتوان برای ردیف های فرد عملیات جابه جایی را انجام دهیم، خط 14 در مثال زیر جایی است که ردیف های فرد را شناسایی میکنیم و آنان را یک واحد جابجا میکنیم. توجه داشته باشید که برای ردیف های زوج نتیجه عملکرد ما 0.0 است و ضرب 0.0 در مقدار جابه جایی 0.5 هیچ مقداری را جابجا نمی‌کند. اما در ردیف های فرد با ضرب 1.0 در مقدار جابجایی 0.5، آن ردیف را در محوز مختصات 0.5 واحد جابجا میکنیم.
+
+حال سعی کنید خط 32 را از کامنت خارج کنید، این کار نسبت ابعاد مختصات را می‌کشد تا شکل آجر مانند را تقلید کند. با خارج کردن حالت کامنت خط 40 می‌توانید ببینید چگونه سیستم مختصات به رنگ قرمز و سبز ترسیم شده است.
+
+
+
+* سعی کنید جابجایی را بر حسب زمان متحرک سازی کنید.
+
+* انیمیشن های دیگری بسازید که ردیف های زوج به سمت چپ و ردیف های فرد به سمت راست حرکت کنند.
+
+* آیا این کار را برای ستون ها می‌توانید انجام دهید?
+
+* سعی کنید جابجایی در X و y ها ترکیب کنید و چیزی مثل شکل زیر بسازید:
+
+
+
+## کاشی های Truchet
+
+حال که می‌توانیم بفهمین سلولمان در ردسفو ستون زوج است یا فرد, پس بسته به موقعیت سلول ها میتوان یک طراحی واحد را چندین بار استفاده کرد. الگوی [Truchet Tiles](http://en.wikipedia.org/wiki/Truchet_tiles) را در نظر بگیرید، که در آن از یک عنصر طراحی واحد میتوان به چهار روش زیر استفاده کرد:
+
+
+
+با تغییر الگو در میان کاشی ها، میتوان مجموعه ای بینهایت از طرح های مختلف و پیچیده ساخت.
+
+
+
+به تابع```rotateTilePattern()``` خوب دقت کنید, که چگونه فضا را به چهار سلول تقسیم میکند و به هر کدام زاویه چرخشی اختصاص می‌دهد.
+
+
+
+* خط های 69 تا 72 را از حالت کامنت خارج کنید، تا طرح های جدید را ببینید.
+
+* الگوی مثلث سیاه و سفید را با الگویی دیگیر مثل نیم دایره، مربع یا خطوط تغییر دهید.
+
+* الگو های دیگری که عناصر آن با توجه به موقعیتشان می‌چرخند بسازید.
+
+* الگویی بسازید که سایز خواص را با توجه به موقعیت سلول ها تغییر دهد.
+
+* به چیز دیگری فکر کنید. چیزی که لزوما الگویی و پترنی نباشد تا بتوانید اصول این بخش را کمل یاد بگیرید چیزی مثل:. (Ex: I Ching hexagrams)
+
+
+
+## قوانین خودتان را بسازید
+
+ایجاد الگو های رویه ای یک نوع تمرین ذهنی برای یافتن حداقل عناصر قابل استفاده مجدد است، این یک عمل قدیمی است; انسان ها برای مدت طولانی است که از شبکه ها و الگو ها برای تزئین پارچه، کف زمین و اطراف اشیا استفاده می‌کردند: از الگو های داری پیچ و خم در یونان باستان، تا طراحی مشبک چینی، لذت تکرار و تغییر عناصر، چشم ما را جلب میکند. نگاهی به [decorative](https://archive.org/stream/traditionalmetho00chririch#page/130/mode/2up) [patterns](https://www.pinterest.com/patriciogonzv/paterns/) بیاندازید و ببینید که چگونه هنرمندان و طراحان سابقه طولانی در پیمیاش مرز بین قابل پیش بینی بودن و تنوع و هرج و مرج دارند. از الگو های هندسی عربی گرفته تا طرح های پارچه ای و زیبای آفریقایی، الگو های زیادی برای یادگیری وجود دارد.
+
+
+
+با اتمام این فصل درس های ما در مورد الگوریتم های شکل دهی پایان یافت، در فصل های بعد می‌موزیم چگونه برخی آنتروپی ها را به شیدر خورد اضافه کنیم و طرح های مولد تولید کنیم.