Почему мы работаем с Figma | Школа веб-дизайна

Наши инструменты: Почему мы работаем с Figma

Хочу вам рассказать, почему мы на Базовом онлайн курсе по веб-дизайну используем именно Фигму для создания макетов сайтов.

 

К этому решению я пришел перед восьмым потоком, и вот уже на момент написания статьи, 2 потока студентов успешно используют Figma в своих работах.

Отрасль начала использовать Figma как основной инструмент в дизайн отделах

Вот пару примеров с Dou.ua:

Требования компании A

Требования компании B

Дизайн сообщество приняло этот инструмент, почему бы и нам на него не перейти? Быть может через год-два что-то поменяется, и мы на это тоже отреагируем.

Много верстальщиков уже тоже оценили верстку макетов с Фигмы, и уже не хотят устанавливать Photoshop и колупаться в слоях.

Отличный функционал для командной работы

Макет в Фигме можно редактировать одновременно нескольким людям. И его от этого не глючит. Как по мне, это очень крутая фича.

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

 

 

Как мы работали до этого

До того как мы перешли на Figma, основным инструментом у нас был Photoshop. Да-да, мы не робкого десятка.

Хоть фотошоп и морально устаревший для создания интерфейсов, но в вакансиях и компаниях вы все еще можете встретить требование — знать Photoshop. Это не удивительно, ведь он все еще остается достаточно мощным.

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

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

Как же я решал проблему с передачей макетов?

Для каждого студента потока я создавал папку в Google Docs, раздавал доступы. Когда студент выполнял задание, он загружал макет в свою папку, и после синхронизации я уже видел его файл у себя на компьютере.

Какие преимущества у Figma перед фотошопом?

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

Никаких файлов

Для того чтобы показать макет заказчику, руководителю, верстальщику, достаточно скопировать ссылку и отправить по почте или в мессенджере.

Для ссылки можно выдавать права, тем самым разграничивать доступы.

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

Работает с SVG

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

Именно поэтому вся графика кроме фотографий должна быть в векторе. Фотошоп изначально это растровый редактор, уже со временем ему прикрутили функционал для работы с вектором, но это все равно выглядит ущербно. Ну не для этого он)

Попробуйте просто открыть SVG  с помощью фотошопа, а потом экспортировать ее. У меня плохая новость, PS после открытия SVG превращает его в растр, пиксели по простому.

Figma отлично понимает формат SVG, их можно легко редактировать, добавлять цвета, менять форму направляющих, а потом снова экспортировать. Код получается чистым, если что, это важно разработчикам.

 

Да она просто очень удобная

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

Хороший дизайнер все равно должен пощупать разные инструменты, уметь быстро разобраться в новом инструменте и выдавать качественный результат. 

Fimga работает в Web среде, именно там, где и будет работать сайт или приложение. Это тоже мелочь, но в некоторых ситуациях достаточно важная.  

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