Подати на друк

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

18.04.2012, 19:26  |  Новини мережі  |  Денис Носов

Нещодавно компанія Adobe анонсувала вихід бета-версії Photoshop CS6. У новому релізі Photoshop зроблений великий крок назустріч дизайнерам які працюють у сфері веб та користувацьких інтерфейсів.

Вже сьогодні можна завантажити безкоштовну демонстраційну версію бета-версії графічного редактора та ознайомитись із більше ніж 65 новими функціями.

Новий інтерфейс

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

Нові рамки

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

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

Стилі заголовків

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

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

Lorep Ipsum приходить в CS6

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

Тепер вам більше не потрібно цього робити. Ви можете просто вставити «lorem ipsum» з меню.

Кольори тепер працюють з хеш тегом

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

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

Стандартні розміри девайсів (iPhone, iPad і т.д.)

Це було лише питанням часу, коли Photoshop представить стандартні розміри для девайсів типу 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 (для Mac) і Ctrl + Shift + H (для Win).

Прощавай панель інформації, привіт візуальна допомога!

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

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

Пошук в шарах

Ця функція є самої необхідною. Ви оціните можливість пошуку по словам. Пошук дозволяє фільтрувати шари за наступними параметрами:

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

Інші зміни

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

Читайте також