Adobe Photoshop CS6: нові можливості для web і UI дизайнерів

Наша взаимовыгодная связь https://banwar.org/

Вітаю любий друже! Photoshop CS6 став величезним кроком вперед для web і UI дизайнерів. Сьогодні я поділюся з вами деякими з функцій, які пропонує Photoshop CS6 Beta, і продемонструю, як вони зможуть допомогти у вашій роботі.

Одного ранку я прокинувся, заглянув перевірити twitter-стрічку, і що ж я побачив! Adobe випустив Photoshop CS6 Beta.

Зараз я впевнений, що в той момент був не єдиним перезбуджені з приводу цієї події людиною. Я роботі з Фотошопом кожен день і можливо проводжу з ним більше часу, ніж зі своєю сім'єю. Незабаром я виявив 65 нових функцій і зрозумів, що це кращий апдейт для UI і web дизайнерів.

З моменту випуску останнього апдейта пройшло вже близько двох років, і сьогодні CS6 пропонує вам новий інтерфейс. Видно, що Adobe проявив любов до свого UI, і повинен сказати, що я вражений. У вас є вибір між чотирма кольоровими схемами в сірих тонах. Вибрати відповідну можна в Preferences> Interface.

Найважливіше питання, який я хотів задати Adobe був наступний: "Чому в Фотошопі можна застосувати точкову або пунктирну рамку?". Мабуть, це один з найпопулярніших прийомів, використовуваних в сучасному веб-дизайні. До 22 березня подібну рамку можна було зробити тільки за допомогою нарізки ліній або символу '-'.

Отже, Adobe нарешті таки реалізував цю функцію, яка дозволить вам створити рамки легко і невимушено.

Обведення може бути додана до будь-якої фігури або будь-якого контуру з можливістю застосування наступних опцій:

• Align - Вибір зовнішньої, внутрішньої або центрованої обведення.
• Caps - Ця функція надає вам наступний вибір: обведення з квадратними кінцями, що закінчуються там же, де і контур (Butt Cap), із закругленими кінцями (Round Cap) або з квадратними кінцями, що закінчуються трохи далі, ніж контур (Square Cap).
• Corners - Вибір рівня заокругленості кутів: Milter, rounded і bevel.

Уявіть, що ви тільки що отримали від клієнта ТЗ, яке містить файл PSD. В цей файл містяться 10 папок, і в кожній з них лежить дизайн сторінки для веб-сайту. Це дуже великий файл, і клієнт хоче поміняти шрифт заголовка на кожній сторінці, він також просить вас поміняти розмір шрифту, щоб зробити заголовки легким для читання. Це досить-таки просте прохання, однак щоб здійснити її, доведеться виконати одну / дві речі кілька разів, редагуючи шрифт в одній папці. Все це займе купу часу.

Photoshop CS6 представляє 'стилі заголовків styles', що істотно зменшує час роботи з подібними проханнями. За допомогою стилів заголовків ви можете ефективно маніпулювати з текстом прямо як в CSS. Ви можете призначити теги 'H1-6' і 'p' або будь-який інший стиль. Коли ви створюєте текст, ви можете просто вибрати будь-який стиль в Window> Paragraph Styles.

Часто буває, що найпростіші ідеї стають самими геніальними, і c CS6 це саме той випадок. Скільки разів вам доводилося залишати Фотошоп, щоб скопіювати трохи тексту lorem ipsum ? Тепер вам більше не потрібно цього робити. Ви можете просто вставити lorem ipsum з меню.

Це дуже корисна функція, але, на мій погляд, було б набагато зручніше, якби виконання цієї операції було поставити шорткати.

Якщо ви пов'язані зі створенням і підтримкою веб-сайтів, то напевно ви витрачаєте багато часу, перестрибуючи з Фотошопа на редактор коду, і назад. У попередніх версіях Фотошопа мала місце одна проблема: поле, куди вводиться значення кольору не підтримувала символ решітки (#).

Це призводило до проблем з зіставленням кольорів, що в свою чергу вимагало перевіряти кольору в браузері, редакторі коду і в Фотошопі. У CS6 ця проблема усунена. Дрібниця а приємно.

