اولا این آیکون لایه باز نیست، برای همین اگر قبل از تبدیل یکسان سازی و تفکیک رنگ انجام نشه خروجی خوبی نمیده.
ثانیا فتوشاپ برای تبدیل تصویر به وکتور نرم افزار مناسبی نیست.
سلامی مجدد استاد
خیلی ممنون .
تبدیل به وکتورش کردم
بله درست میگید . برای تفکیک رنگ (تا حدودی) ، این عکس را در 6 لایه (و 6 رنگ متفاوت) ، رنگ آمیزی کردم .هر چند ، وقتی ، تصویر وکتورش ، بزرگ (در ابعاد 512 در 512) هست ، بخاطر اینکه رنگ های زیادی نداره و تفکیک رنگش زیاد نیست (که اغلب تصاویر وکتور این طورن) ، خیلی جالب به نظر نمیرسه (هر چند خیلی هم بد نیست) اما زمانی که کوچیکتر میشه ، خیلی شبیه به آیکون اولش (تصویر png) میشه و این مشکل تا حد بسیار زیادی رفع میشه .
من هم که تصویر با ابعاد کوچیکش مد نظرمه (نهایتا 64 در 64) .
فایده نداره، ولش کنید، اگه از اول وکتوری طراحی اش کنید بهتر از اینه که برای تبدیل اش به وکتور وقت بذارید.
اگر وکتور لازمه باید از اول آیکون وکتوری انتخاب کنید.
بله درست گفتید .
اگه همون بصورت png (یا rasterize) ، فقط رنگش را عوض میکردم ، خیلی زمان کمتری میبرد (سر و ته کار شاید 20 دقیقه هم طول نمیکشید برای ساخت 3 تصویر با 3 رنگ متفاوت) .
اما خوبیِ این وکتور اینه که بعدا ، هر رنگی میتونم بدم و برای تغییر مقدار رنگ هم دستم خیلی بازتر هست . علاوه بر اینکه در scale ئه تصویر هم دستم خیلی بازتر هست .
هر چند در عوض ، تبدیلش برای من که فتوشاپ تقریبا بلد نیستم ، خیلی زمان بیشتری برد (تقریبا نصف روز ، فقط کار اصلیِ تبدیل و با کارهای جانبی ، یک روز یا بیشتر) .
=========================================================
در ادامه ، چون فتوشاپم خیلی ضعیفه ، نکاتی برای تبدیل تصویر به وکتور برای آینده میگم :
1) اول اینکه در تکمیل پست 9 (که اطلاعات SVG ئه لایه ی مورد نظرمون را میگرفتیم) ، حالا اگه بخوایم اطلاعات مختصات (X و Y) ای که اون لایه ، در اون باند قرار داره را دریافت کنیم ، میتونیم روی این لایه (ای که نحوه ی ایجادش در پست 9 توضیح داده شد) ، کلیک راست و گزینه ی Copy CSS را انتخاب کنیم (طبق عکس زیر) :
که اطلاعاتی با فرمت زیر میده :
CSS:
.Vector1_Button_Black_SVG {
background-color: rgb(65, 65, 65);
position: absolute;
left: 27px;
top: 98px;
width: 459px;
height: 379px;
z-index: 3;
}
که در کد بالا ، مقدار left ، همون مختصات X ، و مقدار top ، مختصات Y ئه مربوط به باندِ اون لایه ی مورد نظرمون هست .
==============
2) برای تبدیل تصویر به وکتور که از راهنمای لینک قبلی (لینک زیر) استفاده کردم :
But before we begin, and if you want to follow this tutorial exactly as described, please download the following image from Pixabay. Step 1 Open your image in Photoshop. It does not need to be a Black and White or a Grayscale one, any Color image w...
we.graphics
چند تا ویرایش انجام دادم که برای دفعات بعدی ، مرورش مفیده برام :
اول کار اینکه چون 6 قسمت از این شکل را با رنگ های متفاوت ، رنگ آمیزی کردم ، پس هر بار ، یک قسمت از این 6 قسمت را باید انتخاب کنم و همه ی مراحلی که در لینک بالا توضیح داده شده (با در نظر گرفتن استثناعات و توضیحاتی که در زیر میدم) را برای هر کدوم از این 6 قسمت ، انجام بدم :
1) تنظیمات مربوط به تار شدن (مثل اِعمال فیلترهای Diffuse و Gaussian Blur) را انجام ندادم و روی تصویرم اِعمال نکردم .
شاید بخاطر این باشه که تصویرم مثل تصویر اون سایت ، خیلی پیچیده نیست . به هر حال ، بدون اِعمالِ فیلتر تار شدن ، خروجی تصویرم بهتر بود .
- یعنی مراحل 2 و 3 و 11 را انجام ندادم و پریدم .
2) در مرحله ی 5 ، فیلتر High Pass ، مقدار Redius را روی 20 گذاشتم (انگار هر چی بیشتر بشه ، روی کیفیت خروجی ، بهتر تاثیر میذاره و آخر کار ، کیفیت بهتری درمیاد) .
3) در مرحله ی 6 ، مقدار "Blending Mode" ئه لایه را روی مقدار "Hard Light" گذاشتم .
4) در مرحله ی 8 ، مقدار Threshold Level را فکر کنم روی 97 گذاشتم (دقیق یادم نمیاد) .
5) در مرحله ی 12 ، تنظیمات Color Range ام بصورت زیر بود :
در این قسمت ، بخش Select ، روی مقدار Sampled Color بود (برخلاف اون سایت که روی مقدار Shdow گذاشت) .
این پنل خیلی به تنظیماتش (همین عکس بالا) و همچنین به تنظیمات مراحل قبل وابسته هست .
بعد از این مرحله ، خیلی از قسمت های انتخاب شده ممکنه همونی نباشه که ما میخوایم (حتی یک قسمت خیلی کوچیکی که مورد انتظار ما نیست ممکنه انتخاب بشه) که در این صورت با ابزارهای انتخابی دیگه باید اون قسمت ها را حذف شون کنیم و مهم هست .
=====================================================
فایل مربوط به اطلاعات هر یک از این 6 بخش از فتوشاپ و همچنین کدهای مربوط به WPF برای ساخت این آیکون را در فایل هایی در این پست پیوست میکنم .
تشکر استاد