Также читайте «5 моих самых любимых горячих клавиш, и как создать собственные горячие клавиши в Skecth 3«

Всегда можно обойтись без мышки, применяя горячие клавиши, экономя тем самым свое время. Это одна из многих привычек, которая превращает хорошего дизайнера в первоклассного дизайнера, и в этом она очень полезна!

Подумайте, как много времени вы экономите в Photoshop, используя сочетание клавиш Alt + Backspace для заливки слоя вместо прогулок по меню. В Sketch есть множество потрясающих горячих клавиш, и некоторые из них даже не упомянуты в документации.

Если вы перешли на Sketch из Photoshop, вам будет приятно узнать, что большая часть горячих клавиш, которые вы использовали там, также работают в Sketch, например: Shift + клавиши стрелок смещают на 10 пикселей, ⌘ + T управляет масштабом, T активирует инструмент для ввода текста и т.д.

Sketch достаточно прост, так что нет необходимости в заучивании сотен горячих клавиш для улучшения своей работы. Но знание наиболее полезных сочетаний значительно увеличит вашу продуктивность. Сами понимаете, гораздо полезнее знать, что клавиша Alt позволяет измерить объекты, чем то, что ⌘ + Shift + H служит для переключения видимости слоя — хотя я сам пользуюсь последним сочетанием довольно часто!

Я собрал восемь самых интересных горячих клавиш, которые я использую в своей работе.

Переименовывайте слои быстро

Выделите слой. Нажмите ⌘ + R. Начните печатать. Нажмите Enter для сохранения.

Если вы похожи на меня, вы не переименовываете слои в процессе разработки. Это необходимо только если вы хотите выслать проект клиенту или разработчику, и для этого нужно перевести свои наработки в более-менее читабельную форму, понятную другим. С этой горячей клавишей вы можете переименовать десятки слоев последовательно, даже не используя мышку.

Дополнительный совет: После переименования первого слоя нажмите Tab для перехода на следующий слой (или Shift + Tab для перехода на предыдущий), затем нажмите ⌘ + R, чтобы переименовать его.

Переименовывайте слои быстро

Экспортируйте все артборды

Нажмите ⌘ + Shift + E. Настройте опции в боковой панели.

Вы можете экспортировать весь холст со всеми артбордами (множество файлов), используя кнопку Export All (экспортировать все). Дополнительный совет: Вы можете экспортировать артборд в подпапку, например, в подпапку “Home”, просто написав перед именем артборда префикс “home/”. Sketch запомнит это, и при использовании опции Export All вы можете обновлять каждый артборд, не ломая правильно структурированных подпапок. Здорово.

Экспортируйте все артборды

Удобно измеряйте расстояние между объектами

Выделите один объект, который вы хотите измерить. Удерживая ⌥, наведите мышкой на другой объект.

С помощью этой горячей клавиши вы можете легко измерить расстояние между двумя или более объектами. Я даже не могу передать, насколько полезна эта горячая клавиша. Она особенно полезна для верстальщиков, которые воплощают ваш эскиз в реальность.

Дополнительный совет: Удерживая ⌥ без наведения мышки на другой объект, вы увидите позицию относительно всего артборда, так что вы с легкостью сможете сказать, например, на сколько пикселей объект отдален от нижнего края iPhone.

И еще один совет: Если у вас не получается замерять объект, несмотря на наведение мышки поверх него, попробуйте удерживать ⌘ и ⌥.

Удобно измеряйте расстояние между объектами

Быстро клонируйте цвет

Ctrl + C

Это наиболее полезный прием, если вы хотите скопировать цвет из любого места холста. Не нужно заходить в раздел заливки в боковой панели. Просто нажмите Ctrl + C, и Sketch увеличит область на экране, чтобы вы смогли легко выделить необходимый цвет, без необходимости масштабировать изображение самостоятельно. Процитирую Эндрю Ричардсона: “Это сэкономит вам чокнутую кучу времени!”.

Быстро клонируйте цвет

Увеличить слой на весь экран

⌘ + 2

Это сочетание кнопок увеличит холст так, что слой займет весь экран, вам будет удобно править маленькие объекты и иконки. Только одна эта горячая клавиша экономит уйму времени. Альтернативный способ сделать то же самое такой: удерживая Z, кликните и перетяните ту область, которую вы хотите увеличить на весь экран.

Увеличить слой на весь экран

Масштабировать до реального размера/100%

⌘ + 0

Лучше всего использовать этот шорткат в сочетании с предыдущим. Увеличьте какую-то иконку на весь экран, отредактируйте, а затем снова верните в масштаб 100%.

Дополнительный совет: ⌘ + 1 смасштабирует изображение так, чтобы сразу показать все артборды для обзора.

Масштабировать до реального размера/100%

Выделите несколько слоев

Нажмите левой кнопкой мыши и протяните по слоям, которые вы хотите выделить.

Лучше всего это работает, когда слой под выделенными слоями заблокирован. В противном случае вы можете случайно выделить и его. Да, это не совсем горячая клавиша, так как используется мышка. Но это работает быстро!

Дополнительный совет: если у вас не получается выделить слои, скорее всего, они расположены в какой-то группе. Попробуйте удерживать ⌘, пока будете выделять слои мышкой. Это должно помочь.

Выделите несколько слоев

Создайте группу слоев

⌘ + G

Это элементарно. Вы захотите создать группы слоев, чтобы легко передвигаться по слоям или быстро отключать набор слоев одним кликом. Эта горячая клавиша создает группу одним махом. Также стоит упомянуть, что нажатие ⌘ + R после создания группы слоев позволит вам назвать ее без необходимости использовать мышку.

Создайте группу слоев

Еще несколько полезных советов:

  • Если у вас возникли сложности с подбором идеального цвета, попробуйте переключиться с палитры RGB на HSB. Это позволит вам более интуитивно настроить насыщенность и яркость. Особенно полезным этот прием будет при построении монохромной цветовой схемы и необходимости создания другого оттенка того же цвета, но темнее или светлее.
  • ⌘ + Shift + H спрячет или покажет слой/группу слоев
  • и + позволит увеличить масштаб в шагах (100%, 200%, 400% и т.д.). Уменьшить масштаб пошагово можно клавишами ⌘ и —
  • Enter — начать редактировать объект. Клавиша Esc служит для выхода из режима редактирования.
  • ⌘ + Shift + L заблокирует слой/группу слоев
  • ⌘ + B сделает текст жирным
  • F для включения/отключения заливки

Я работаю в сфере производства высококачественных иконок, на даный момент на PXLSRC — посетите, если вам интерсно!