Что лучше фигма или фотошоп

Чем Figma лучше Photoshop для разработки веб-интерфейсов

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

Огромное количество дизайнеров во всем мире в качестве инструмента для разработки веб-интерфейсов использует Adobe Photoshop. В этом нет ничего удивительного — Photoshop способен справиться практически с любой задачей, которая имеет отношение к графике.

Но как и все комбайны, инструмент от Adobe в некоторых случаях уж слишком неповоротлив и сложен. При решении специфических задач, включая разработку веб-интерфейсов, можно попробовать и другие инструменты. Среди прочих можно назвать Sketch, Adobe XD и Figma. Сейчас предлагаем поговорить как раз о последнем, остальные обсудим в следующих публикациях.

Запуск одним кликом

Отличительной особенностью Figma является то, что работать с пакетом (полноценно!) можно в браузере. Есть и десктопная версия, но ее функциональность лишь немного отличается от веб-сервиса (в десктопной версии можно работать в офлайне, все изменения автоматически будут внесены при подключении к сети), поэтому можно ничего не загружать и не ставить на ПК. Заходим на сайт Figma — и сразу можно приступать к работе.

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

Экономия средств

Графические редакторы в большинстве своем стоят денег, и немалых. Например, для Photoshop есть возможность получить лицензию на год (около 24 тысяч рублей) либо же платить за продукт каждый месяц (примерно 1 300 рублей без НДС).

Ну а Figma — условно-бесплатное ПО. Есть free версия, возможностей которой вполне хватит средней руки дизайнеру. Бесплатно можно работать не более, чем с тремя проектами и одним коллегой-редактором (это касается удаленной совместной работы). История версий хранится не более 30 дней. Пользователей с read only правами можно добавлять сколько угодно.

Если есть нужда в большем количестве возможностей, стоит перейти на платную версию, которая обойдется в 12 долларов в месяц. В ней есть неограниченное количество проектов, «бесконечная история», командная библиотека элементов, из которой можно выбирать объекты в любое время, интеграция со Slack и продвинутые функции управления правами пользователей. За каждого дополнительного редактора нужно будет платить еще около 12 долларов.

Что касается разницы между редактором и пользователем, то в первом случае мы говорим фактически об администраторе всех проектов с полным доступом ко всем файлам в режиме чтения и записи. Во втором речь идет о пользователе с read only статусом, которому, кроме режима просмотра, доступны еще комментирование и некоторые другие функции.

Совместная работа

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

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

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

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

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

Экспорт отдельных элементов

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

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

В Figma есть возможность передвигать вместо векторных точек линии. Функция не новая, она появилась еще в 2016 году. Тем не менее, при работе с векторными сетками это очень удобно.

В большинстве векторных редакторов можно делать то же самое, но времени уходит больше, поскольку требуется:
1) Выделить две точки, которые соединены линией. Они мелкие, надо прицелиться как следует, и это не всегда получается сделать с первого раза;
2) С зажатой кнопкой Shift сдвинуть их в нужную сторону (чтобы не сломалась геометрия).

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

Figma работает с Google Fonts

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

В Figma используются Google Fonts. Локальные шрифты при этом подгружаются в проект.

Импорт sketch-файлов

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

Figma совместима c файлами в формате Sketch. После импорта рабочие области, слои, группы сохраняются, включая свойства вроде границ и эффектов. Названия тоже сохраняются. Импортировать Sketch файлы в Photoshop напрямую невозможно — для этого необходимо выполнять промежуточные действия и использовать дополнительные приложения.

Техподдержка

Еще одна возможность Figma, которая уже не относится непосредственно к разработке интерфейсов — это связь с саппортом. Для этого разработчики создали live-chat, позволяющий быстро связаться с сотрудником техподдержки, задав тому вопрос (только по делу!) или рассказав о какой-либо технической проблеме.
Немного дегтя

Конкуренты редактора пока что не уходят полностью в “облака” и неясно, будут ли переходить в ближайшем будущем. В этом есть свои плюсы, поскольку пользователи Photoshop и других графических редакторов могут спокойно работать в офлайне не боясь того же “Роскомнадзора”, который одним действием а-ля слон в посудной лавке может отключить от любого облачного сервиса тысячи пользователей из РФ или других стран.

