В данном мини-курсе рассмотрим Figma как инструмент для веб-дизайна. С ее помощью можно создавать не только прототипы, но и приложения, панели управления, а также сами интерфейсы сайтов. Главное преимущество этого инструмента – простота, благодаря чему она и завоевала расположение многих пользователей в сфере веб-дизайна.
Сервисом можно пользоваться и в онлайн версии с любого браузера, устройства и версии операционной системы. В онлайн редакторе все данные будут сохраняться в облаке, и в том случае, если вы работаете в команде, все участники будут иметь доступ к проекту. Это удобно, так как до появления этой программы, дизайнерам приходилось передавать макеты в фотошопе, что приводило к разным трудностям при загрузке. Например, некоторые макеты не открываются в фотошопе, пока не будут установлены необходимые шрифты.
К недостаткам Фигмы относится то, что программа не поддерживает русский язык. Однако она настолько простая, что даже базовых знаний английского достаточно чтобы работать в ней.
Что такое Figma и для чего она нужна?
Целевая аудитория Фигмы – маркетологи, разработчики сайтов, менеджеры, а также дизайнеры. Основные возможности программы:
- Создание прототипа. Это модель сайта или приложения. Создавая его разработчик отрисовывает экраны, и связывает их между собой. Сразу же в данной программе можно продемонстрировать заказчику, то как будет выглядеть сайт на разных устройствах.
- Создание интерфейса. Фигма позволяет создавать иконки, кнопки, эффекты, раскрывающиеся блоки и анимации.
- Векторная графика. В данной программе возможен экспорт и импорт векторных объектов, а также все необходимые элементы для работы с ними.
- Нестандартные методы использования. В Фигме можно создавать диаграмму Ганта, а также работать с рекламными объявлениями, в том числе и для социальных сетей.
Как начать пользоваться Figma?
Программа имеет платную и бесплатную версию. В том случае, если вам необходимо разработать крупный проект, к также контролировать его на протяжении более 1 месяца, то имеет смысл воспользоваться платной версией. Для обычных фрилансеров и веб-дизайнеров, которые работают самостоятельно, или только в паре с заказчиком, будет вполне достаточно бесплатного функционала. В бесплатной версии права редактора могут иметь максимум два человека, включая вас.
Для начала перейдите на официальный сайт программы figma.com. Пройдите регистрацию, указав адрес электронной почты, и вам будет доступна работа в онлайн версии. Что касается скачивания программы для Windows или MacOS, то необходимо перейти в раздел Figma Downloads, и выбрать версию для своего устройства.
Интерфейс Figma
Профиль. Здесь вы можете менять имя пользователя, адрес электронной почты, а также устанавливать аватарку. В этом же разделе приобретаются платные тарифы, а в случае необходимости удаляется аккаунт.
Поиск. При помощи строки поиска вы можете отыскивать свои проекты, а также необходимые файлы. Чтобы эти файлы впоследствии было легко найти, рекомендую переименовывать их.
Последние файлы. Все файлы, которые вы использовали, автоматически сохраняются. В данном разделе вы можете просматривать историю последних изменений. В случае необходимости можно легко восстановить резервную копию проекта.
Плагины. В этом разделе содержится список расширений, которые способны упростить и ускорить работу в редакторе. Например, расширение Unsplash позволяет искать стоковые изображения в самой программе, не выходя за ее пределы, а плагин Iconify содержит более 40 000 векторных иконок.
Новый файл. Эта вкладка предназначена для создания нового файла.
Команда. Разделе First Project представляет рабочее место вашей команды. В нем вы сможете приглашать новых участников для работы с проектом. Также в этом разделе будет представлен список ваших команд и проектов, например, команда «SMMgid».
Чтобы создать новый проект внутри команды, нажмите на вкладку «Untitled».
Таким образом, вы перейдете к редактору программы, где и производится работа.
Все возможности редактора мы рассмотрим в цикле уроков. Что вы сможете узнать из этих уроков?
В этом уроке вы увидите с чего начинается работа в программе. В нем представлены основные инструменты для манипуляции с объектами – Move, Scale, а также Лупа и Рука. Также вы узнаете, как передвигать, вращать, менять размер объектов в Figma и освоите все варианты выделения элементов.
Из этого урока вы узнаете, что такое фреймы и слайсы. Также в нем рассматривается как группировать объекты в фрейме, и в чем отличие фреймов от групп. Вы поймете, как создается адаптивный дизайн сайта под разные устройства, и как можно менять формат и размер фрейма.
Даже создание самого сложного дизайна состоит из стандартных фигур. В этом уроке вы сможете познакомиться с основными векторными объектами в Фигме, а именно прямоугольник, линия, линия со стрелкой, круг, треугольник, и звезда. Кроме того, в уроке рассказывается как задавать точные размеры этих элементов, менять их форму, обводку, и добавлять эффекты.
Для создания привлекательного дизайна сайта не обойтись без инструмента «Перо». В этом уроке вы сможете научиться пользоваться этим инструментом, и увидите, в каких случаях он может быть полезен. Также вы научитесь рисовать кривые линии и редактировать векторные объекты.
В этом уроке мы рассмотрим, как работать со слоями в Фигме. Из него вы научитесь группировать слои, чтобы можно было проще ориентироваться в элементах проекта, а также переименовывать слои и сохранять их на жесткий диск в разных форматах. Помимо этого, вы научитесь создавать маски.
Данный урок поможет вам освоить всю информацию, связанную с текстом в Фигме. Вы научитесь не только создавать текстовые слои, но и редактировать их меняя цвет, шрифт, раскладку, и т.д. Также вы научитесь создавать векторный текст, который можно импортировать в формате SVG. Кроме того, из этого урока вы узнаете, как взаимодействовать с другими пользователями, работающими с вами в команде при помощи комментариев.
Ключевую роль в дизайне играет цвет. Как раз из этого урока вы увидите принцип работы с цветовым модулем в Фигме, и узнаете, как можно менять цвета всех объектов, с которыми вы работаете. В уроке рассказывается как создаются цвета, как они комбинируются в градиенты, а также как создаются новые цветовые стили, которое в последствии можно применять ко всем элементам проекта. Кроме того, вы узнаете для чего необходимо инструмент «Пипетка», и как его можно использовать в работе. Вы научитесь добавлять изображения в проект, и редактировать их меняя экспозицию, контрастность, насыщенность, температуру, оттенок, освещение, и тени.
Тщательно созданная сетка, подходящая для вашего контента, позволит определить структуру, иерархию и ритм вашего дизайна. Если все рассчитано точно, «строительные леса» сеток избавят вас от необходимости угадывать многие аспекты рабочего процесса.
Различные типы сеток также могут помочь вам установить рациональный подход к масштабированию, позиционированию, размеру и интервалу. В этом уроке вы научитесь использовать этот важный инструмент, и увидите, как он влияет на позиционирование объектов. Здесь рассмотрено как создавать сетки, а также выполнять разметку фрейма на столбцы и строчки. Кроме того, вы научитесь использовать инструмент «направляющие» для выставления определенных границ.
Из этого урока вы узнаете, как при помощи стилей, создавать шаблоны цветов, текстов и сеток, чтобы в последствии использовать их в разработке адаптивного дизайна для разных устройств. Этот инструмент особенно полезен при создании объектов с многократным использованием в дизайне, так как при редактировании стиля, все элементы к которым они были применимы также изменятся.
Чтобы не создавать отдельный дизайн под разные устройства, можно воспользоваться функцией ограничителя, которая отвечает за позиционирование объектов. Освоение этой функции позволит вам создавать адаптивный дизайн для разных устройств – компьютеров, планшетов, телефонов. В этом уроке вы научитесь закреплять объекты во фрейме на определенных позициях, а также при необходимости масштабировать их.
Из этого урока вы узнаете, что такое компоненты, и как их использовать при создании сложных элементов дизайна. Данная функция позволяет экономить время, так как вы можете один раз создать определенный элемент, сделав его главным компонентом, и впоследствии использовать его как шаблон для всех скопированных элементов.
Для более быстрой и точной работы с большим количеством объектов используется функция выравнивания и умного распределения. В этом уроке вы увидите, как применять данные функции, чтобы упорядочивать объекты, которые были расставлены не точно.
После того как дизайн сайта готов, необходимо перейти к его оживлению. Как раз из этого урока вы узнаете, как устроено прототипирование в Фигме. Вы научитесь соединять элементы между собой, а также тестировать результат своей работы на разных устройствах, чтобы определить качество адаптивности сайта.
Из этого завершающего урока вы узнаете, как интегрировать проект с другими программами, а также экспортировать макет в разные форматы. Это важно для выгрузки вашего дизайна и его дальнейшего использования в создании сайта. Кроме того, в уроке рассказывается как экспортировать CSS.
Итак, изучив этот курс, вы не просто познакомитесь с возможностями данной программы, но и сможете получить основные знания, которые позволят вам работать в этой программе, и создавать первые несложные проекты. Это полезный курс для тех, что начинает осваивать дизайн сайтов с нуля. Однако то, что вы рассмотрите – это теория с наглядными примерами. Чтобы обучение действительно принесла пользу, необходима и практика, которую можно получить при самостоятельном повторении советов из уроков.
Полезные ссылки:
- Бесплатный видеокурс по Figma от GeekBrains;
- Профессиональный курс Figma 2.0 для новичков от SkillBox;
- Полноценный онлайн курс по веб-дизайну с нуля от SkillBox.
Источник: www.seostop.ru
Для чего нужна Фигма, и в чём её преимущества
Фигма — графический онлайн редактор для создания прототипов и дизайна сайтов.
Фигма — один из основных инструментов веб-дизайнера. Редактор позволяет создавать детальные интерактивные прототипы и дизайны, оставляя комментарии коллегам в режиме реального времени. Прототип или дизайн можно просматривать по ссылке, прямо из окна браузера — при внесении правок ссылка остается неизменной.
Все файлы хранятся в облаке Figma, в любой момент можно открыть и просмотреть макет без скачиваний.
Возможности графического редактора Figma
Совместное использование
В программе предусмотрена возможность редактирования файлов нескольким пользователям одновременно. До Фигмы дизайнеры пользовались в основном продуктами линейки Adobe: привычный всем Adobe Photoshop или Adobe XD (что чуть более удобно для веб- и ui/ux дизайнеров). В этом были свои сложности, например Photoshop запрашивал установку кучи шрифтов, если проект приходил извне или же его вел другой дизайнер студии; шрифты на маках отображались по разному (и это при одном и том же установочном файле шрифта); отсутствовал контроль версий (всё могло посыпаться, например, если коллега внес правки и забыл сообщить). Возникали и другие сложности при передачи проекта в верстку.
Всю эту головную боль авторы Figma взяли на себя, создав уникальный продукт, который очень сильно упростил жизнь дизайнерам и проектировщикам. Наконец появилась возможность создавать команды разработчиков и ограничивать доступ к публикуемым проектам.
Облачное хранение файлов
Все файлы проекта хранятся в облаке, не нужно сохранять и заливать куда-то каждый макет по отдельности, а затем искать нужную папку с ним и снова скачивать. Изменения сохраняются автоматически, можно увидеть, кто последним работал над проектом и сколько часов/дней/месяцев назад.
Компоненты и их варианты
В Фигме можно создавать компоненты (элемент, например меню сайта — копии этого элемента будут меняться вместе с ним на всех страницах). Что касаемо вариантов, в Фигме есть возможность делать один родительский элемент и отрисовывать все его состояния и размеры для всех разрешений макетов внутри одного компонента.
История версий
Фигма сохраняет ранние версии файла на 30 дней — при необходимости можно возвращаться к ним и дублировать любую из них. Сохранение происходит автоматически после внесения последнего изменения в файл. Кстати, можно добавлять версиям названия и описания.
Наличие фреймов и сеток
В Фигме имеются фреймы с предустановленными размерами для разных устройств: телефонов, планшетов, компьютеров, смарт часов. Остаётся только выбрать подходящий вариант девайса и начать с ним работать. Панель Layout Grid позволяет быстро создать и настроить нужную сетку. Сетки могут быть фиксированными, либо растягивающимися; при необходимости можно легко и быстро поменять цвет сетки.
У Фигмы есть онлайн версия, а есть десктопная версия. Для того чтобы начать работу, нужно зарегистрироваться и иметь стабильное подключение к интернету. У Фигмы разные тарифные планы, но для многих задач хватает и бесплатного тарифа.
На текущий момент Figma — самый удобный редактор для командной работы. Легкий в понимании, но с большими возможностями и наверное, большим будущим.
Источник: activica.ru
Figma — векторный онлайн-редактор
Figma — векторный графический кросс-платформенный редактор с возможностью работать над проектами командой. Легкий, простой и интуитивно понятный.
Из всех программ и веб-сервисов, представленных сейчас на рынке, Figma, как мне кажется, имеет самый маленький порог вхождения. На днях мне понадобилось сделать несколько макетов в векторе, чем я раньше никогда не занимался. Так за час разобрался и быстро закончил работу.
В Figma есть все основные векторные инструменты и методы работы с ними:
- примитивы, кривые, выравнивание, сортировка объектов;
- эффекты для слоев и фигур (в том числе режимы прозрачности, как в Photoshop);
- настройки обводок и шрифтов
- линейки и сетки.
- превращение фигур в маски и возможность помещать внутрь них другие объекты.
- автоматические подсказки для выравнивания и замыкания;
- добавление и удаление точек;
- превращение прямых в кривые Безье;
- визуальное редактирование градиентных заливок и т.д.
Главное достоинство Figma — это совместная работа над документами. Курсор другого пользователя появляется на экране, а все, что он делает, будет моментально отображаться у всех остальных. Для тех, кто привык работать в гуглодоках с совместными документами, просто must have.
Поддерживается работа в браузерах Chrome или Firefox, но можно скачать Get Desktop App — это приложения для Windows или macOS с встроенными браузера. Дополнительно можно скачать для iOS или Android приложение Figma Mirror, которое поможет UI-дизайнерам сразу просматривать мокапы интерфейса на экране мобильного устройства.
Ссылки в закладки:
Спасибо, что читаете! На данный момент большинство моих заметок, статей и подборок выходит в telegram канале «Левашов». Обязательно подписывайтесь, чтобы не пропустить новости мира ИТ, полезные инструкции и нужные сервисы.
Респект за пост! Спасибо за работу!
Хотите больше постов в блоге? Подборок софта и сервисов, а также обзоры на гаджеты? Сейчас, чтобы писать регулярно и радовать вас большими обзорами, мне требуется помощь. Чтобы поддерживать сайт на регулярной основе, вы можете оформить подписку на российском сервисе Boosty. Или воспользоваться ЮMoney (бывшие Яндекс Деньги) для разовой поддержки:
Заранее спасибо! Все собранные средства будут пущены на развитие сайта. Поддержка проекта является подарком владельцу сайта.
Источник: levashove.ru
Figma — что это за программа и как в ней работать
Существует множество графических редакторов для дизайнеров: Photoshop, Adobe XD, Sketch, Canva и т. д. Среди них выделяется Figma (Фигма) ― один из самых популярных и удобных продуктов для UX/UI-дизайна. В ней можно проектировать прототипы и работать командой в онлайн-формате. Если вы дизайнер, рекомендуем хотя бы на базовом уровне освоить Фигму.
В этом гайде мы расскажем вам, что такое Figma, какие у неё возможности и кому она может пригодиться. После того, как прочитаете нашу статью, вы разберётесь, как работать с Figma.
Figma — что это за программа простыми словами
Как я уже сказал, Figma — это удобный графический редактор для веб-дизайнеров и дизайнеров интерфейсов. Но по мимо дизайнеров, ей часто пользуются верстальщики и веб-разработчики для работы с макетами и переносом дизайна в HTML и CSS.
У фигмы есть 2-е отличительные особенности:
- Возможность работать командой дизайнеров над одним проектом
- Доступ к интерфейсу и макетам прямо через браузер
По большому счету, можно сказать, что фигма — это веб-сервис, а не программа, хотя есть возможность установить и приложение на компьютер и работать там. Благодаря своей простоте и удобству, большинство дизайнеров делают свой выбор в пользу Figma.
Видео-урок знакомства с интерфейсом Figma:
Также у фигмы есть огромное сообщество, которое с каждым годом только растет. Благодаря этому, figma постоянно улучшает свой интерфейс и периодически «выкатывает» своим пользователям новые фичи, которые упрощают работу над созданием дизайна.
Весь интерфейс программы выполнен на английском языке. То есть русской версии нет. Также как нет русификаторов и других «кряков». Если вы не знаете английского, то возможно первое время вам будет немного непривычно. Но я вас уверяю, через 2-3 дня работы вы будете хорошо в ней ориентироваться и без русской версии, потому что фигма достаточно интуитивная и удобная программа.
Интерфейс программы
В следующем уроке мы разберем с вами интерфейс программы Figma.
Оставьте комментарий Отменить ответ
3. Скачивание и установка Figma для работы на компьютере (Windows и Mac Os)
Чтобы скачать десктопную версию приложения Figma для Windows или Mac Os нажмите на меню «гамбургер» в левом верхнем углу и выберите надпись «Get Desctop App». В приложении работать удобнее, хотя можно работать через браузер. Приложение удобнее тем, что там можно создавать сразу несколько файлов. В браузере дела обстоят иначе.
Второй способ скачать программу figma на ваш компьютер — это перейти по адресу https://www.figma.com/downloads/ Там можно выбрать приложение для macOs либо для Windows.
После скачивания архива, его распаковки и открытия программы figma на вашем компьютере перед вами появиться надпись «Welcome to Figma». Вам предложат авторизоваться через браузер. Для этого вы должны быть авторизованы в вашем аккаунте. Нажмите на кнопку «Log in with browser».
Вас перенаправит в браузер. Там нажмите на кнопку «Open the Decktop App».
Поздравляю! Вы скачали программу Figma и установили её на ваш компьютер. Так будет выглядеть интерфейс программы после её установки. В следующем уроке мы кратко рассмотрим интерфейс этого приложения.
Работа с сообщениями
Так как Figma позволяет вести работу над проектом командой из нескольких человек, можно настроить возможность комментирования. Это позволит подписать некоторые части интерфейса, оставить комментарии для коллег и клиента.
Меню обратной связи и комментариев
Комментарии можно перемещать по холсту, отмечать как решенные, а также включать и отключать их отображение. К каждому комментарию можно оставлять свои, если у пользователя есть на это разрешение.
Загрузка и установка
Существует сразу две версии Figma. Одна из них используется в режиме онлайн прямо в браузере, а вторая устанавливается на ПК в качестве приложения. Давайте рассмотрим, как проходит процесс инсталляции:
- Сначала, как и в любых других случаях, пользователю необходимо скачать исполняемый файл. Для этого переходим ниже, загружаемый архив и распаковываем его при помощи прикрепленного кода.
- Запускаем установку и заканчиваем процесс, переходя от этапа к этапу.
- Открываем программу при помощи иконки, которая автоматически добавится на рабочий стол Windows.
Готово. Теперь с приложением можно работать.
Что выбрать
Дизайнеры всё чаще выбирают Figma. Но Figma не может полноценно заменить Photoshop. В ней нет многих возможности, которые нужны дизайнерам. Например, в Figma нельзя работать с растровой графикой. Поэтому верстальщику полезно знать оба редактора. Особенно тем, кто планирует работать с разными клиентами.
Но осваивать одновременно два редактора трудно. Лучше выбрать один, разобраться в нём и постепенно изучать второй.
Figma подойдёт тем, кто хочет начать работать быстро прямо из браузера, в удобной среде, совместно с коллегами, при этом не платить за ПО. Про работу в Figma мы пишем в нашем блоге, например, «Старт в Figma для верстальщика», и рассказываем на курсах для верстальщиков в HTML Academy.
Дизайнеры всё реже делают макеты целиком в Фотошопе. Обычно с его помощью редактируют фоны, фотографии, коллажи и баннеры, а потом вставляют в макет в другом графическом редакторе. Поэтому выбирайте Фотошоп, если хотите работать со сложной графикой и готовы штурмовать громоздкий интерфейс, хранить несколько версий одного и того же проекта и оплачивать подписку.
Как уже говорилось, программа отличается минимальными системными требованиями и способна работать практически на любом компьютере.
- Центральный процессор: 1.6 ГГц.
- Оперативная память: 1 Гб.
- Пространство на жестком диске: от 100 Мб.
- Платформа: Microsoft Windows 32/64 Bit.
По прикрепленный ниже кнопке можно бесплатно скачать последнюю русскую версию приложения в месте с кряком.
| Разработчик: | Figma |
| Информация обновлена и актуальна: | 2022 год |
| Название: | Figma |
| Платформа: | Windows XP, 7, 8, 10 |
| Язык: | Русский |
| Лицензия: | RePack |
| Пароль к архиву: | bestsoft.club |
Источник: fobosworld.ru
Магловский способ творить магию: зачем Adobe купил Figma и как это изменит веб-дизайн
Создатель Photoshop компания Adobe покупает своего самого заметного конкурента в области цифрового дизайна, стартап Figma, за $20 млрд. Основатели Figma в результате этой крупнейшей на рынке программного обеспечения сделки станут миллиардерами, но реакция на новость была неоднозначной. Некоторые эксперты считают, что Adobe сильно переплатила — ее капитализация после объявления о покупке за день уменьшилась на $29 млрд. А пользователи Figma опасаются, что дизайнерам эта сделка не сулит ничего хорошего
Студенты факультета информатики Университета Брауна Дилан Филд и Эван Уоллес задумывали свой стартап как доступную альтернативу Photoshop. Когда Figma запустилась в 2015 году, TechCrunch написал, что новая компания намерена «бороться» с Adobe. «Можно принять это за наивную наглость, но, вероятно, такая юношеская самоуверенность как раз и необходима, чтобы одержать победу над Голиафом в мире дизайна», — писал автор статьи, имея в виду под Голиафом Adobe. В интервью TechCrunch 23-летний Дилан Филд тогда заявил, что Adobe «не понимает, как устроена совместная работа», а их Adobe Creative Cloud «на самом деле является облаком только по названию».
Закончили чтение тут
В 2021 году Филд писал у себя в Twitter: «Наша цель быть Figma, а не Adobe». В 2022-м на этой же платформе он сообщил, что Figma теперь станет частью Adobe, которая покупает ее за $20 млрд.
Это двукратный рост оценки стоимости компании по сравнению с июнем 2021 года, когда Figma привлекла от инвесторов $200 млн при оценке в $10 млрд. По данным Forbes, Филд и Уоллес владеют примерно по 10% Figma, что означает, что после завершения сделки каждый из них станет миллиардером. Армия преданных поклонников Figma, которые исчисляются миллионами и которые привыкли платить за продукты от $12 до $45, опасается повышений цены и других ухудшений после поглощения, а инвесторы полагают, что Adobe переоценил своего молодого и дерзкого конкурента и предложил слишком много.
Поглощение конкурента
Adobe появилась в 1982 году и исторически специализировалась на программном обеспечении (ПО) для создания и публикации разнообразного контента, включая графику, фотографию, иллюстрацию, анимацию и мультимедиа в целом. Компания также расширилась до программного обеспечения для цифрового маркетинга и к 2021 году считалась одним из мировых лидеров в области решений для управления цифровым опытом клиентов.
Для Adobe поглощение конкурирующих компаний — привычная стратегия расширения собственного функционала и возможностей. В 2005 году Adobe приобрела Macromedia, разработавшую технологию, позже названную Adobe Flash, — с помощью этого подключаемого инструмента можно было интерактивно взаимодействовать с другими пользователями.
В январе 2019-го Adobe объявила о приобретении компании Allegorithmic, занимающейся 3D-текстурированием, в 2020 году — о покупке сервиса управления проектами Workfront, а в августе 2021-го купила облачную платформу для совместной работы с видео Frame.io. По данным Adobe, годовой регулярный доход Frame.io вырос более чем на 50% во II квартале, а продажи Workfront — более чем на 35%.
По мнению руководителя агентства разработки бизнес-стратегий «Экспонента» Виктории Добровольской, в последние несколько лет стратегия развития Adobe полностью сфокусирована на инструментах управления цифровым клиентским опытом. По ее словам, с 2019 года заметно, что компания ориентируется не только на директоров по маркетингу, но и на креативных профессионалов в целом.
Несмотря на многочисленные поглощения и усовершенствование ПО, с начала года бумаги Adobe потеряли более трети своей стоимости, а выручка компании в III квартале составила $4,43 млрд, показав рост менее 15% третий квартал подряд. Это, вероятно, связано с общим падением спроса на ПО для удаленной работы, таких как Zoom, после завершения пандемии. Кроме того, некоторые инвесторы ожидают от Adobe слабых результатов, потому что считают продукты компании устаревшими, дорогими и громоздкими.
Материал по теме
Сколько стоит Figma на самом деле?
Первая реакция рынка неоднозначна. Так, фонды Mizuho Securities, Oppenheimer и BMO Capital Markets на прошлой неделе понизили рейтинги акций Adobe.
На новости о сделке акции Adobe упали на 17%, что стало самым большим однодневным падением с сентября 2010 года. Рыночная капитализация компании в результате сократилась на $29 млрд. Александр Горный, основатель United Investors и momeditation.app, согласен, что покупка выглядит спорно: «Краткосрочное падение акций Adobe в любом случае непропорционально возможной переплате. Капитализация компании упала почти на $30 млрд, то есть акционеры оценили Figma в «минус $10 млрд против $20 млрд, которые заплатил Adobe».
Причина столь резкой реакции рынка на покупку заключается в разнице жизненных циклов компаний. Горный считает, что биржевые инвесторы в Adobe покупали суперстабильный, суперустойчивый, прогнозируемый бизнес: «По духу это была почти инвестиция в нефтяную компанию. А сейчас эта «нефтяная компания» пошла в эксперименты с какими-то стартапами, и те, кто ценил стабильность и предсказуемость, сразу сбросили свои акции. А те, кто ценит стартапы, в Adobe все равно не инвестируют — одной Figma в большой корпорации для них мало».
Акции Adobe в этом году падали и до новости о сделке: общее падение составило 45%, что опережает падение индекса Nasdaq 100 на 27%.
Ростислав Кац, юрист Forward Legal, считает, что это в первую очередь связано с возрастающей конкуренцией: «В последние годы доля Adobe на рынке ПО для дизайна стала сокращаться из-за облачных сервисов, таких как Figma, Canva и др. Недавний запуск Adobe собственного облачного сервиса для дизайна Adobe Express, скорее всего, не увенчается успехом из-за конкуренции».
Большинство инвесторов согласны, что Adobe переплатила за Figma. «У Adobe были очень высокие мультипликаторы, и после сделки они упали. Значит, рынок отреагировал негативно и считает, что Adobe переплатил», — говорит принципал венчурного фонда Fort Ross Ventures Денис Ефремов.
Еще в начале сентября появлялись слухи о том, что Figma собирается выходить на IPO, и они были подкреплены тем, что оценка компании составляла $10 млрд, однако сама Figma никак не комментировала эти слухи — и теперь мы знаем почему. Денис Ефремов отмечает, что ситуация, когда стратегический инвестор перехватывает компанию, которая может стать публичной, достаточно стандартная: «При этом стратег платит премию, что мы видим и в сделке с Figma». Он считает, что term sheet (документ об основных условиях сделки) мог быть подписан еще в прошлом году.
Однако одобрят ли покупку Федеральная торговая комиссия и Министерство юстиции США? Антимонопольные ведомства должны будут установить, какие последствия для конкуренции на конкретном товарном рынке повлечет за собой эта сделка. Сделка будет согласована, если она не приведет к существенному снижению конкуренции или не породит условия для создания монополии в США или их части.
Материал по теме
Кац считает, что Adobe может обосновать свою сделку двумя факторами: наличием положительного эффекта для потребителя и узкими продуктовыми границами рынка Figma: «Об этом свидетельствует пресс-релиз Adobe, в котором написано, что «вместе Adobe и Figma переосмыслят будущее творчества и продуктивности и будут обладать огромными, быстрорастущими рыночными возможностями и способностями для создания значительной ценности ПО для клиентов, акционеров и отрасли».
Кроме того, Adobe может утверждать, что рынок ограничивается облачными дизайн-сервисами. Доля Adobe Express на этом продуктовом рынке достаточно мала: «При таких условиях по сути произойдет замена Figma на Adobe с незначительным увеличением доли. Если же ФТК или Минюст определят товарный рынок шире, то гипотетически совокупная доля компаний на этом рынке достаточно велика, чтобы сделку запретили».
Однако Кац видит и косвенные свидетельства того, что в Adobe уверены в одобрении поглощения: «Если антитрестовые ведомства не согласуют сделку, Adobe обязана будет выплатить Figma штраф в миллиард долларов. Вряд ли компания к этому готова».
От генератора мемов к миллиардной компании
Дилан Филд и Эван Уоллес начали работать над Figma в 2012 году, когда вместе изучали информатику в Университете Брауна. Уоллес изучал графику и был ассистентом преподавателя на факультете компьютерных наук, а Филд был старостой группы на этом же факультете. Филд и Уоллес экспериментировали с разными идеями, в том числе с программным обеспечением для дронов и генератором мемов, прежде чем остановились на программном обеспечении для графического веб-редактора.
В том же году Филд, которому было 19, бросил учебу и переехал в Калифорнию, потому что получил $100 000 от The Thiel Fellowship — ежегодную стипендию Питера Тиля, которая предусмотрена как раз для тех стартаперов, которые уходят из университетов, чтобы заняться своим делом. К этому моменту идея стартапа уже сформировалась, и Филд с Уоллесом, который все-таки сначала доучился, занялись разработкой ПО, в котором хотели «взять некоторые функции Photoshop и сделать их доступными для всех».
«Это может звучать немного глупо, но я думаю, что программирование — самое близкое к магии, что у нас есть», — говорил Филд в 2012 году. Ссылаясь на то, что он вырос на фильмах о Гарри Поттере, Филд сказал, что считает программирование и технологии сродни магловским попыткам творить магию.
Однако успех молодой компании пришел не по мановению волшебной палочки. Неопытность Филда в руководстве привела к проблемам как с управлением первой командой Figma, так и со сбором средств. На запуск бета-версии первого продукта Figma ушли годы, и многие разочарованные сотрудники уволились раньше, чем это произошло. Уоллес покинул компанию в прошлом году.
Привлечение финансирования тоже стало проблемой. Филд рассказывал в интервью Business Insider, что на первых порах, встречаясь с инвесторами, они довольно невнятно объясняли им, что за продукт их стартап создает и какие проблемы он решит. Инвестор Джон Лилли тогда отказался инвестировать в Figma со словами: «Мне кажется, вы пока не понимаете, что вы делаете». Филд говорит, что это возымело отрезвляющий эффект и он серьезнее подошел к формулированию целей компании. В итоге Лилли возглавил раунд А финансирования Figma на $14 млн в декабре 2015 года.
Удаленная работа во время пандемии стала еще одним толчком к развитию компании, которая в 2021 году запустила новый продукт — виртуальную доску FigJam, вдвое увеличила выручку и привлекла инвестиции.
А что будет с дизайнерами?
Figma на данный момент предлагает два продукта: онлайн-платформу для дизайна под названием Figma и виртуальную доску для совместной облачной работы FigJam. Среди клиентов компании — Microsoft, Zoom, Twitter, Netflix и Dropbox.
Инструменты Figma, в отличие от продуктов Adobe, не являются классическим ПО, требующим установки. Платформа разработана как web-приложение, что позволяет пользователям быстро делиться разработанными интерфейсами друг с другом, просто отправив ссылку. Говоря простым языком, она работает по принципу «Google Документов», но с более сложным набором функций.
По словам создателя Figma, со временем он перестал видеть в Adobe конкурента: «Я вырос на программном обеспечении Adobe, — сказал он. — Возможность помочь Adobe подумать о креативных инструментах следующего поколения, о том, как они используются совместно и что они означают в контексте веб-браузера, — это сбывшаяся мечта».
Материал по теме
Новость о слиянии с Adobe встревожила многих дизайнеров по всему миру, которых Figma приучила к своим простым и доступным функциям. Figma — один из самых популярных инструментов на данный момент, и хотя Филд, который продолжит занимать должность гендиректора компании, обещает, что идентичность Figma останется нетронутой, не все пользователи в это верят. Дизайнеры, с которыми поговорило издание Protocol, мрачно шутят, что на прошлой неделе они носили траур по Елизавете II, а теперь скорбят по Figma. «Мне нравятся некоторые из продуктов Adobe, но они обычно довольно бесцеремонно обращаются со своими клиентами, а Figma всегда была очень клиентоориентированной», — говорит глава отдела продуктового дизайна HBO Max Майкл Макуотерс.
Российские дизайнеры, опрошенные Forbes, разделяют эти опасения. Web-дизайнер Екатерина Хвостенко считает, что объединение функций Photoshop, Illustrator и Figma не приведет ни к чему хорошему: «Думаю, классно, когда все функции в одном месте, но, с другой стороны, это может превратиться в кашу. Лично мне удобнее, когда все по полочкам». С ней согласна и графический дизайнер Анастасия Багель: «Я люблю Adobe, но считаю, что лучше бы они существовали по отдельности. Все же Figma была бесплатной и доступной в России, и это было спасением для многих начинающих дизайнеров, у которых нет возможности платить за подписки».
Екатерина Демосюк, ведущий UX/UI дизайнер мессенджера Gem4me, говорит, что продукты Adobe всегда были гораздо сложнее, чем Figma, и есть вероятность, что с добавлением новых инструментов использование web-приложения усложнится: «Хотелось бы, чтобы новые владельцы позволили существовать этому активу в качестве отдельного проекта». Она же добавляет, что у Adobe есть собственный графический редактор для дизайна интерфейсов, и предполагает, что через некоторое время его полностью заменят на онлайн-редактор Figma.
Макуотерс из HBO Max за свою карьеру уже сменил около 10 разных инструментов, поэтому готов ко всему, но все же надеется на лучшее: «Не обязательно же ты совершаешь покупку на $20 млрд с единственной целью уничтожить этот продукт. Возможно, у Adobe получится посмотреть, что Figma делает хорошо, и улучшить свои собственные сервисы».
Источник: www.forbes.ru