وقتی فتوشاپ کم آورد، یک ابزار کوچک ساختم

داستان ساخت Slicer Image Pro — یک پروژه وایب کدینگ اما کاملاً کاربردی

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

از اونجایی که میخواستم به عنوان نمونه کار بذارمش توی سایت مجبور بودم که فایل رو به چندتکه تقسیم کنم تاهم حجمش کمتر بشه و هم توی لود سایت مشکلی ایجاد نشه و تصاویر به صورت Lazy Load بتونن لود بشن . کاربر هم سریع بتونه پروژه رو ببینه

معمولا این کار تکه کردن تصاویر رو با ابزار Slice فتوشاپ انجام میدادم اما این دفعه قضیه فرق یکرد. ارتفاع صفحه خیلی زاد بود و فتوشاپ برای اینکه خودکار تصیم بندی کنه و بهت خروجی بده حداکثر ارتفاع حدود 8000 پیکسل رو ساپورت میکرد. خلاصه اینکه نمیشد با فتوشاپ انجام داد.

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

مسئله دقیقاً چی بود؟

وقتی با تصاویر بلند کار میکنی خروجی گرفتن و تقسیم کردن تصویر به قطعات دلخواه خیلی سخت میشه. مقلا اگر بخوای هر 1000 پیکسل تقسیم بشن واقعا سخته. علاوه بر اینها من باید تصاویر رو برای گذاشتن توی سایت بهینه میکردم و بهترین کیفیت رو با کمترین حجم میگرفتم. یعنی باید از فرمت ها Webp یا AVIF استفاده کنم.

تازه به اینها دردسر های مدیریت و نامگذاری تصاویر خروجی رو هم اضافه کنین و اینکه مجبور بودم از چند ابزار آنلاین و آفلاین استفاده کنم که خودش مصیبت داشت.

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

از نیاز واقعی تا ساخت ابزار

اینجا بود که Slicer image متولد شد. البته توی نسخه دوم یکم بهبود دارم و یک Pro هم چسبوندم آخرش که خفن به نظر برسه.

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

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

• میتونی بگی برش رو در عرض یا ارتفاع یا هر دو بزنه
• میتونی بگی بر اساس تکه باشه یا بر اساس پیکسل
• میتونی بگی PNG, JPG, AVIF,WEBP باشه
• میتونی بگی چقدر کیفیت داشته باشه

چرا این یک پروژه «وایب کدینگ» بود؟

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

گاهی بهترین پروژه ها همونهایی هستن که قرار نیست بزرگ باشن یا دنیا رو تکون بدن. اما مشکل رو حل میکنن و دقیقن.

دانلود Slicer Image Pro

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