Кто прав, а кто — не очень, покажет время. Пока же можно спокойно осваивать Figma, самостоятельно оценивая достоинства и недостатки приложения.

Источник

Что лучше фигма или фотошоп

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

В чем плюсы программы Photoshop?

Идеальна для работы с растровой графики

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

Позволяет создавать сложные, креативные макеты

Фотошоп позволяет веб-дизайнеру использовать не только готовые файлы из фотостоков, но и дорабатывать их до нужного вида. Например, вырезать людей, полностью менять фон, изменять цветовую гамму, создавать креативные и сложные коллажи. Зная лишь базовый инструментарий Photoshop, можно простенькую картинку превратить в настоящий шедевр.

Более привычная и для заказчиков, и для разработчиков

Согласитесь, что чаще всего вас просят прислать макет в формате *.psd? Потому что Фотошоп для большинства людей, отдаленных от веб-дизайна — это что-то привычное, понятное и точно работающее. А вот находить разработчиков, которые верстают сайты не из макетов в *.psd, сложнее.

В чем минусы Photoshop?

Сложность в изучение

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

Неудобно работать с векторной графикой

Конечно, в Photoshop можно отрисовать иконки, геометрические фигуры, формы, кнопки и другие подобные элементы. Но сделать это сложнее и дольше, чем в аналогичных программах. С другой стороны, такие детали можно создать с помощью другого инструмента, а потом загрузить в Фотошоп и завершить макет там.

Большой размер программы и отсутствие десктопной версии

Действительно, нормально работать в Photoshop на старом ноутбуке вряд ли выйдет. Он занимает много оперативной памяти, из-за чего ПК может сильно тормозить и виснуть. Но, с другой стороны, это отличный повод задуматься о смене техники. Чем не мотивация работать лучше и стараться повысить свой доход?

В чем плюсы программы Figma?

Есть возможность работать над макетом коллективно

Удобно, если вы работаете над макетом с другим дизайнером. Устроена эта функция почти так же, как и в Google Диск — все пользователи-редакторы подписаны, у них разные цвета курсоров. А если нужно что-то уточнить друг у друга, это реально сделать прямо в Фигме, без мессенджеров, с помощью комментариев.

Но если вы работаете сами, без партнеров, то эта функция, скорее всего, окажется бесполезной.

Можно обойтись без установки на ПК

Это отлично, если у вас пока старая, медленная техника и нет возможность в ближайшее время купить новую. Хотя программа все равно немного тормозит работу ноутбука даже с десктопной версии. А если вам такой вариант покажется неудобным, всегда есть возможность установить приложение на ПК. Это дает чуть больше возможностей для дизайна.

Функция «Компоненты»

Это одно из главных преимуществ Figma перед Photoshop. В чем суть? В том, что если нужно изменить какие-то повторяющиеся элементы, то не нужно редактировать каждый. Например, вы сделали какой-то значок, который будет на каждой странице макета и вдруг вам надо изменить в нем цвет. В Фигме достаточно подключить функцию «Компоненты», соответственно, первый элемент назначить компонентом и уже от него создавать копии. И тогда, когда вы захотите что-то изменить, достаточно внести правки в этот первый значок, и остальные изменятся автоматически. Согласитесь, что это удобно?

Конечно, в Photoshop тоже есть подобная функция «Смарт-объекты», но имеет меньше свойств, из-за чего является не такой удобной, чем тот же инструмент в Фигме.

Удобно работать с векторной графикой

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

Еще есть векторная сеть, благодаря которой можно передвигать не отдельные векторные точки, а целые линии без «ломания» геометрии. В других программах для веб-дизайнеров с этим проблемы.

В чем минусы Figma?

Без версии на ПК и без интернета нельзя ничего делать

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

Подходит только для сайтов с простым дизайном

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

Источник

Фигма или Фотошоп. Что выбрать новичку

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

Графический редактор — второй по важности инструмент верстальщика после редактора кода. Дизайнеры создают макеты сайтов и приложений и передают готовые файлы в вёрстку. Верстальщик получает из них всю необходимую информацию: тексты, иллюстрации, цвета, положения элементов на странице и расстояния между ними.

Есть много графических редакторов, и как из них выбрать непонятно. Поэтому возьмём две популярные программы — Photoshop и Figma — и сравним их.

