آموزش Illustrator : طراحی آیکن های اندروید – قسمت دوم

آموزش Illustrator : طراحی آیکن های اندروید – قسمت دوم

توی این آموزش، طراحی آیکن های اندروید رو با Illustrator با هم می بینیم و با ابزارها و تکنیک های مورد نیاز آشنا میشیم. بیاین ادامه بدیم!

با ” آموزش Illustrator : طراحی آیکن های اندروید ” با ما همراه باشید…

• سطح سختی: مبتدی
• مدت آموزش: 60 تا 80 دقیقه
• نرم افزار استفاده شده: Adobe Illustrator

” آموزش Illustrator : طراحی آیکن های اندروید – قسمت اول “

گام سوم

شروع می کنیم به تنظیم شکلی که قبلا درست کردیم. اول از همه، Alt+Ctrl+Y رو فشار داده و Pixel Preview Mode رو فعال می کنیم. بعد هم چند تا Anchor Point به لبه پایین اون اضافه می کنیم. اون ها رو 10 پیکسل از هم فاضله میدیم. برای این کار از ابزار Add Anchor Point کمک می گیریم.

وقتی تمام شد، Alt+Ctrl+Y رو یک بار دیگه فشار داده و به این ترتیب، Pixel Preview Mode رو غیر فعال می کنیم.

گام چهارم

Anchor Point پایین سمت چپ رو با استفاده از ابزار Direct Selectio انتخاب کرده و اون رو با استفاده از ابزار Move، به اندازه 8 پیکسل به صورتی که می بینین، جا به جا می کنیم. برای این کار، کلیک راست کرده و وارد مسیر Transform > Move > Vertical میشیم و عدد 8 پیکسل رو توی فیلد Distance وارد می کنیم.

گام پنجم

می خوایم شکل رو به Outline تبدیل کنیم. برای این کار، Fill رو با Stroke جا به جا می کنیم. به این منظور، میانبر Shift+X رو فشار میدیم. بعد هم Weight رو روی 4 پیکسل و Corner رو روی Round Join قرار میدیم.

گام ششم

یک مستطیل 10 در 4 پیکسل رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم. بعد هم اون رو در محلی که می بینین قرار میدیم و 4 پیکسل از بالا و سمت چپ فاصله میدیم.

گام هفتم

می خوایم یک خط پهن تر اضافه کنیم. یک مستطیل 20  در 4 پیکسل رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم. این خط رو درست مثل قبل، 4 پیکسل از چپ و لبه پایینی خط قبلی فاصله میدیم.

وقتی این کار تمام شد، تمام شکل ها رو انتخاب کرده و با زدن میانبر Ctrl+G اون ها رو با همدیگه درست مثل قبل گروه می کنیم.

گام هشتم

Ctrl+C, Ctrl+F رو فشار داده و شکل رو کپی می کنیم. روی اون کلیک راست کرده و وارد مسیر Transform > Reflect > Vertical میشیم. بعد هم اون رو سمت راست دایره قرار میدیم و 18 پیکسل از لبه سمت راست دایره فاصله میدیم.

گام نهم

برای تکمیل آیکن، خطوط متن رو در محل تلاقی این دو شکل، حذف می کنیم. این طوری 4 پیکسل فاصله باقی می مونه. برای این کار، یک Anchor Point جدید به لبه بالا و سمت چپ اضافه کرده و بعد هم بقیه رو حذف می کنیم.

وقتی این کار انجام شد، تمام اجزای آیکن رو انتخاب کرده و با زدن میانبر Ctrl+G، اون ها رو با همدیگه گروه می کنیم.

8. طراحی آیکن زنگ هشدار

گام اول

یک دایره 88 پیکسلی رسم می کنیم. کد رنگی #ffc107 رو براش در نظر می گیریم و اون رو در وسط مربع قرار میدیم.

گام دوم

برای طراحی بدنه اصلی ساعت، یک دایره 40 پیکسل رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم و اون رو در محلی که می بینین قرار میدیم و 20 پیکسل از لبه پایینی فاصله میدیم.

گام سوم

شکلی که درست کردیم رو به Outline تبدیل می کنیم. یعنی جای Fill و Stroke رو درست مثل قبل، عوض می کنیم. وارد پنل Stroke میشیم و Weight رو روی 4 پیکسل قرار میدیم.

