ساخت آیکون با نرم افزار فلش

  • 1389/3/12
  • سپهر خيري
  • 0

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

اینبار ما میخواهیم آموزش ساخت آیکون توسط نرم افزار فلش را به شما نشان دهیم که میتواند به درد کسانی که وبسایت دارند مفید باشد و برای تزئین سایت خود استفاده کنند.

اول از همه کمی در مورد آیکون ها صحبت میکنیم

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

آیکون ها معمولا در 4 سایز مختلف وجود دارند که پر کاربرد ترین آنها 16در16 ، 32در32 ، 48در48 و  128در128 هستند که با توجه به نوع کار از آنها استفاده میشود.

نوع فرمت های آیکون متفاوت هست که این فرمت ها میتوانند .ICO یا .RGB باشند که معمول ترین آنها فرمت ICO هست که آن در ویندوز ایکس پی و 7 هم استفاده شده است.

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

آموزش

ابتدا نرم افزار فلش Adobe Flash CS3 Professional را باز کنید و در پنجره باز شده گزینه Flash File (ActionScript 2.0) را انتخاب کنید تا صفحه کار مورد نیاز برای شما اجرا شود.

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

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

حال در پنجره Document Properties شما میتوانید تنظیمات مربوط صفحه مثله سایز و اسم آن را تغییر دهید که ما در اینجا فقط با قسمت Dimensions کار داریم. در این قسمت شما باید اندازه دقیق آیکون مورد نظر خود را وارد کنید که همانطور در قبل گفتیم شما میتوانید یکی از این اعداد را انتخاب کنید:

16در16 ، 32در32 ، 48در48 و  128در128

ما در اینجا اندازه 32 در 32 را انتخاب میکنیم و عدد 32 را در 2 کادر سفید روبروی Dimensions وارد میکنیم و روی OK کلیک میکنیم.

بعد از  کلیک روی  دکمه OK میبینید  که صفحه سفید  داخل برنامه  کوچک شده  که میتوانید  برای  بزرگ نمایی از زره بینی  که در ابزار های  فلش موجود هست  استفاده کنید.  این ابزار  در نوار  سمت چپ فلش  موجود هست  و با کلیک  بر روی آن  میتوانید بزرگ نمایی  را انجام دهید  و بعد از بزرگ نمایی  کلید Esc را فشار دهید.

حال بعد از بزرگنمایی میتوانید شروع به کشیدن آیکون مورد نظر خود کنید که به عنوان مثال ما این آیکون ساده را طراحی کردیم :

این تصویری که در بالا میبینید خیلی ساده طراحی شده که شما هم میتوانید به وسیله 2 یا 3 ابزار فلش آن را طراحی کنید. برای اینکار پس از بزرگنمایی مراحل زیر را انجام دهید:

1- روی  گزینه شماره 1 کلیک کنید  و سپس در صفحه سفید  یک مربع بکشید  ، البته قبل  از کشیدن مربع میتوانید رنگ آن را تغییر دهید که برای  تغییر رنگ میتوانید روی گزینه 3 کلیک کنید و رنگ مورد نظر را انتخاب کنید.

2- برای به وسط آوردن مربع کشیده شده میتوانید از قسمت Document Properties که در قبل آن را معرفی کردیم استفاده کنید ، برای اینکار در پنجره Document Properties به قسمت Match بروید و گزینه Contents را انتخاب کنید و روی OK کلیک کنید.

3- حال برای نوشتن یک متن روی مربع باید ابتدا روی گزینه 3 کلیک کنید و سپس ماوس را به وسط مربع آورده و کلیک کنید ، سپس کلمه مورد نظر خود را تایپ کنید و Enter یا Esc را فشار دهید.

همچنین خودتان میتوانید با ایده های در ذهن خود و ابزار های فلش آیکون خود را تزئین کنید.

حال آیکون شما تقریباً کامل شد و حالا باید آن را ذخیره و تبدیل فرمت کنید.

ذخیره آیکون

برای ذخیره آیکون خود باید در گوشه سمت چپ روی گزینه File کلیک کنید و سپس به قسمت Export و Export Image… بروید. سپس یک پنجره باز میشود که باید نام و محل ذخیره سازی و نوع فرمت  را مشخص کنید که ما پیشنهاد میکنیم نوع فرمت را PNG قرار دهید.

بعد از کلیک روی دکمه Save یک پنجره مانند تصویر زیر باز میشود که باید دیگر تغییرات را در آن اعمال کنید.

در پنجره Export PNG باید این چند کار را انجام دهید:

1- روی دکمه Match Screen کلیک کنید تا صفحه آیکون شما تنظیم شود.

2- به قسمت Include بروید و آن را روی گزینه Full Document Size قرار دهید تا آیکون شما کاملاً فیکس و در دیده شود تا قسمت های اضافی به آیکون شما نچسبند.

3- روی دکه OK کلیک کنید و کمی صبر کنید تا آیکون شما ذخیره شود.

حال بعد از انجام این مراحل به سراغ تبدیل فرمت بروید

تبدیل فرمت به آیکون

