Кейс: как Figma обновили свой бренд


19.10.2019 Время чтения - 5 минут 838

Новая жизнь Figma

 

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

 

Развивающийся язык бренда Figma

Тори Хинн, креативный директор Figma:

Я присоединилась к Figma около года назад с целью развития бренда. Конечно, я была знакома с Figma ранее, но когда я начала анализировать её язык, я поняла что уже проделанно много работынема. Нам не нужно было начинать с нуля, а просто оснастить Figma взлётно-посадочной полосой подлиннее, чем сейчас. У языка бренда уже были концептуальные и ценностные основы, но когда они были созданы, Figma была неопытным новичком. Нам нужен был широкий язык бренда, который соответствовал бы росту компании. Например, у нас появился блог. Если дизайнер работает над визуалом блога, каким правилам должна соответствовать картинка? Мы приняли руководство по бренду, и дополнили его новыми страницами.

Figma’s brand

 

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

 

Становление личности Figma

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

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

  • Любопытный – умный, игривый, образный. Твой друг с далёкими идеями. Он всегда хочет учиться чему-то новому и обдумывать совсем не очевидные вещи.
  • Яркий – динамичный, уверенный в себе, живой. Figma любит ссылаться на определенные темы и гордится этим.
  • Честный – инклюзивный, чуткий, доступный. Команда Figma не боится признать, что она знает далеко не всё.
  • Дерзкий – мощный, неожиданный, не соответствующий. Figma не живёт в соответствии с принципами делая то, что для неё правильно и верно.

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

 

Формы, делающие процесс особенным

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

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

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

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

Shapes That Show the Process Figma

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

Типография с причудами

В поисках нового фирменного шрифта один из наших дизайнеров натолкнулся на шрифт Whyte, который на первый взгляд выглядит вполне нормально, но если присмотреться, то вы начнёте замечать некоторые странности. Whyte на самом деле выпускается в двух разных версиях — стандартной и чернильной. Figma выбрала чернильную версию, которая использует так называемые «чернильные ловушки». Исторически сложилось так, что когда люди использовали металлические листы для ручной печати, эти ловушки вырезались для того, что бы в них попадал избыток чернил. Это добавляет иллюстративный элемент шрифту, который акцентирует внимание на обычно невидимой части.

Figma Whyte font

 

Использование Figma для её же обновления

Мы работали исключительно в Figma, так как ранее это всё делалось только в Photoshop и Illustrator. Пришлось придумывать новые способы проработки деталей. Работа в команде стала залогом успеха. Это был не тот проект, где мы могли или должны были «разделять и властвовать». Нам нужно было работать вместе и одновременно. И это мы могли сделать только в Figma. Мы хотели найти способы продемонстрировать силу программы через сам процесс или с помощью иллюстраций, которые мы создавали. Поэтому мы надеемся, что обновление является доказательством того, что может сделать Figma.

Figma Refresh Figma

Figma Homepage 02

Оригинальная публикация.

Читайте так же: Удалённое тестирование юзабилити