عصاره فتوشاپ: تولید گرافیک موبایل بر روی Afterburner انجام می شود

01 از 08

دارایی های استخراج شده چیست؟

یک کامپوننت را در فتوشاپ ایجاد کنید.

ویژگی جدید Extract Assets از فتوشاپ CC 2014 یک فایروال در زمینه گردش کار ایجاد تصویر برای طراحی وب سایت Responsive Web Design (RWD) است. بیایید نگاهی به چگونگی فرمان Extract Assets می توانیم در عرض چند دقیقه یک صفحه وب وب را به دارایی های مونتاژ آماده کنیم.

بیایید با یک پرسش واضح شروع کنیم: دارایی های استخراج چیست؟

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

بیا شروع کنیم.

02 از 08

فایل PSD فتوشاپ را باز کنید

ما با یک صفحه وب آماده در فتوشاپ شروع می کنیم.

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

03 از 08

دو راه برای استخراج دارایی

استخراج دارایی ها را می توان در منوی File و یا با کلیک راست بر روی یک لایه یافت.

بر خلاف Generate، که همچنین از یک افزونه گرافیکی برای نام لایه استخراج می کند ، Extract Assets از رابط کاربری استفاده می کند که می توان با کلیک راست بر روی یک لایه یا انتخاب یک لایه و انتخاب File> Extract Assets را پیدا کرد .

04 از 08

اینترفیس دارایی عصاره

کادر محاوره ای دارایی عصاره

کادر محاوره ای دارایی عصاره نسبتا بصری است. شما لایه یا انتخابی را برای استخراج نشان داده اید. در بالای آن شما اندازه فایل ها را نشان داده اید و در زیر آن کنترل است که به شما اجازه می دهد که روی جسم بزرگنمایی کنید. سمت راست جعبه محاوره جایی است که جادو اتفاق می افتد. چهار دکمه در بالای صفحه به شما امکان می دهد رزولوشن / اندازه شی را انتخاب کنید. نوار بعدی لایه انتخابی شما را نشان می دهد و با کلیک روی علامت + شما می توانید لایه انتخاب شده را در فرمت دیگری نیز نمایش دهید. Trash Ca n لایه را از صف حذف می کند. در نوار بعدی، می توانید نوع فایل را انتخاب کنید و می توانید عرض و ارتفاع تصویر خروجی را تنظیم کنید.

05 از 08

استخراج یک تصویر SVG

استخراج یک تصویر SVG

فتوشاپ تصاویر SVG را تمام نمیکند و مرورگرها و دستگاهها نمیتوانند یک تصویر Illustrator را نمایش دهند. این به افزایش فایل های svg که برای آثار هنری بردار مانند لوگو Illustrator که در اینجا نشان داده شده است منجر شده است. در حالتی که بردارها، رزولوشن آنها مستقل از دستگاه است، آنها می توانند بدون کم شدن جزئیات یا تصویر کوچک شوند. برای تبدیل Illustrator Smart Object به svg، svg را از پاپ پایین انتخاب کنید و بر روی Extract کلیک کنید.

06 از 08

فرآیند دارایی عصاره

تصاویر در یک پوشه در همان نقطه به عنوان تصویر PSD قرار می گیرد.

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

07 از 08

دکمه تنظیمات بهترین دوست جدید شما است

قطعنامه مربوط به دستگاه

با کلیک بر روی دکمه تنظیمات یک جعبه تنظیمات باز می شود که به طور جدی مفید است. تنظیمات در سمت چپ، عوامل مقیاس گذاری هستند. آنچه که آنها انجام می دهند، کپی های مختلف تصویری است که یک توسعه دهنده در نمایش داده های رسانه ای برای تعیین یک وضوح صفحه دستگاه خاص استفاده می کند. به عنوان مثال، نسخه 3x می تواند به یک صفحه نمایش شبکیه چشم آیفون یا آی پد هدف قرار داده شود در حالی که 1.25 عامل در یک دستگاه آندروید اشاره کرد. پسوند به انتهای نام فایل اضافه می شود تا طراح اجازه دهد تا به راحتی تصویر مورد نظر را در یک درخواست رسانه ای شناسایی کند. پس از اتمام کار، روی دکمه OK کلیک کنید و انتخاب شما در قسمت Extract Assets در کادر محاوره ای ظاهر می شود. شما همچنین می توانید با کلیک کردن روی نماد چرخ دنده در قسمت Extract Assets در سمت راست رابط، به تنظیمات دسترسی پیدا کنید

08 از 08

پایان دادن به

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

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