دوره آموزشی گرافیک SVG برای وب با ایلاستریتور
2 ساعت 3 دقیقهمتوسط2018-08-29
مدرسین
David Karlins
Web Design Expert, Instructor, and Corporate Trainer
جزئیات دوره
فرمت Scalable Vector Graphics (SVG) این روزها در همه جا وجود دارد. SVG برای اینفوگرافیک های مبتنی بر داده، نقشه های تعاملی، نمادها، نوع قابل جستجو، رندرهای معماری و هر جایی که به آثار هنری مقیاس پذیر، متحرک یا تعاملی نیاز دارید استفاده می شود. آیا می خواهید خود را ایجاد کنید؟ Adobe Illustrator محیطی مناسب طراح برای ایجاد فایل های SVG برای وب است. این دوره به شما می آموزد که چگونه فایل های SVG را در Illustrator با کمک گاه به گاه سایر محصولات Adobe Creative Cloud ایجاد، ذخیره و اصلاح کنید. مربی دیوید کارلینز اصول اولیه SVG را پوشش می دهد - اینکه چیست و چگونه از آن استفاده می شود - و نحوه پیکربندی Illustrator برای بهره وری بهینه با SVG را نشان می دهد. او توضیح می دهد که چگونه می توان شفافیت و گرادیان های مقیاس پذیر را ترکیب کرد، فیلترهای SVG را اعمال کرد، تعاملی را اضافه کرد و نوع گرافیکی سبک و قابل جستجو را ایجاد کرد. او همچنین بهترین تنظیمات را برای ذخیره و صادرات آثار هنری شما بهعنوان SVG نشان میدهد و فرآیند جاسازی فایلها یا کدهای SVG را در صفحات وب و برنامهها بررسی میکند.
اهداف یادگیری
فایل های SVG چیست؟
جاسازی فایل های SVG در یک صفحه وب
راه اندازی یک محیط سازگار با SVG در Illustrator
شفافیت و شیب مقیاس پذیر
اعمال فیلترهای SVG
ایجاد پیوندها با نقشه های تصویری قابل برنامه ریزی و مقیاس پذیر
تایپوگرافی SVG
ذخیره به عنوان SVG
صادرات به SVG
انتشار تصاویر SVG Illustrator در وب
اهداف یادگیری
فایل های SVG چیست؟
جاسازی فایل های SVG در یک صفحه وب
راه اندازی یک محیط سازگار با SVG در Illustrator
شفافیت و شیب مقیاس پذیر
اعمال فیلترهای SVG
ایجاد پیوندها با نقشه های تصویری قابل برنامه ریزی و مقیاس پذیر
تایپوگرافی SVG
ذخیره به عنوان SVG
صادرات به SVG
انتشار تصاویر SVG Illustrator در وب
مهارت ها
DreamweaverWeb GraphicsWeb DesignProjectAdobe
سرفصل ها
0. مقدمه
- 01 - SVG از Illustrator به صفحه نمایش
- 02 - آنچه باید بدانید
1. SVG - برای گرافیک وب کم ارزش شده است
- 03 - فایل های SVG چیست؟
- 04 - فایل های SVG همه جا هستند
- 05 - جاسازی فایل های SVG در یک صفحه وب
2. ایجاد یک محیط SVG در Illustrator
- 06 - راه اندازی یک محیط کاری SVG
- 07 - واحدهای اندازه گیری و حالت های رنگی مناسب SVG
- 08 - به حداقل رساندن سکته مغزی
- 09 - ایجاد تابلوهای هنری پسند SVG
3. شفافیت و گرادیان
- 10 - مقدمه ای بر شفافیت و شیب
- 11 - صادرات با پس زمینه شفاف
- 12 - اعمال اثرات شفافیت
- 13 - اعمال گرادیان
4. اعمال فیلترهای SVG
- 14 - فیلترهای SVG در مقابل جلوه های شطرنجی
- 15 - بررسی و اعمال فیلترهای SVG
- 16 - وارد کردن و اعمال فیلترهای SVG
5. Image Maps برای SVG
- 17 - نقشه های تصویری و SVG
- 18 - ایجاد لینک های نقشه تصویری
- 19 - استفاده از پنل SVG Interactivity
6. بهینه سازی تایپوگرافی برای SVG
- 20 - ذخیره نوع به عنوان متن SVG
- 21 - متن در یک مسیر
- 22 - یکپارچه سازی متن و فایل های SVG با کد تولید شده
7. ذخیره به عنوان SVG
- 23 - همگام سازی آثار هنری SVG با اسکریپت ها
- 24 - ذخیره به عنوان گزینه های اولیه SVG
- 25 - ذخیره فایل های SVG با تصاویر شطرنجی
- 26 - گزینه های ذخیره پیشرفته
8. صادرات SVG برای صفحه نمایش
- 27 - زمان صادرات
- 28 - استفاده از گزینه SVG export
- 29 - ویژگی های پیشرفته صادرات SVG
9. صادرات به SVG از فتوشاپ
- 30 - چرا از فتوشاپ استفاده کنید
- 31 - صادرات از فتوشاپ در مقابل ذخیره در ایلاستریتور
- 32 - گردش کار بهینه
10. از ایلاستریتور تا وب
- 33 - تعبیه فایل های SVG در صفحات وب
- 34 - درج SVG با استفاده از عناصر اصلی HTML
- 35 - مش بندی SVG با سبک های CSS
- 36 - درج و ویرایش کد SVG
نتیجه
- 37 - مراحل بعدی