Це був лише питання часу, коли Фотошоп представить стандартні розміри для девайсів типу iPhone. Ця невелика функція збереже нам трохи часу. На мій погляд, успішний UI або web дизайнер повинен спрощувати свою роботу і виконувати її за найкоротші терміни.

Ще одна функція дозволяє створити дію, яке буде створювати документ з вибраними заздалегідь UI елементами. Наприклад, я створив дію для iPhone, iPad і Android, яке буде автоматично створювати документ і вставляти в нього елементи типу меню, контролерів, напрямних і т.п.

І в web, і в UI дизайні форми явлются дуже важливими елементами. Ми використовуємо їх для банерів, боксів, полів введення і в багатьох інших випадках. Векторні форми «зазнали» дуже важливі зміни в CS6. Давайте поглянемо на них.

• Snap Vector Tools і Transform to Pixel grid. - Цей інструмент був значно поліпшений в CS6 і тепер пропонує можливість прив'язати форми до кордонів пікселів, включаючи інструмент Pen і Ellipse. Це означає, що форми будуть виглядати гладкими і рівними, без загострених кутів. Цю опцію можна включити в Preferences> General
• Вставка атрибутів форм - Натиснувши праву кнопку миші на шар з формою, тепер можна скопіювати атрибути форми (колір і обведення) і вставити його в іншу форму.
• Форми як шари - Раніше в панелі шарів форма виглядала просто як кольоровий квадрат. Тепер ви можете бачити форму, як вона виглядає насправді.
• Ховаємо контур. - Тепер можна заховати контур форми, використавши шорткати Command + shift + H / Ctrl + Shift + H.
• Створюємо форми з заданим розміром. Щоб намалювати форму потрібного розміру, потрібно ввести необхідне значення на панелі опцій.

Я навіть не пригадаю, скільки разів мені потрібно було використовувати певні фіксовані розміри зображень. Було потрібно використовувати панель інформації, щоб впоратися з цим. Насправді ця панель нікуди не зникла, тому важко сказати «прощавай панель інформації», але тепер ви будете використовувати її все рідше і рідше.

У CS6 розміри того чи іншого елемента будуть представлені в невеликому зринаючі підказки. Ця одна з тих функцій, про яку важко уявити, чому вона не була включена в Фотошоп раніше.

Ось ця функція є для мене найнеобхіднішої. Зазвичай я не наводжу в порядок файл PSD. Упевнений, багато хто не погодиться з моєю практикою, але я думаю, що якби приділяв організації шарів багато часу, то мій творчий потік вщухнув. Якщо ви дієте так само як і я, то ви оціните можливість пошуку по словам. Пошук дозволяє фільтрувати шари за такими параметрами:

• Тип - Ця опція дозволяє вам фільтрувати шари по піксельним шарам, коригуючих верствам, текстовим верствам, фігурам і смарт об'єктів.
• Ім'я - Фільтр за назвою шару.
• Ефект - Фільтр шарів по застосованому стилю шару.
• Режим змішування - Фільтр шарів по застосованому режиму змішування.
• Атрибут - Фільтр по призначеному атрибуту: наприклад, «locked» або «visible».
• Колір - Фільтр шарів по тому, який колір був призначений для угруповання.

• Швидкість - Коли ви запустите CS6 Beta, напевно ви помітите, що загальна швидкість роботи трохи збільшилася. Це сталося завдяки новому движку Фотошопа, Mercury. Все, що ви робите в Фотошопі тепер спритніше, ніж раніше.
• Перейменовуємо шар і натискаємо tab, щоб перейменувати наступний - Без коментарів. Чудова функція!
• Приховуємо стилі шару на панелі шарів - Коли я передаю файл PSD клієнтові або розробнику, дуже важливо відправити його чистим і організованим. Тепер можна приховати стилі шару на панелі шарів, клікнувши на стрілочку біля шару, затиснувши клавішу option / alt.

Я використовую Фотошоп CS6 трохи більше тижня, збільшує він швидкість моєї роботи? Відповідь: так. Виконання деяких завдань тепер займає набагато менше часу. CS6 став великим удосконаленням для UI і web дизайнерів. Я вже смакую, які додавання включить Adobe в релізі.