قسمت سوم آموزش ادوبی انیمیت – طراحی وکتور و استفاده از متن و رنگ

AdobeAnimate-Learning2

در قسمت قبلی آموزش نرم افزار ادوبی انیمیت شما با ورودی و خروجی نرم افزار ادوبی انیمیت آشنا شدید و یاد گرفتید که چطور فایل ها با فرمت های مختلف رو به داخل نرم افزار انیمیت فراخوان کنید و خروجی از پروژه تون بگیرید.

در این قسمت از آموزش نرم افزار ادوبی انیمیت با نحوه استفاده از ابزارهای طراحی وکتور، ابزار رنگ و همچنین تایپ متن در محیط این نرم افزار آشنا خواهید شد که می تونید طرح های وکتوری دلخواه خودتون رو پیاده کنید و بنابر نیاز اونو متحرک کنید یا خروجی بگیرید.

شروع به کار طراحـی وکتور در نرم افزار ادوبی انیمیت

برای شروع ابتدا یک محیط با اندازه های دلخواه خودتون (ترجیحا عریض) ایجاد کنید تا وارد فضای کار انیمیت بشین.

طراحی کردن در هر جای نیازمند دقت بالا و حوصله زیاده که پیشنهاد میکنیم برای طراحی در انیمیت و کشیدن اشیاء شما از خطوط شطرنجی Grid ‌استفاده کنید.

برای این کار کافیه روی محیط سفید استیج راست کلیک کنید و مطابق شکل زیر گزینه Show Grid رو فعال کنید.

نمایش Grid

حالا ما قصد این رو داریم که با یه مثال کاربردی نحوه استفاده از ابزار طراحی رو برای شما آموزش بدیم.

در اینجا شما باید لوگوی چ یاب رو به صورت وکتور طراحی کنید.

قدم اول اینه که ابزار Polystar tools  رو از نوار Tools ‌ انتخاب کنید.

حالا در نوار Properties میتونید تنظیمات مربوط به این ابزار رو مشاهده کنید. با کلیک روی Options تعداد ضلع های شکل مورد نظر رو۶ قرار میدیم.

تنظیمات ابزار Polystar tool

توجه کنید که گزینه Object drawing mode رو حتما  Off  کنید.

حالا با فشردن و نگه داشتن کلیک چپ موس و جابجایی موس میتونید یک ۶ ضلعی با اندازه ی متغیر طراحی کنید که متناسب با چهارخونه های Grid  باید اون رو جایگذاری کنید.

به یاد دا{“type”:”block”,”srcIndex”:16,”srcClientId”:”111272a1-53ac-457b-9652-995e51103a82″,”srcRootClientId”:””}شته باشید هر طرحی که در داخل نرم افزار میکشید به حالت برداری یا وکتوری پیاده و اجرا میشه.

 

طراحی وکتور روی grid

هر رنگی که شما از قبل انتخاب کرده بودین ۶ ضلعی شما هم به همون رنگ در خواهد آمد. اما میتونید دوباره شکلتون رو انتخاب کنید و رنگ اون رو تغییر بدید. مثلا رنگ زرد رو ما امتحان کردیم.

قدم بعدی اینه که ما خطوطی روی ۶ ضلعی رسم کنیم تا قسمت های پر و خالی لوگو رو مطابق الگویی که داریم از هم جدا کنیم.

قبل از رسم خطوط گزینه Snap to object  رو از قسمت پایین نوار ابزار Tools  فعال کنید تا خطوطتون منطبق بر روی خطوط Grid بشن.

حالا از ابزار Line tool  استفاده کنید. مطابق تصویر زیر خطوط رو رسم کنید و بعد از اتمام رسم خطوط میتونید Grid رو خاموش و غیر فعال کنید.

وکتور طراحی شده

قدم بعدی حذف کردن قسمت های اضافی طرح هست. مطابق الگو شما باید روی قسمت هایی که بین خطوطی که کشیدین قرار دارن کلیک کنید و بعد با زدن دکمه Delete  روی کیبورد اونارو حذف کنید.

توجه کنید چون شما قبل از کشیدن چند ضلعی Snap to object رو خاموش کردین طراحی شما از حالت یکپارچه خارج شده و به راحتی هر قسمتی که روی اون کلیک میکنید انتخاب میشه و تغییرات شامل حال اون ناحیه از طرح خواهد شد.

وکتور لوگوی چ یاب

قدم اخر در طراحی لوگوی مورد نظر انتخاب رنگ اون هست. ابزار Paint bucket tool ‌رو انتخاب کنید. به قسمت تنظیمات رنگ برین و کد رنگ #E85545 رو که رنگ سازمانی چ یاب هست وارد کنید.

تنظیمات رنگ

خوب حالا طراحی خودتون رو با تصویر اصلی لوگو چک کنید . اگر جایی عیب و ایرادی می بینید اونو برطرف کنید.

طراحی وکتور یک مرورگر اینترنتی

