Скетч-дизайнер

Facebook Devices: я собрал векторные гаджеты в виде скетч-библиотеки

Внутри 53 устройства в символах.

Подключить: sketch.cloud/s/0pEVV

Когда делаешь дизайн мобильного приложения, логично демонстрировать его другим в рамке устройства — мокапе. Существует множество коллекций мокапов, как платных, так и бесплатных.

Одна из лучших бесплатных собрана дизайнерами Фейсбука на сайте facebook.design/devices. В ней можно найти множество популярных устройств во фронтальном ракурсе. Она крута тем, что все изображения в ней векторные и нарисованы в Скетче.

Я пошёл дальше и собрал большую часть этой коллекции в облачную скетч-библиотеку, которую можно подключить в пару кликов, либо скачать и использовать локально.

Всего в него вошли 53 устройства: все актуальные модели айфонов во всех доступных расцветках, моноблоки, ноутбуки и дисплеи Apple. Не вошли планшеты, Андроиды и часы. Их планирую добавить вторым этапом.

Все устройства обёрнуты в символы и их можно вставлять через Runner, если назначить клавишу Ctrl + Y на команду Insert.

Все экраны на устройствах имеют тот размер, в котором для них удобно проектировать. Например, для iPhone SE это 320 х 568. Чтобы заменить содержимое экрана мокапа, нужно вставить растровое изображение в оверрайд с названием:

🖼 Paste your design here

В случае с ретина-экранами желательно, чтобы вставляемые макеты были в двойном размере (@2x). Для iPhone SE это 640 x 1136.

Когда мокап вставлен в проект, при необходимости его можно отвязать от библиотеки горячей клавишей, назначенной на команду Detach From Symbol. Я назначил на неё Shift + Cmd + Y, по аналогии с Shift + Cmd + G (разгруппировка).

#мокапы #горячие_клавиши

—

#первые_шаги – рубрика для юных падаванов