itmakesense

На Пикабу
115 рейтинг 1 подписчик 0 подписок 4 поста 0 в горячем
5

Remove BG (обзор плагинов для Figma ч.4)

Это серия обзоров на самые интересные и полезные плагины для редактора Figma, основного инструмента web-дизайнера. Плагинов просто невероятное количество, пытаюсь разобраться хоть в части из них.


Remove BG – плагин позволяет в один клик убрать на картинка фон у объекта.

Вообще это не только плагин для фигмы но и целый сервис. Есть тул для винды, линукса. Версии для Скетча, WooCommerce, Друпала и прочих зверей. Есть отдельный плагин для фотошопа (хотя казалось бы на кой он там, когда в фш есть встроенные инструменты для этого). 
Ещё есть прилога для Андроида и API. Короче на сайте все подробно расписано если кому интересно, сайт сами найдёте не маленькие, называется он ровно так же.


Работает элементарно. Нажал - получил. Предварительно требует вставить в себя Api-key который хранится в личном профиле на официальном сайте.

Ах да, ложка говна. Плагин бесплатный только 50 траев, дальше космические цены, по 120 рублей на трай, что конско по любым меркам. Там ещё есть тарифы с подпиской, где ценник гуманнее в разы, но это может быть интересно только контент менеджерам, которые обрабатывают фотографии тысячами для залива оных в маркетплэйсы. В любом случае, 50 бесплатных попыток это 50 бесплатных попыток, или несколько сэкономленных часов работы.


Предыдущие обзоры:

Themer – плагин для свапа между темами дизайна (светлая/темная)

Angle Mockups – плагин позволяет повернуть макет под нужным углом в перспективе.

VisualEyes – карманный веб-визор


Ставь плюс, подписывайся!

Показать полностью 1
9

VisualEyes (обзор плагинов для Figma ч.3)

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


VisualEyes – просто чумовой плагин, этакий карманный веб-визор, который позволяет на этапе проектирования и дизайна понять, что именно видят пользователи на странице в первую очередь, ну и соответсвенно произвести нужные корректировки в макете.

VisualEyes (обзор плагинов для Figma ч.3)

Работает супер просто, ставите плагин, запускаете его на выделенном фрэйме с дизайном, смотрите результаты. Как пишут разрабы, там какая-то натренированная нейросеть сама умеет в юзер-тестирование

Есть конечно одна печальная деталь, он платный.

Пять проверок в месяц – бесплатно, потом отдыхай. За денежку он может делать 100 тестов в месяц по 35 рублей за тест. Аналогов все равно нет, яндекс веб-визор хочет готовый сайт, и ему сперва нужно собрать статистику, а тут бац и то же самое, еще на этапе дизайна.


Короче плагин мастхэв большим и крупным продуктам и он все равно дешевле, чем яндекс-взгляд, где цена за юзер-тестирование начинается от 1000р. или забугорный userzoom который вообще влетит в копеечку, да и делают они все равно немного разное.

Предыдущие обзоры:

Themer – плагин для свапа между темами дизайна (светлая/темная)

Angle Mockups – плагин позволяет повернуть макет под нужным углом в перспективе.


Ставь плюс, подписывайся!

Показать полностью 1
9

Angle Mockups (обзор плагинов для Figma ч.2)

Это серия обзоров на самые интересные и полезные плагины для редактора Figma, главного инструмента web-дизайнера. Плагины в фигме появились относительно недавно и расплодились в невероятном количестве, попытаемся разобраться хоть в части из них.


Angle Mockups – плагин позволяет повернуть макет под нужным углом в перспективе.

В фотошопе с этим не было проблем. Дизайнеры создавали или использовали готовые mock-up файлы в связке со смарт объектами, чтобы выгодно показать свои поделки. 




В фигме же у нас нет каких либо встроенных 3D тулов или тех же смарт-объектов, чтоб гнуть макеты под нужным углом, а иногда хочется.


Angle Mockups предельно простой плагин. Например у нас есть иллюстрация с местом куда хотелось бы вставить наш дизайн.