حالا باید یه طرح وکتوری از یک مرورگر رو پیاده سازی کنید. ابتدا بیاین در قسمت Timeline  لایه ای که روی اون داشتید لوگو رو طراحی میکردین مخفی کنید. برای این کار روی دکمه Hide  که به شکل یک چشم در نوار لایه قرار گرفته رو کلیک کنید تا روی اون یه ضربدر پدید بیاد. حالا یه لایه بالای اون ایجاد کنید تا ادامه طراحی ها رو روی لایه جدید ایجاد کنید. برای سهولت در کار لایه های رو نام گذاری کنید.

لایه بندی طرح ها

برای طراحی وکتور مرورگر ابتدا قالب اصلی اون رو با یه مستطیل ایجاد میکنیم. پیشنهاد میکنم Snap to object رو در حالت On قرار بدین.

ابزار Rectangle  رو انتخاب کنید و در قسمت تنظیمات اون Rectangle Option  رو روی عدد ۲۰ قرار بدین. این کار برای اینه که گوشه های مستطیل زاویه دار و گرد ایجاد بشن.

با نزدیک کردن موس در حالت Selection tool  به گوشه های مستطیل هم میتونید زاویه و مقدار قوس اون رو تغییر بدین.

مستطیل با گوشه های منحنی و قابل تغییر

حالا با دوبار کلیک روی مستطیل و انتخاب قسمت های بالا و میانی اون رنگ اون قسمت ها رو تغییر بدین. دوبار روی صفحه خالی استیج کلیک کنید تا از حالت تغییر مستطیل خارج بشین. دوباره یه مستطیل سفید رنگ اینبار داخل مستطیل قبلی میکشیم.

وکتور مرورگر اینترنتی

حالا با ابزارهایی مثل Rectangle و Line و Pen یکم به شکلتون شاخ و برگ ببخشید و اونو جذاب تر کنید.

کامنت

استفاده از متن در نرم افزار ادوبی انیمیت

برای اینکه بتونید متنی که میخواید رو در طراحی بیارید باید از ابزار Text tool استفاده کنید. کافیه روی حرف T کیبورد کلیک کنید. در قسمت تنظیمات مربوط به نوشتار نوع فونت و اندازه اون رو انتخاب کنید و حالا با کلیک بر روی صفحه میتونید هر متنی رو تایپ کنید. ترجیحا یک لایه جدید برای متنتون ایجاد و روی اون تایپ کنید.

اگر دقت کنید متون انگلیسی بدون مشکل تایپ میشن ولی اکثرا برای تایپ متن فارسی به مشکل برخواهید خورد.

برای حل این مشکل دو راهکار وجود داره. یکی استفاده از نرم افزارهای جانبی که قابلیت تایپ فارسی رو به ما میدن هست مثل نرم افزار رویا و نرم افزار مریم. کافیه داخل اونا متنتون رو تایپ و سپس اون رو در محیط نرم افزار انیمیت کپی کنید.

راه بعدی اینه که در قسمت تنظیمات ابزار متن حالت Anti – alias  رو روی Use device font ‌ قرار بدین و ملاحظه خواهید کرد که بعد از تایپ کردن و کلیک روی استیج متن شما بدون مشکل نمایش داده خواهد شد. فقط دقتت کنید که از فونت های استاندارد استفاده کنید.

تنظیمات متن

تا اینجای کار باید تونسته باشین طرحی شبیه به تصویر زیر رو ایجاد کنید.

استفاده از متن فارسی و انگلیسی در طراحی

حالا یک بک گراند برای وکتورتون طراحی کنید. یک مستطیل با حالت رنگ  Linear gradient بکشید.

لایه لوگو رو که از قبل Hidden  کرده بودین روشن کنید و اون رو یه جایی در طرحتون جایگذاری کنید.

ما یه وکتور لپ تاپ از قبل طراحی شده رو به داخل استیج Import  کردیم و با قرار دادن لایه اون زیر وکتور مرورگر و جایگذاری مرورگر داخل اون طرحمون رو جذاب تر کردیم. شما هم میتونید از طراحی های قبلی خودتون یا طرح های آماده استفاده کنید.

طرح نهایی رو ملاحظه می کنید.

وکتور لپ تاپ

آموزش این قسمت هم به پایان رسید و با ابزار طراحی وکتور و همچنین استفاده از متن و رنگ در انیمیت آشنا شدید. شما میتونید سوالات و نظرات خودتونو با ما در میان بزارید. در قسمت بعدی ساخت انواع سیمبل و مدیریت کتابخانه در نرم افزار ادوبی انیمیت رو باهم کار خواهیم کرد.

راستی، برای مطلع شدن از آخرین مطالب ما و همچنین دسترسی به موضوعات بیشتر، در کانال تلگرام چ‌ یاب عضو شوید.

اشتراک با:
من رو با خبر کن!
guest
0 دیدگاه
Inline Feedbacks
مشاهده همه نظرات
0
میدونید که نظر شما برامون مهمه! برامون بنویسید ...x
()
x