برای تبدیل عکس به فرمت آیکون چندین راه وجود دارد که ساده ترین آنها روش آنلاین و روش نرم افزاری هست که در این قسمت روش آنلاین را به شما نشان میدهیم.

این روش را قبلا در یک مقاله توضیح داده ایم ولی اینبار میخواهیم یک عکس 32 در 32 را به آیکون 32 در 32 تبدیل کنیم. برای این کار مراحل زیر را انجام دهید:

1- به این آدرس اینترنتی بروید http://www.converthub.com

2- روی گزینه Browse کلیک کنید و عکس PNG را که قبلا با سایز 32 در 32 به وسیله نرم افزار فلش ذخیره کرده اید را انتخاب کنید.

3- به قسمت Convert to بروید و فقط گزینه ICO را فعال کنید و در روبروی آن قسمتی به نام .ico Size: وجود دارد که آن را به گزینه 32×32 تغییر دهید.

4- به قسمت Security Code: بروید و متن داخل تصویر را در کادر سفید رو برو تایپ کنید و سپس روی دکمه Convet کلیک کنید.

5- حال  به پایین صفحه بیایید و روی این گزینه  که در عکس زیر مشخص است کلیک کنید تا آیکون  تبدیل شده را دانلود کنید. اگر آیکون دانلود نشد و نمایش داده شده باید روی آن کلیک راست کنید و آن را در هارد خود ذخیره کنید.

حال آیکون شما کاملاً آماده هست و میتوانید از آن استفاده کنید.

طریقه استفاده از آیکون

برای استفاده از آیکونی که خودتان آن را طراحی و ساخته اید این مراحل را طی کنید:

1- به محل قرار گرفتن آیکون تبدیل شده بروید (منظور از آیکون تبدیل شده همان آیکونی هست که از سایت converthub دانلود کردید) و سپس نام آن را به یک اسم کوتاه مثله test تغییر دهید.

2- فایل و فولدر مورد نظر خود را آماده کنید ، به طور مثال ما در اینجا یک New Folder را برای اینکار انتخاب کردیم.

3- روی فولدر مورد نظر کلیک راست کرده و گزینه Properties را انتخاب کنید ، بعد از کلیک روی Properties یک پنجره باز میشود.

4- در پنجره باز شده همانند عکس زیر به تب Customize بروید.

5- در تب Customize روی گزینه Change Icon کلیک کنید.

6- سپس یک پنجره کوچک باز میشود که باید روی دکمه Browses… کلیک کنید.

7-  حال به محل قرار گرفتن آیکون خود که نوع فرمت آن .ico هست بروید و آن را انتخاب کنید و سپس روی دکمه Open کلیک کنید و در آخر روی دکمه OK کلیک کنید تا پنجره ها بسته شوند.

8- حال اگر تمام مراحل را به درستی انجام داده باشید باید آیکون شما مانند عکس زیر روی فولدر قرار بگیرد.

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

چند نکته در مورد ساخت آیکون ها وجود دارد که در اینجا آنها را ذکر میکنیم:

1- تمام آیکون های  ساخته شده باید  در سایز های  16 در 16 ، 32 در 32 ، 48 در 48 ، 64 در 64 ، 80 در 80 ، 128 در 128 و 256 در 256 باشند  و در غیر اینصورت  آیکون شما یا کار نمیکند  یا به خوبی  مشخص نمیشود.

2- برای تبدیل فرمت فقط از همان روشی که در بالا گفتیم استفاده کنید و به جای آن کار های مثله تغییر اسم را انجام ندهید ، به طور مثال a.PNG را خودتان به صورت دستی به a.ICO تبدیل نکنید ، در غیر اینصورت آیکون شما اصلا کار نمیکند و نمیتوانید از آن استفاده کنید.

3- به جای نرم افزار فلش میتوانید از نرم افزار ها مشابه مثله فتوشاپ هم استفاده کنید ولی پیشنهاد ما همان نرم افزار فلش نسخه Adobe Flash CS3 Professional هست.

4- از این نوع آیکون ها میتوان در سیستم عامل های ویندوز و لینوکس استفاده کرد و لازم نیست که برای لینوکس یک نوع دیگر آیکون بسازید.

5- فقط میتوان از فرمت ICO به عنوان آیکون استفاده کرد و ویندوز دیگر فرمت ها را به عنوان آیکون قبول ندارد.

6- میتوانید به جای طراحی دستی آیکون به وسیله ابزار های فلش یا فتوشاب از عکس های آماده استفاده کنید ، به صورتی که عکس را در فلش کپی کنید و فقط سایز آن را به 32 در 32 تغییر دهید و سپس آن را ذخیره و بعد تبدیل فرمت کنید.

7- از این نوع آیکون ها معمولا برای فولدر ها استفاده میکنند ولی شما میتوان آنها را در سایت خود استفاده کنید. برای این کار ابتدا آدرس آیکون قبلی را پیدا کنید و آیکون ساخته شده خود را جایگزین کنید و به یاد داشته باشد که اسم آن نباید تغییر کند.

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

دیدگاه خود را وارد کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *