Крокет на приглашение

Автоматический конструктор приглашений на мероприятия «Открытие Брокер» в «Фигме»

Компания «Открытие Брокер» регулярно проводит мероприятия для клиентов, где рассказывает о том, во что лучше сейчас вложиться и как правильно торговать на бирже. Раньше на создание приглашения уходило несколько часов. Чтобы упростить и ускорить процесс, я придумал специальный конструктор для создания приглашений.

Привет!

Я — графический дизайнер. В профессии я уже четыре года, занимался дизайном для сайтов и соцсетей, делал книги и плакаты, создавал фирменную символику. Около полугода я проработал в компании «Открытие Брокер», биржевом подразделении ФК «Открытие».

«Открытие Брокер» регулярно проводит мероприятия для клиентов, где рассказывает о том, во что лучше сейчас вложиться и как правильно торговать на бирже. Компания существует уже 25 лет и раньше на подобные мероприятия приглашали личные брокеры по телефону, а затем на смену телефону пришла электронная почта.

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

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

Приглашение состоит из карточек. Это основа фирменного стиля «Открытия».

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

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

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

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

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

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

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

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

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

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

У всех карточек можно менять цвет, выбирая из тех, что есть в брендбуке. При этом текст сам подстроится под цвет фона. Это работает потому, что дизайнер продумал все комбинации заранее. На карточке с логотипом можно добавить до трёх логотипов партнёров. Единственная карточка, которая не меняется — дисклеймер, он всегда одинаковый.

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

На создание конструктора со всеми нюансами и деталями у меня ушло две недели в свободное от работы время. Чистого времени я затратил примерно 72 часа.

Как я уже говорил ранее, сборка приглашения могла занимать дни, в лучшем случае — несколько часов. С появлением конструктора из цепочки исчезли лишние звенья. Если текст готов, то приглашение можно собрать за 15 минут, даже если человек никогда не работал с «Фигмой». Я составил подробную инструкцию с подсказками на всех этапах сборки.

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

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

Ссылка на конструктор.