Photoshop — мощный графический редактор, основное предназначение которого — работа с растровой графикой. Он вышел в 1990 году и за это время собрал большое сообщество пользователей. В исследовании инструментов дизайна от 2019 года он занимает четвёртое место из десяти самых популярных инструментов.

Figma — онлайн-редактор для создания интерфейсов и прототипов. Он появился в 2016 году, но успел обогнать Photoshop по количеству пользователей почти в 4 раза. В том же исследовании инструментов дизайна Figma занимает второе место по количеству пользователей.

Чтобы выбрать редактор, сравним удобство интерфейсов и совместной работы, варианты использования ПО и его установки, минимальные требования к компьютеру.

Хоть Фигма, хоть Фотошоп

Всё равно нужно уметь верстать, чтобы не ругаться с программистами.

Нажатие на кнопку — согласие на обработку персональных данных

Интерфейс

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

Figma

В Figma есть две основные рабочие области — графический редактор и менеджер файлов.

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопМенеджер проектов в Фигме

Вторая рабочая область в Figma — графический редактор. Здесь дизайнеры делают макеты, а верстальщики находят иллюстрации, тексты, параметры объектов для вёрстки.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопГрафический редактор внутри Figma

Photoshop

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

Такое обилие мешает новичкам. Среди панелей с информацией трудно найти параметры текста или слоя или выбрать нужный инструмент.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопОкно Photoshop с множеством инструментов

Можно немного облегчить жизнь, если оптимизировать рабочее пространство. Для этого достаточно скрыть инструменты и панели, которые не нужны для вёрстки. Тогда лишняя информация не будет отвлекать, а найти нужный инструмент станет проще.

Ниже — пример того, как может выглядеть Photoshop верстальщика.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопОкно Photoshop, настроенное для работы верстальщика

Способ установки

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

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

Figma

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

У этой реализации есть свои недостатки. Figma не работает без интернета и может тормозить, если видеокарта недостаточно мощная. Для доступа к локальным шрифтам на компьютере придётся установить небольшую программу Figma Font Helper.

Разработчики Figma побеспокоились об удобстве пользователей и создали десктопное приложение для Windows и Mac OS. В нём есть те же функции, что и в браузерной версии. Недостаток приложения в том, что оно не работает без интернета и через прокси-сервер. Тем, у кого прокси-соединение, подойдёт только браузерная версия.

Photoshop

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

Стоимость

Не все графические редакторы бесплатные. Об этом нужно помнить, чтобы рассчитать силы и понять, есть ли деньги на покупку или регулярное продление подписки.

Figma

Figma — условно бесплатный графический редактор. У него есть 3 варианта использования: начальный, для профессионалов и для организаций.

Начальный тариф бесплатный с доступом к безлимитному облачному хранилищу, количество пользователей, которые могу просматривать проекты, не ограничено. В нём есть лимиты:

Тарифы для профессионалов и организаций платные. Профессионалы платят по 12 долларов за пользователя в месяц при оплате на год вперёд или по 15 долларов помесячно. Для студентов и преподавателей этот тарифный план бесплатный. Правда, придётся подтвердить факт учёбы в университете.

Организации платят по 45 долларов за пользователя в месяц. Причём заплатить придётся сразу за весь год, помесячной оплаты нет. Тариф подходит командам от 9 пользователей.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопТарифные планы в Figma

Photoshop

Photoshop — платная программа, которую можно попробовать бесплатно в течение 7 дней. Чтобы начать работать в редакторе, нужно купить подписку. Есть три варианта подписок — для частных лиц, бизнеса и учащихся.

После семидневного тестового периода частные лица платят за Photoshop по 1352 руб. в месяц. Компании — по 2190 руб. в месяц. Частные лица могут сэкономить, если оформят подписку «Работа с фотографиями». В неё входят Photoshop, Lightroom и Lightroom Classic. Стоит такая подписка 644 руб. в месяц плюс НДС.

Студенты и преподаватели могут купить Photoshop только в составе набора приложений Creative Clouds. Подписка для них стоит 1288 руб. в месяц плюс НДС. Чтобы купить эту подписку, придётся подтвердить факт учёбы в университете.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопТарифные планы в Photoshop

Совместная работа

Удобство в работе — важный параметр при выборе графического редактора. Верстальщик получает макет, показывает свёрстанные проекты клиенту, получает правки и отрабатывает их. Чем проще этот процесс, тем меньше ошибок и лишней работы у всех членов команды.