Требуется нарисовать шэйп в том месте куда будем вставлять готовый макет И шэйп и макет должны находиться рядом, ну то бишь в одном файле.

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

Готово, вы восхитительны!

Предыдущие обзоры:

Themer – плагин для свапа между темами дизайна (светлая/темная)


Ставь плюс, подписывайся!

Показать полностью 5
11

Themer (обзор плагинов для Figma ч.1)

Кто-то должен был это сделать. В главном инструменте современного web-дизайнера, не так уж  давно появились плагины и тут же расплодились в совершенно невероятном количества. Хотелось бы запилить подборку с обзорами самых интересных и нужных.

Плагин со сложным порогом вхождения для новичков, но очень важный и полезный в работе.

Themer – плагин позволяет вам создать и менять темы из ваших опубликованных стилей в библиотеке. Если по простому вы сможете менять дизайн со светлой темы на темную в один клик.

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

Шаг 1.

Создайте две палитры для светлой темы и темной. Обычно это делается в двух разных файлах. Важно! Названия цветов которые должны взаимозаменяться должны быть одинаковыми.

Шаг 2.


Вам нужно пройти и зарегистрироваться на сайте https://jsonbin.io/


Благо там ничего особенного не нужно, можно авторизоваться через любую соцсеть, тот же аккаунт гугл подойдёт. 

Нам с этого сайта нужна API-ключ, чтоб плагин заработал. Он генерируется автоматически. Как найти ключ вы видите на картинке ниже.


Если совсем лень, вот вам мой, который используется, как пример в данном посте.
$2b$10$Ahm5DVrFsprWGG3YJ3sLQOgeSokwBKKMKrPAxqI.BYDO3UMIOXBr6

(будем надеяться он будет работать)

Шаг 3.


Всё, идём в сам плагин. 

В файле с одной из созданных палитр запустите плагин (предварительно найдя его в community и установив естественно)
.

В нем нам во вкладке Admin нужно сперва вставить наш API Key.
На вторую строку не обращайте внимания, она будет пустая, но после первого сохранения ссылка сама прорастёт в поле и зачем она нужна информация для нас бесполезная.

Теперь нам нужно добавить палитры. Сперва в файле с первой палитрой, нажимаем "Create a theme", пишем название нашей темы и сохраняем. Проделываем то же самое, во втором файле со второй палитрой. По итогу получаем две темы, которые можно использовать.

Шаг 4.


Для того что бы применить плагин выделите Frame со своим дизайном выполненный палитрой из какой то одной темы. Запустите плагин, выберите в нем тему на которую хотите переключить цвета, нажмите Apply. Если вы сделали всё НЕ верно - ничего не произойдёт, а если верно то все цвета заменятся и вы молодец!

Ставьте плюс, подписывайтесь.

Показать полностью 6
Отличная работа, все прочитано!

Темы

Политика

Теги

Популярные авторы

Сообщества

18+

Теги

Популярные авторы

Сообщества

Игры

Теги

Популярные авторы

Сообщества

Юмор

Теги

Популярные авторы

Сообщества

Отношения

Теги

Популярные авторы

Сообщества

Здоровье

Теги

Популярные авторы

Сообщества

Путешествия

Теги

Популярные авторы

Сообщества

Спорт

Теги

Популярные авторы

Сообщества

Хобби

Теги

Популярные авторы

Сообщества

Сервис

Теги

Популярные авторы

Сообщества

Природа

Теги

Популярные авторы

Сообщества

Бизнес

Теги

Популярные авторы

Сообщества

Транспорт

Теги

Популярные авторы

Сообщества

Общение

Теги

Популярные авторы

Сообщества

Юриспруденция

Теги

Популярные авторы

Сообщества

Наука

Теги

Популярные авторы

Сообщества

IT

Теги

Популярные авторы

Сообщества

Животные

Теги

Популярные авторы

Сообщества

Кино и сериалы

Теги

Популярные авторы

Сообщества

Экономика

Теги

Популярные авторы

Сообщества

Кулинария

Теги

Популярные авторы

Сообщества

История

Теги

Популярные авторы

Сообщества