Приглашение на воркшоп от спикера Серго Мацони — диджитал-дизайнера Publicis Groupe 💣
Через 5 минут начинаем 🔥
Держите ссылку на воркшоп
https://www.youtube.com/watch?v=z-Ai4ZGjjFw
Держите ссылку на воркшоп
https://www.youtube.com/watch?v=z-Ai4ZGjjFw
YouTube
Craftum Workshop: создаем сайт для сети пекарен
Craftum Workshop: создаем сайт в прямом эфире 💥
СКАЧАТЬ МАТЕРИАЛЫ ДЛЯ ВОРКШОПА:
https://drive.google.com/drive/folders/1mPIDe-uGHmuvAfE3psgI3Q0pQQVzqYBL?usp=sharing
Трое экспертов сделают новую версию сайта сети пекарен Беккер.
Параллельно поговорим…
СКАЧАТЬ МАТЕРИАЛЫ ДЛЯ ВОРКШОПА:
https://drive.google.com/drive/folders/1mPIDe-uGHmuvAfE3psgI3Q0pQQVzqYBL?usp=sharing
Трое экспертов сделают новую версию сайта сети пекарен Беккер.
Параллельно поговорим…
🔥3😱2👍1👏1
1-й блок о структуре сайта уже прошел 🔥
Вы с нами?
Если еще нет, подключайтесь к трансляции по ссылке: https://www.youtube.com/watch?v=z-Ai4ZGjjFw
Вы с нами?
Если еще нет, подключайтесь к трансляции по ссылке: https://www.youtube.com/watch?v=z-Ai4ZGjjFw
👍8🔥1
Огромное спасибо тем, кто был с нами вчера на воркшопе 🔥
Обязательно делитесь своими впечатлениями в комментариях и присылайте, что получилось у вас 🙂
Обязательно делитесь своими впечатлениями в комментариях и присылайте, что получилось у вас 🙂
👏4❤3👍1
А вот наш результат👇
Голосуйте, какой вариант сайта вам нравится больше
Голосуйте, какой вариант сайта вам нравится больше
This media is not supported in your browser
VIEW IN TELEGRAM
Версия сайта Беккер от наших экспертов
👍9🔥3
👍1
Как быть в профессиональной «тусовке» дизайнеров, узнавать новости, лайфхаки и искать вдохновение?
Есть проверенный метод — слушать подкасты 🎧
Сделали интересную подборку, добавляйте пост к себе в избранное, чтобы не потерять 👆
Есть проверенный метод — слушать подкасты 🎧
Сделали интересную подборку, добавляйте пост к себе в избранное, чтобы не потерять 👆
👍6🔥6❤1
Что такое брендбук и зачем он нужен? 🤔
«Книга бренда» (от английского brand book) — документ в виде брошюры, журнала или буклета. Это основной помощник в поддержке единства фирменного стиля компании.
📌 Зачем он нужен
— Поддержание единого образа компании.
— Знакомство новых сотрудников с брендом. Это будет полезно, чтобы быстро рассказать об особенностях компании.
— Быстрое оформление любых дизайн-макетов. Четкие инструкции помогут сотрудникам соблюдать фирменный стиль.
📌 Что туда входит
— Описание позиционирования компании. Миссии организации, ее ценности, УТП и так далее.
— Подробное описание целевой аудитории. Кто, зачем и почему приходит в компанию и взаимодействует с ней.
— Значение бренда. Почему было выбрано такое название, что оно представляет собой. Здесь же может быть описан слоган, если таковой имеется.
— Фирменный знак, логотип в разных вариантах.
— Фирменные цвета и шрифты. Здесь прописываются все шрифты, их размеры, а также вариации цветов.
— Дополнительная графика. Если у бренда есть паттерны, текстуры, иллюстрации, иконографика и прочее, то об этом также следует рассказать.
— Примеры оформления. В этом разделе следует показать, как оформление баннеров будет выглядеть в различных вариациях, например, на белом и черном фоне
📌 Как выглядит брендбук?
Мы подобрали несколько удачных примеров, которые можно изучать часами 👇
Apple (PDF)
Google (PDF)
Microsoft (PDF)
«Книга бренда» (от английского brand book) — документ в виде брошюры, журнала или буклета. Это основной помощник в поддержке единства фирменного стиля компании.
📌 Зачем он нужен
— Поддержание единого образа компании.
— Знакомство новых сотрудников с брендом. Это будет полезно, чтобы быстро рассказать об особенностях компании.
— Быстрое оформление любых дизайн-макетов. Четкие инструкции помогут сотрудникам соблюдать фирменный стиль.
📌 Что туда входит
— Описание позиционирования компании. Миссии организации, ее ценности, УТП и так далее.
— Подробное описание целевой аудитории. Кто, зачем и почему приходит в компанию и взаимодействует с ней.
— Значение бренда. Почему было выбрано такое название, что оно представляет собой. Здесь же может быть описан слоган, если таковой имеется.
— Фирменный знак, логотип в разных вариантах.
— Фирменные цвета и шрифты. Здесь прописываются все шрифты, их размеры, а также вариации цветов.
— Дополнительная графика. Если у бренда есть паттерны, текстуры, иллюстрации, иконографика и прочее, то об этом также следует рассказать.
— Примеры оформления. В этом разделе следует показать, как оформление баннеров будет выглядеть в различных вариациях, например, на белом и черном фоне
📌 Как выглядит брендбук?
Мы подобрали несколько удачных примеров, которые можно изучать часами 👇
Apple (PDF)
Google (PDF)
Microsoft (PDF)
👍8🤩2🤔1
#плагин_фигма
Плагин для Figma Image palette был разработан на замену инструмента «Пипетка».
С ним не нужно извлекать цвета из изображений вручную, т.к. он автоматически формирует палитру из 5 цветов, пример на картинке ☝️
Этот плагин полезен, когда сложно определиться с цветами. Например, если есть в голове идея, но нет точных параметров.
Загрузив подходящую картинку и подобрав с помощью плагина цвета, можно сократить время на подбор подходящей палитры для сайта.
Установить плагин просто:
1) перейдите по ссылке
2) авторизуйтесь (войдите в систему или зарегистрируйтесь, если ещё этого не сделали)
3) нажмите install
Готово 👌
Плагин добавлен и готов к использованию.
Поделитесь в комментариях, какие плагины в фигме используете? 🙂👇
Плагин для Figma Image palette был разработан на замену инструмента «Пипетка».
С ним не нужно извлекать цвета из изображений вручную, т.к. он автоматически формирует палитру из 5 цветов, пример на картинке ☝️
Этот плагин полезен, когда сложно определиться с цветами. Например, если есть в голове идея, но нет точных параметров.
Загрузив подходящую картинку и подобрав с помощью плагина цвета, можно сократить время на подбор подходящей палитры для сайта.
Установить плагин просто:
1) перейдите по ссылке
2) авторизуйтесь (войдите в систему или зарегистрируйтесь, если ещё этого не сделали)
3) нажмите install
Готово 👌
Плагин добавлен и готов к использованию.
Поделитесь в комментариях, какие плагины в фигме используете? 🙂👇
🥰5🔥4👍2
5 сайтов, которые должен знать каждый дизайнер❤️🔥
Скорее сохраняй себе, чтобы не потерять ⬇️
1. Mesh-gradients Бесплатная коллекция градиентов
2. Icons8.com 3D-иконки, иллюстрации
3. colormind.io Подбор цветовых сочетаний
4. lapa.ninja Для поиска референсов и вдохновения
5. awwwards.com Сайт конкурса профессиональных веб-дизайнеров и разработчиков
Скорее сохраняй себе, чтобы не потерять ⬇️
1. Mesh-gradients Бесплатная коллекция градиентов
2. Icons8.com 3D-иконки, иллюстрации
3. colormind.io Подбор цветовых сочетаний
4. lapa.ninja Для поиска референсов и вдохновения
5. awwwards.com Сайт конкурса профессиональных веб-дизайнеров и разработчиков
🔥7👍5❤2
Топ-5 плагинов для Figma в 2022 году 💣
Здесь не будет банальных плагинов, вроде «как сделать текст по кругу», а только действительно актуальные плагины, которые сильно упростят работу 😉
1. Better font picker
Плагин помогает выбирать шрифты с предварительным просмотром.
Так, можно гораздо быстрее принять решение — использовать выбранный шрифт или нет, а не «протыкивать» каждый вручную.
▶️ Добавить плагин Better font picker
2. Batch styler
Batch Styler — отличное решение для ситуаций, когда есть много стилей текста, и вам нужно изменить шрифты этих стилей текста быстро и без лишних действий.
Неважно, сколько текстовых стилей или шрифтов вам нужно изменить, Batch Styler позаботится обо всем и сохранит все типы толщины шрифтов и другие стили.
▶️ Добавить плагин Batch styler
3. Autoflow
Плагин позволяет создавать связи кривыми между объектами, артбордами и расположением в 2 клика.
С этим инструментом легко проиллюстрировать связи между экранами и схемы переходов от страницы к странице.
▶️ Добавить плагин Autoflow
4. LilGrid
Плагин LilGrid стоит на страже порядка в вашем интерфейсе.
Очень полезный инструмент для тех, кто хочет организовать максимально аккуратное рабочее пространство.
При этом, LilGrid не поменяет элементы дизайна, а только поможет их упорядочить на холсте.
▶️ Добавить плагин LilGrid
5. TinyImage
Плагин TinyImage Compressor позволяет экспортировать ваши файлы в Figma и сжать их размер без потери качества.
Плагин оптимизирует JPEG, а также PNG без фона, автоматически преобразует множественную загрузку в ZIP-папку.
Правда у плагина есть ограничение на сжатие 15 файлов бесплатно, после придётся приобрести лицензию, но многие дизайнеры отмечают, что плагин сжимает файлы на 90% лучше, чем встроенные инструменты Figma.
▶️ Добавить плагин TinyImage
#плагин_фигма
Здесь не будет банальных плагинов, вроде «как сделать текст по кругу», а только действительно актуальные плагины, которые сильно упростят работу 😉
1. Better font picker
Плагин помогает выбирать шрифты с предварительным просмотром.
Так, можно гораздо быстрее принять решение — использовать выбранный шрифт или нет, а не «протыкивать» каждый вручную.
▶️ Добавить плагин Better font picker
2. Batch styler
Batch Styler — отличное решение для ситуаций, когда есть много стилей текста, и вам нужно изменить шрифты этих стилей текста быстро и без лишних действий.
Неважно, сколько текстовых стилей или шрифтов вам нужно изменить, Batch Styler позаботится обо всем и сохранит все типы толщины шрифтов и другие стили.
▶️ Добавить плагин Batch styler
3. Autoflow
Плагин позволяет создавать связи кривыми между объектами, артбордами и расположением в 2 клика.
С этим инструментом легко проиллюстрировать связи между экранами и схемы переходов от страницы к странице.
▶️ Добавить плагин Autoflow
4. LilGrid
Плагин LilGrid стоит на страже порядка в вашем интерфейсе.
Очень полезный инструмент для тех, кто хочет организовать максимально аккуратное рабочее пространство.
При этом, LilGrid не поменяет элементы дизайна, а только поможет их упорядочить на холсте.
▶️ Добавить плагин LilGrid
5. TinyImage
Плагин TinyImage Compressor позволяет экспортировать ваши файлы в Figma и сжать их размер без потери качества.
Плагин оптимизирует JPEG, а также PNG без фона, автоматически преобразует множественную загрузку в ZIP-папку.
Правда у плагина есть ограничение на сжатие 15 файлов бесплатно, после придётся приобрести лицензию, но многие дизайнеры отмечают, что плагин сжимает файлы на 90% лучше, чем встроенные инструменты Figma.
▶️ Добавить плагин TinyImage
#плагин_фигма
👍5🔥4