Figma

Фигма — Google Docs в мире дизайна.

В Figma могут работать одновременно несколько человек. На тарифе Starter — не более 2 пользователей с функциями редактора. Все изменения автоматически сохраняются в облаке.

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

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошопСовместная работа команды над проектом в Figma

Photoshop

В Фотошопе может работать только один человек. Из-за этого возникают проблемы: файлы теряются, коллега может прислать неактуальную версию. У клиента может не быть Photoshop, чтобы посмотреть файл. Распределённой команде трудно организовать совместное обсуждение макета.

Что лучше фигма или фотошоп. Смотреть фото Что лучше фигма или фотошоп. Смотреть картинку Что лучше фигма или фотошоп. Картинка про Что лучше фигма или фотошоп. Фото Что лучше фигма или фотошоп

Получите профессиональный навык

Требования к компьютеру

Графический редактор должен работать быстро, без задержек. Если компьютер не отвечает минимальным требованиям редактора, то работа может затянуться.

Figma

Браузер: Chrome 58+, Firefox 57+, Safari 11+, Microsoft Edge 16+.

ОС для браузерной версии: Windows 8.1, MacOS 10.10 (Yosemite), любые ОС Linux и Chrome, которые поддерживают перечисленные браузеры.

Видеокарта:: Intel HD Graphics 4000, Nvidia 330m, ATI Radeon HD 4850.

ОС для десктопного приложения: macOS 10.11 (OS X El Capitan), 64-разрядная версия Windows 8.

Photoshop

Что выбрать

Дизайнеры всё чаще выбирают Figma. Но Figma не может полноценно заменить Photoshop. В ней нет многих возможности, которые нужны дизайнерам. Например, в Figma нельзя работать с растровой графикой. Поэтому верстальщику полезно знать оба редактора. Особенно тем, кто планирует работать с разными клиентами. Но осваивать одновременно два редактора трудно. Лучше выбрать один, разобраться в нём и постепенно изучать второй.

Figma подойдёт тем, кто хочет начать работать быстро прямо из браузера, в удобной среде, совместно с коллегами, при этом не платить за ПО. Про работу в Figma мы пишем в нашем блоге, например, «Старт в Figma для верстальщика», и рассказываем на курсах для верстальщиков в HTML Academy.

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

Научитесь работать с Фигмой

Получите профессиональный навык «Экспорт параметров и графики из Figma»

Источник

Figma или Photoshop? – выбор объясняют веб-дизайнеры

Figma – крутой инструмент, но в работе с растровым контентом она не сравнится с Photoshop, а в работе с вектором проиграет Illustrator. И все-таки многие графические дизайнеры выбирают «Фигму». У них на это есть объяснения!

В чем разница между Figma и Photoshop

Figma – онлайн-редактор для создания прототипов и интерфейсов. Подходит для работы с векторной графикой.

Photoshop – редактор для работы с растровой графикой (в первую очередь – для ретуши фотографий).

Сравнивать Figma и Photoshop – это как сравнивать ручку и карандаш. Оба инструмента хороши, но подходят для разных задач.

Тем не менее, начинающие дизайнеры часто задаются справедливым вопросом: с какого инструмента начать обучение? Какой подойдет, если я хочу стать, например, веб-дизайнером?

Что проще освоить

И Figma, и Photoshop – сложные, функциональные инструменты. Освоить их целиком за пару недель невозможно: на одну только отработку теории уйдут месяцы упорной работы. Однако Photoshop все же сложнее Figma: он решает больше задач и пугает интерфейсом.

Photoshop предлагает все лучшее сразу, поэтому стандартная рабочая среда программы выглядит отталкивающе: слишком уж много тут инструментов, вкладок, выпадающих меню и информационных панелей.

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

А теперь посмотрите на базовый интерфейс Figma:

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

Интерфейсы двух программ настолько отличаются по двум причинам.

Во-первых, Figma – специализированный инструмент для веб-дизайнеров, а Photoshop – программа для всего. Больше функций – больше инструментов и панелек.

Во-вторых, Photoshop гораздо старше Figma, а потому выглядит несовременно и не настолько дружелюбен.

Требования к «железу»

Если у вас старое железо, выбирайте Figma.