گام چهارم

ابزار Pen رو برداشته و عقربه های ساعت رو رسم می کنیم. Stroke Weight رو روی 4 پیکسل قرار میدیم و کد رنگی #ffffff رو بهش اختصاص میدیم. Corner رو روی Round Join قرار داده و 4 پیکسل بین انتهای Anchor Point و لبه دایره فاصله میدیم.

گام پنجم

چند پیکسل رو به سمت بالا جا به جا می کنیم. یک مستطیل 8 در 6 پیکسل با کد رنگی #ffffff رسم می کنیم. اون رو در وسط قرار میدیم. نتیجه به صورت زیر در میاد.

گام ششم

یک مستطیل 16 در 4 پیکسل اضافه می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم. اون رو در محلی که می بینین قرار میدیم. بعد هم تمام اجزا رو با همدیگه گروه می کنیم.

توصیه می کنم دوره های جامع فارسی مرتبط با این موضوع آریاگستر رو مشاهده کنید:

– صفر تا صد آموزش ایلاستریتور

گام هفتم

برای تکمیل آیکن، چند تا خط مورب به صورتی که می بینین با استفاده از 4px Stroke رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم. وقتی تمام شد، تمام شکل ها را با همدیگه گروه می کنیم.

9. طراحی آیکن تصاویر

گام اول

یک دایره 88 پیکسلی رسم می کنیم. کد رنگی #ff6f00 رو براش در نظر می گیریم. این از پس زمینه این آِکن جدید.

گام دوم

برای طراحی بدنه اصلی آیکن، یک مربع 36 پیکسلی رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم. اون رو در محلی که می بینین قرار میدیم و 20 پیکسل از بالا فاصله میدیم.

گام سوم

با عوض کردن Fill و Stroke، شکل رو به Outline تبدیل می کنیم. بعد هم وارد پنل Stroke میشیم. Weight رو روی 4 پیکسل و Corner رو روی Round Join قرار میدیم.

گام چهارم

با استفاده از ابزار Pen، یک خط افقی رسم می کنیم. Wtroke رو روی 4 پیکسل قرار داده و کد رنگی #ffffff رو براش در نظر می گیریم. اون رو 4 پیکسل از لبه شکل پایینی فاصله میدیم.

گام پنجم

یک Stroke 4px با کد رنگی #ffffff درست می کنیم. Corner رو روی Round Join قرار میدیم. اولین کوه رو رسم می کنیم. به این ترتیب که اولین Anchor Point رو سمت چپ تصویر قرار میدیم. اون رو 10 پیکسل از لبه چپ فاصله میدیم.

دومین Anchor Point رو هم با فاصله 10 پیکسل رسم می کنیم. نتیجه رو در زیر می بینین.

گام ششم

دومین کوه کوچک رو رسم می کنیم. این کار رو با استفاده از یک Stroke 4px با کد رنگی #ffffff انجام میدیم. بعد هم تمام شکل ها رو با همدیگه گروه می کنیم.

گام هفتم

یک مستطیل 28 در 6 پیکسل رسم می کنیم. کد رنگی #ffffff رو براش در نظر می گیریم و اون رو در محلی که می بینین قرار میدیم و به صورت زیر تنظیم می کنیم.

شکل رو به Stroke 4px تبدیل می کنیم. Corner رو میزاریم روی Round Join. بعد هم یکAnchor Point به وسط لبه بالایی اضافه کرده و شکل رو به صورت زیر در میاریم.

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

 نتیجه

امیدواریم ” آموزش Illustrator : طراحی آیکن های اندروید ”  برای شما مفید بوده باشد…

توصیه می کنم دوره های جامع فارسی مرتبط با این موضوع آریاگستر رو مشاهده کنید:

– صفر تا صد آموزش ایلاستریتور

توجه : مطالب و مقالات وبسایت آریاگستر تماما توسط تیم تالیف و ترجمه سایت و با زحمت فراوان فراهم شده است . لذا تنها با ذکر منبع آریا گستر و لینک به همین صفحه انتشار این مطالب بلامانع است !

دوره های آموزشی مرتبط