سلام، من جعفر رضائی هستم(sayjeyhi). توی این بلاگ پست، به شکل مختصر میخوام در مورد iconها صحبت کنیم. مسئلهای که خیلی وقتا ما فرانتاند کارا، دیزاینرا یا حتی بکاند کارا باهاش درگیر هستیم و در آخر یه روش باحال و ساده برای مدیریتشون بهتون معرفی میکنم.
اگه رابط کاربری تولید میکنید(حتی مهم نیست برا کدوم پلتفرم) حتما توی هر پروژهای که باهاش کار میکنید یا کار میکردین به آیکونها نیاز داشتین.
این نیاز و درگیری مختص به زمان حال حاضر نمیشه و از قدیم بوده، از پیدا کردن آیکون مناسب تا استفاده کردنش توی پروژه همیشه یه داستانایی داشته. یه سری پروژهها هم برای حل این مسائل به کمکمون اومدن ولی هر کدوم یه سری چالشهایی داشتن.
بزارین اول با بررسی اینکه اصلا icon چیه شروع کنیم. در تعریفی که توی ویکیپدیا اومده، گفته شده که :
In computing, an icon is a pictogram or ideogram displayed on a computer screen in order to help the user navigate a computer system.
خب ترجمه غیر تحت لفظیش میشه: یه تصویر یا ایدئوگرام که روی نمایشگر به مسیر حرکتی کاربر کمک میکنه.
البته مفاهیمی مثل symbol, index و ... هم بعضا برای بیان همین مضمون(تقریبا) به کار میرفت ولی واژه مرسوم همون icon هست.
انسان مدرن امروزی قطعا یه جوری خودشو با icon سازگار کرده بوده و نیازشو رفع میکرده. از اونجایی که جدیدا شهرنشینی آغاز شده بود. مردم از عکس برای قرار دادن icon و حتی خیلی کارهای دیگه استفاده میکردن. منظورم از عکس، اره، مثلا همون تگ img یا css background توی صفحات وب بود. البته واقعا کار سخت و اعصاب خوردکنی بود. توی پروژههای فعلی هم ممکنه نیاز باشه این کارها رو انجام بدیم. ولی خب اینجا سعی میکنیم موارد عمومی که توی اکثر پروژهها نیازه رو بررسی کنیم.
با یه بررسی کلی میبینیم که روشهای مرسومی که بشر برای نمایش iconها استفاده کرده اینا بوده :
حاااالا، بشر اومده یه سایت رایگانی زده که تقریبا هر پکیج مشهور آیکونی که توی بازار بوده رو جمع کرده و سعی کرده مشکلاتی که توی موارد بالا و با هر کدوم از روشهای استفاده از آیکون بوده رو حل کنه و بعلاوه هم برای گرافیست و هم برای کدنویس پلاگینها و پکیجهای از پیش آماده ای رو درست کنه که امکان استفاده بی دغدغه و سریع از آیکونهای مختلف از پکیجهای مختلف رو فراهم کنه. این روش روی پروژههای مختلف ایرانی و خارجی تست شده و امروز هم نسخه دوم سایتش لانچ شده.
نسخه دسک تاپ و موبایلش هم با یه رابط کاربری جذاب برای استفاده روی کامپیوتر، گوشی، pwa و به شکل in-app در نرم افزارهایی مثل فیگما و ادوبی xd بهینهسازی شده و به زودی پشتیبانی این برنامهها هم اضافه میشه.
با بازنشر این نوشته و حمایت از ما، به بشر امروزی کمک کنید.