Во-первых, она менее требовательна к производительности системы.

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

Минимальные системные требования Figma

Минимальные системные требования Photoshop

Автономная работа

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

У Phptoshop полноценной совместной работы нет вообще. Adobe предлагает стороннюю программу Creative Cloud – облако, в котором сохраняются проекты.

Стоимость

Навороченная версия Figma стоит дороже, чем Photoshop: 860 рублей в месяц против 598 соответственно.

Однако у Figma есть бесплатный тарифный план.

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

Photoshop можно купить только с подпиской сразу на год, а в подарок к подписке дадут доступ к Lightroom и облачному хранилищу.

Вот вся тарифная линейка Photoshop для индивидуальных пользователей:

Какая программа мне подойдет?

Работаю с фотографиями

В Figma, конечно, тоже можно работать с растровыми изображениями, но только через «костыли», которые здорово усложнят работу.

Я веб-дизайнер

Ваш выбор – Figma. Инструмент создан именно для решения задач веб-дизайна.

То, что в Photoshop придется выполнять в десятки и даже сотни действий, в Figmа вы сможете сделать в один-два клика.

Значит ли это, что Photoshop вообще не нужен веб-дизайнеру? Нет! Хотя у Figma есть четкая специализация, функционал программы даже в этом направлении ограничен: здесь нет банальной «волшебной палочки», работы с масками, трансформирования – подручных инструментов, которыми нас избаловал Photoshop.

Работаю с прототипами

В Photoshop работать с прототипами можно, но сложно.

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

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

Ничего подобного в Photoshop нет. Для этих целей у Adobe есть Adobe XD, но это отдельная программа.

Если вам нужно работать с прототипами, посмотрите в сторону Axure. Либо выбирайте проверенный временем временем ProtoPie.

Множество бесплатных шаблонов Figma для прототипов доступны на официальном сайте

Резюме

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

Если специализация у вас уже есть, и она связана с разработкой интерфейсов и прототипов, выбирайте Figma. Photoshop тоже придется освоить, но начать можно будет с основ – остальное нагоните в процессе работы.

Бытует мнение, что в современный UX/UI «не впрыгнуть» без уверенного знания Figma. Это не совсем корректно.

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

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

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

Figma упростила много наших рабочих процессов, которые раньше происходили в Photoshop.

Я чаще всего пользуюсь Figma, как и большинство дизайнеров сегодня. При этом не могу сказать: «Важно знать Figma, а Photoshop неважно, не изучайте». Все равно в работе приходится комбинировать программы, потому что Figma подходит для дизайна несложных объектов, а какие-то мудреные эффекты делаешь в Photoshop.

Я занимаюсь графическим и веб-дизайном и всеми руками за «Фигму».

Плагины для «Фигма» устанавливаются практически моментально.

Легко работать даже с форматами, которые порой не читает «Фотошоп» (когда скачиваешь какую-нибудь картинку из интернета, а «Фотошоп» пишет, что не откроет ее).

В «Фигме» есть возможность быстро передать макет коллеге, просто кинув ссылку на проект. Можно минимально откорректировать фотоконтент, отрисовать иллюстрацию пером, наложить что-то на мокап.

А еще у меня «Фигма» никогда не вылетает ни с того ни с сего, а у «Фотошопа» такое случается.

В общем, люблю «Фигму».

Преимущества Photoshop

Преимущества Figma

Идеален для работы с растровой графикой. Здесь можно ретушировать фото, реставрировать документы, заниматься обработкой кадров, цветокоррекцией.

Подходит для работы в разных направлениях. рабочая среда «Фотошопа» будет одинаково комфортна как иллюстраторам, так и веб-дизайнерам.

Много инструментов, которые значительно упрощают выполнение типовых задач: обтравку предметов, обработку готовых фото, изменение цветов. Есть возможность автоматизировать процессы.

Идеальна для векторной графики и позволяет прорабатывать даже небольшие детали интерфейса.

Можно работать над одним проектом в команде в режиме реального времени, общаться и вносить правки совместно.

Чтобы работать в программе, ее не нужно устанавливать. Правда, программа из-за этого часто зависает.

Помимо истории работы с файлом в текущей итерации редактирования есть функция контроля версий: вы всегда знаете, кто когда и какие изменения вносил в файл. Если нужно, легко вернуться к предыдущей версии.

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *