6 альтернатив Figma для UI и UX дизайнеров

Опубликовано: 2022-09-16

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

Прежде всего, в это время Figma останется независимой (отдельной от Creative Cloud) компанией. Об этом говорится в заявлении генерального директора Дилана Филда. По мере поступления более конкретной информации об их планах на будущее эта статья будет обновляться соответствующим образом.

16.09.2022 – Figma сделала Twitter Spaces, чтобы обсудить приобретение, и Ашиш собрал резюме всего, что было сказано/обсуждено.

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

Конкурс получил достаточно обуви, чтобы заполнить.

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

Сообщество Фигма

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

Я думаю, это справедливая оценка, что люди расстроены не только тем, что Adobe приобрела Figma, но и страхом потерять доступ к этим ресурсам, курируемым сообществом. Интеграция аспекта сообщества может оказаться полезной, независимо от того, используете ли вы платный или бесплатный инструмент дизайна. И тем более, если наступит день, когда Adobe решит отключить Figma и запихнуть ее в Creative Cloud.

Альтернативы Figma для UI и UX дизайнеров

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


1. Ручка

Penpot — инструмент дизайна для команд

Penpot находится в разработке с 2021 года (хотя идея его, кажется, восходит к 2018 году) и создается как программное обеспечение с открытым исходным кодом для проектирования, совместной работы и прототипирования. Это кроссплатформенный (на основе браузера), и вы можете самостоятельно разместить Penpot с помощью Elesio или Docker.

Сам проект все еще находится в бета -версии, и я думаю, что он останется в таком состоянии еще какое-то время. Тем не менее, на каких ключевых функциях строится Penpot?

  • Дизайн — компонентно-ориентированный интерфейс для создания и управления дизайн-проектами.
  • Прототипирование — создавайте интерактивные предварительные просмотры UX и тестируйте поток проектирования.
  • Совместная работа — совместная работа в режиме реального времени с поддержкой отзывов и комментариев.
  • Обратная связь — создавайте комментарии к определенным элементам и делитесь ими со своей командой.
  • Ресурсы — библиотеки и шаблоны, созданные сообществом.

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

Пример интерфейса ручки

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

Одна вещь, которой нет в Penpot, — это Auto Layout, но в этом твите было подтверждено, что над этим работают, и он должен появиться в ближайшее время. Кроме того, ведется работа по обеспечению возможности загрузки файлов .fig в Penpot. Похоже, это произойдет после добавления Auto Layout.

Гэри Саймон из DesignCourse недавно сделал учебник для Penpot, и вы можете посмотреть его 30-минутное вступительное видео здесь. Учебное пособие основано на простом дизайне целевой страницы для портфолио и служит хорошим обзором того, на что способен Penpot на этом этапе разработки.

2. Эскиз

Эскиз — дизайн и прототип

Я уверен, что команда Sketch в восторге от этой новости. Figma и Sketch — лучшие инструменты дизайна UI/UX на рынке, причем со значительным отрывом. Единственная проблема со Sketch заключается в том, что он заблокирован для macOS (веб-приложение ограничено только обменом прототипами и отзывами), хотя ходили слухи, что они планируют расширяться до других систем.

Скетч против Фигмы

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

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

Что касается цен, Sketch предлагает бесплатную 30-дневную пробную версию, а его премиальный план стоит 99 долларов в год.

3. Сайтер

Конструктор сайтов без кода, инструмент веб-дизайна для дизайнеров

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

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

Редактор сайта

Вот некоторые другие особенности:

  • Код — вы можете добавить собственный код, который будет выполняться при публикации или предварительном просмотре вашего дизайна.
  • SVG — можно импортировать и редактировать векторы SVG или создавать их самостоятельно с помощью кривых.
  • Движение — настраивайте состояние элемента (переходы, наведение, активность) с предварительным просмотром в реальном времени.
  • Импорт Figma – Вы можете импортируйте существующий проект Figma и превратите его в работающий веб-сайт!

Цены начинаются с 12 долларов в месяц для личных проектов и 19 долларов для проектов с участием до 5 соавторов и/или проектов.

4. UXP-код

UXPin — инструмент для дизайна и прототипирования

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

Итак, чем UXPin отличается от этого?

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

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

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

Бессовестный плагин: я уже писал о библиотеках компонентов React.

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

Как насчет ценообразования? UXPin предлагает два разных плана: Merge и Standard. Слияние начинается с 89 долларов в месяц для плана Startup (1 пользователь) и 119 долларов в месяц для плана Company (также на 1 пользователя). Стандарт начинается с 19 долларов в месяц на пользователя, а план Pro стоит 69 долларов в месяц.

5. Дизайнер сходства

Родственный дизайнер

Affinity Designer часто упускают из виду, потому что он не позиционируется как инструмент UI/UX как таковой.

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

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

При этом в Affinity Designer отсутствуют такие функции, как совместная работа в реальном времени и создание прототипов, а также система плагинов. Определенно нарушение условий сделки для команд.

И последнее, но не менее важное: область, в которой Affinity Designer выделяется, — это система лицензирования. Вы платите за программное обеспечение только один раз (60 долларов США + бесплатная пробная версия) и можете использовать его на своих устройствах с Windows или macOS.

6. Инвижн

Инвижн

InVision предлагает альтернативное решение для FigJam. Как пользователь Figma, вы, скорее всего, уже знакомы с FigJam. Если нет, то это онлайн-интерфейс интерактивной доски, где вы можете вместе работать над идеями, воплощать планы и создавать визуальные траектории проекта. InVision предлагает такое же решение, но с упором на доступность ( есть бесплатный план! ) и простые функции.

Существуют ли какие-либо (собственные) инструменты проектирования UI/UX для Linux?

Я видел, как за последние 24 часа этот вопрос часто задавали, и, насколько мне известно, единственным родным инструментом Linux UI/UX для проектирования является Akira.

Akira — родное Linux-приложение для пользовательского интерфейса и дизайна UX, созданное на Vala и GTK.

Проект находится в очень ранней стадии разработки. Если люди не захотят внести свой вклад в проект или поддержать его финансово, я ожидаю, что прогресс будет относительно медленным. Именно поэтому многие из наиболее популярных инструментов дизайна UI/UX ориентированы исключительно на интерфейс на основе браузера, поскольку он устраняет необходимость создавать нативные приложения.