ДИЗАЙНЁРСТВО
280 subscribers
86 photos
4 videos
87 links
Дизайнерское братство. Проекты. Заказчики. Биржи. Инструменты. Канал будет полезен всем дизайнерам.

По вопросам рекламы: @ZokitiN
Download Telegram
Channel photo updated
​​Где брать шрифты: подборка платных и бесплатных ресурсов

Бесплатных и платных шрифтов — немереное количество. Их можно найти и с помощью гугл-запроса, и в тематической группе во «ВКонтакте», и на сайте парижской словолитни, и на компьютере соседа. Главное, что нужно сделать при поиске шрифтов — внимательно прочитать лицензию на понравившейся шрифт. Он может быть бесплатным только для личного, или для личного и коммерческого использования. Платный шрифт можно купить на год или навсегда, для установки на компьютер, встраивания в программное обеспечение (для видеоигр), использования на сайтах (с учетом того, что на компьютерах пользователей шрифт не установлен) и не только.
​​Наилучшее состояние дизайнера - находиться в потоке. Когда огонь креативности горит внутри, а идеи так и льются для того, чтобы их воплотили в жизнь 🔥

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

На помощь приходят методы генерации идей, работающие безотказно даже при самых жестких дедлайнах 🚀

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

Этапы мозгового штурма:

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

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

3 этап - оценка и группировка идей.
На этом этапе необходимо отобрать наиболее ценные и интересные идеи, проанализировать их в соответствие с задачей.

Мозговой штурм отлично подходит для командной генерации идей и напрямую зависит от психологической атмосферы в команде.

Однако существует также ряд методов мозгового штурма для "одного мозга", о которых мы расскажем в следующей части 🌞
​​Тревога, страх неудачи, неуверенность в себе...👀

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

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

👺 Синдром самозванца первый в нашем списке.
Этот синдром, пожалуй, испытывает каждый представитель творческой профессии.

Мысли, которые посещают дизайнера, испытывающего синдром самозванца:
"у меня недостаточно знаний, умений и навыков, чтобы заниматься дизайном";
"я недостаточно хорош(-а) для того, чтобы находиться здесь";
"я оказался(-лась) здесь случайно";
"меня скоро раскроют и поймут, что я не так хорош(-а)";
"мне все сходит с рук";
"вокруг множество спецов гораздо лучше меня".

Чем же грозит синдром самозванца дизайнеру?
1. Низкая оценка стоимости собственного труда и страх повысит цены на свои услуги.
2. Прокрастинация и оттягивание начала работы.
3. Просроченные дедлайны из-за оттягивания сдачи дизайна.
4. Страх презентации собственной работы.
5. Отказ от более амбициозных задач из-за страха разочарования.

Знакомо? Уверены, что да!

Плохая новость в том, что это не пройдет никогда. Каких бы высот вы не достигли.

Однако с этим ощущением можно сотрудничать и развиваться.

О причинах возникновения синдрома самозванца и методах борьбы с ним расскажем на следующей неделе ✌🏻
​​Методы создания заголовков

Метод де Боно или метод 6 шляп

Особенность метода заключается в том, что заголовок создается исходя из 6 различных точек зрения (шляп):

🎩Красная шляпа. Художник
Отвечает за эмоции, предчувствие, интуицию.
"Вы вчера сломали ноготь..."
"Заболела любимая собака?"
"Снова растерялись когда к вам обратился иностранец на английском?"

🎩Желтая шляпа. Оптимист
Выгоды и преимущества. Заголовок часто строится в виде призыва к действию.
"Выучить английский з 2 месяца - реально! Узнайте как!"
"Ваши охват взлетят. Получите бесплатную консультацию!"

🎩Черная шляпа. Пессимист
Обращает внимание потребителя на возможные риски и недостатки от отказа от продукта. Часто подается в виде списка или вопроса.
"10 ужасных ошибок дизайнеров"
"5 причин почему ваши отношения с детьми испортятся"

🎩Зеленая шляпа. Креативщик
Провокация и любопытство. Генерирует идеи и гипотезы.
"Как убить всех наповал благодаря новому стилю?"
"Что нового вы узнаете в наше блоге о дизайне?"

🎩Белая шляпа. Ученый
Факты, цифры, доказательства. Предполагает использование цифр в заголовке.
"5 принципов успешных дизайнеров"
"10 шагов к подтянутому телу"

🎩Синяя шляпа. Руководитель
Конкретные результаты, выгоды. Обычно это короткие заголовки в виде вопроса или утверждения.
"Как увеличить прибыль на 50% за 2 недели?"
"Стиральные машины с доставкой и гарантией 10 лет"

Недостатки метода:
1. Велик риск сорваться в креативность ради креативности. В результате пользователь может не понять вашего посыла.
2. Заголовок по методу де Боно не раскрывает всю суть и выгоду предложения, в отличие от метода 4U.

Суть метода 6 шляп тут - вызвать интригу. Чтобы пользователь захотел изучить всю пользую предложения в последующем тексте.
​​Методы создания заголовков

От хорошего заголовка порой зависит 30% эффективности всего макета. Будь то рекламный креатив или landing page. Именно по этой причине дизайнеру также нужно обладать навыком создания заголовков.

Метод 4U
Заголовок состоит из четырех особенных элементов:
Полезность (Usefulness) - какую пользу несет в себе продукт?
Уникальность (Uniqueness) - чем отличается продукт от аналогов?
Ультра-специфичность (Ultraspecificity) - конкретика пользы в виде цифр и фактов.
Срочность (Urgency) - ограничение срока предложения или срочность эффективности.
При этом можно менять порядок элементов в формуле и исключать один из элементов в случае отсутствия.

Примеры заголовков, написанных по данному методу:
"Похудейте на 10 кг к лету по индивидуальному плану"
"Выучите английский с нуля до уровня Inermediate за 3 месяца занимаясь с носителем"
"Нарисуйте 5 картин для своего интерьера в течение 1 месячного курса"

Недостатки метода 4U:
1. Заголовок получается длинным, что мешает при оформлении дизайна.
2. Порой сложно найти какой то из U.
3. Заголовок может получиться скучным. Выход в данной ситуации - креативизация. Как вариант можно подобрать метафоры и сравнения.

О методе создания более креативных заголовков читайте в следующем посте.
​​Психология цветовосприятия 🧠🌈
Символика цветов и особенности их воздействия.

Красный📕
Активизирует и возбуждает. Учащает сердцебиение и и создает острую необходимость, поэтому его часто используют при оформлении скидок и распродаж в ритейле.
Среди популярных брендов, которые выбрали красный в качестве основного цвета: Coca-Cola, Canon, Levis, H&M и другие.

Оранжевый📙
Тепло, уверенность, свет. Зачастую используют для призыва к действию: продать, купить, подписаться.
Примеры брендов: Mozilla FireFox, Amazon.

Желтый📒
Радость, интеллект, энергия. Часто имеет большее влияние в соседстве с более темным цветом.
Пример брендов: Билайн, СТС, Яндекс.

Зеленый📗
Природа, рост, гармония. Воздействует успокаивающе и нейтрально. Популярен в финансовой сфере: банки, биржи, финансовые компании.
Примеры брендов: Freedom Finance, Starbucks, NVIDIA.

Синий, голубой📘
Стабильность, надежность. Действует успокаивающе и расслабляюще. Один из наиболее популярных цветов.
Также популярен в финансовой сфере и в сегменте b2b.
Примеры брендов: Facebook, VK, Visa, Samsung, PayPal.
Design by:
AR Shakir | UI Designer
https://dribbble.com/arshakir
​​Прототип сайта - ключ к высокой конверсии 🎯

7 шагов для составления качественного прототипа сайта

1. Определение цели и составление пути пользователя в соответствие с воронкой продаж
Среди наиболее популярных целей сайта стоит выделить: получение заявок от пользователей, совершение звонка, оформление покупки. Поймите весь путь пользователя, который он совершит до совершения целевого действия и откуда он придет к вам на сайт.

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

3. Анализ Целевой аудитории
Вы уже знаете продукт, цели и источники переходов. Раскройте портрет пользователя, который попадет на сайт. Как правило, целевую аудиторию можно разделить на 2-3 основных сегмента. Опишите каждый сегмент, их боли и пользу от продукта.

4. Составление структуры и распределение элементов сайта в прототипе
Проведенный ранее анализ в полной мере позволит вам понять, в каком порядке стоит подавать информацию на сайте, какие блоки будут наиболее полезными.

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

6. Тестирование
Данный этап проводится после завершение работ над сайтом. Протестируйте работу форм и функционала на сайте, адаптивность и удобство для навигации.

7. Оптимизация сайта
После запуска стоит продолжить отслеживание и тестирования сайта. Так, благодаря метрике вы сможете отследить поведение реальных пользователей на сайте и оптимизировать ключевые элементы, отредактировать тексты или порядок блоков на странице.
This media is not supported in your browser
VIEW IN TELEGRAM
Mama Joyce Peppa Sauce - Animated CTA button Shopify checkout

Added to UI Animation and Microinteractions
July 14, 2021
This media is not supported in your browser
VIEW IN TELEGRAM
Organic Animations, Transitions and Mask Effects - Portes fermées

Added by Awwwards to The Best of Navigation
​​Принцип "mobile first" vs привычная отрисовка макета с десктопной версии.

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

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

Так и появился принцип "mobile first", предполагающий старт отрисовки макета именно для смартфонов.

Теперь о плюсах и минусах данного подхода.

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

скорость разработку такого сайта увеличивается, т.к. потребность создания десктопной версии все равно остается;
вместе с этим увеличивается и стоимость работ.

Какой подход выбираете вы?
​​Продолжаем тему синдрома самозванца

Вам знакомо это чувство? поздравляем, вы уникальный человек. Ведь сталкиваются с таким синдромом честные и ответственные люди, с высокими ожиданиями к себе и стремлением к развитию 😇

Добивающими внешними факторами для возникновения синдрома самозванца является привычка сравнивать себя с окружающими, а также просмотр социальных сетей с бесконечными постами "успешных и красивых" людей 👺

Вот и долгожданная подборка способов преодоления синдрома самозванца:

1 способ: здоровый самоанализ.
- Посмотрите со стороны на все свои достижения и выпишите их (только без "у меня нет достижений". Каждый из нас получал оценки в школе, учился чему-то новому, пробовал новые дела. Иначе вы бы это сейчас не читали)
- Проанализируйте, что поспособствовало достижению успеха (только объективно, а не "просто повезло")
В результате вы поймете, что

2 способ: разрешите себе быть неидеальным.
Примите себя полностью со всеми недостатками и положительными чертами. Вы - есть вы. И это самое прекрасное!

2 способ: воспринимайте новые задачи как квест.
Вместо того, чтобы в очередной раз браться за задачу с мыслью о том, что вы ее провалите, попробуйте представить, что это новое приключение. Вам ничего не грозит. Это всего лишь игра. Да будет энтузиазм вместе с вами!

4 способ: вы - не есть ваши мысли.
Зачастую именно наши мысли, зависящие от эмоций, ограничивают нас. Научитесь включать внешнего "наблюдателя" и смотреть на ситуацию с точки зрения фактов. Вы поймете, насколько проще обстоит ситуация.

И помните, синдром самозванца появляется каждый раз когда вы выходите из зоны комфорта. А это значит, что вы не стоите на месте.

Радуйтесь этому чувству. Гордитесь им! 🤗
This media is not supported in your browser
VIEW IN TELEGRAM
BOT Bottle on the table - Button hover and click animation

Added to UI Animation and Microinteractions
August 20, 2021
Веб-дизайнер в 2021. Какие навыки нужны веб-дизайнеру, чтобы оставаться востребованным? 👨‍💻

1. Графический дизайн
Безусловно, самый важный навык любого дизайнера. Умение работать с цветом, шрифтами, формами и иллюстрациями - главные инструменты для влияния на пользователя.

2. UX дизайн (дизайн интерфейсов).
Навык проектирования сценария пользователя на сайте, ведения его к целевому действию. Напрямую связан с психологией восприятия.

3. Насмотренность и постоянный интерес к современным тенденциям.
Тот самый навык, который позволяет дизайнеру не сидеть на месте, а постоянно развиваться. Только так у вас получится создавать сайты в соответствие с новыми трендами.

4. Понимание основ маркетинга.
Благодаря таким знаниям хороший дизайнер создаст не просто красивый сайт, а конверсионный (заточенный под рекламу) сайт. Полезным будет изучить успешные кейсы компаний, а также психология восприятия в помощь.

5. Веб-разработка. Хотя бы ее основы.
Причем дизайнеру не обязательно уметь программировать сайты, но важно знать основные принципы и требования. Это позволит упростить работу разработчику сайта и получить качественный итоговый результат, соответствующий макету.

Обо всём этом вы узнаете в нашем канале
This media is not supported in your browser
VIEW IN TELEGRAM
Benjamin Righetti - Scroll animations, mixing vertical and horizontal scroll

Added by Awwwards to UI Animation and Microinteractions
​​Иконки являются универсальным графическим средством донесения информации до пользователей.

Интересный факт об особенностях обозначения понятия иконок. В английском языке графические элементы пользовательского интерфейса Microsoft называются словом «icon». Однако при переводе на русский возникли трудности с подбором термина.

Слова "иконка" было отвергнуто из-за боязни вызвать конфликты на религиозной почве, подходящая альтернатива "пиктограмма" была отброшена из-за большой длины. В конечном итоге было принято решение об обозначении иконок в интерфейсе Microsoft термином «значок».

В завершении темы предлагаем вам подборку сервисов с бесплатными иконками:

iconduck.com
Множество разнообразных бесплатных иконок на любой вкус и цвет.

iconduck.com
Есть платные и бесплатные наборы иконок. Большое разнообразие.

illustrationkit.com/illustrations
Бесплатные векторные иллюстрации.

icons8.ru
165100 иконок для фотошоп.

icons.modulz.app
Яркий набор иконок 15х15 px. Удобно копируются сразу в клипборд.

icons.mono.company
Удобно скачивать, большое разнообразие простых черно-белых иконок.

teenyicons.com
Коллекция монохромных иконок, можно менять размер сразу на сайте перед тем, как скачать.
​​РОЛЬ ЛОГОТИПА И ЕГО ФУНКЦИИ

В чем же роль логотипа?

1️⃣ Отличать, защищать

✔️ Логотип позволяет отличать и выделять из сотен/тысяч конкурентов - компанию или специалиста и его продукцию/услуги.

✔️ Защитная же цель – уберечь себя от подделок и недобросовестных конкурентов.

2️⃣ Гарантия качества

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

3️⃣ Эстетически привлекать и влюблять

Красивый логотип повышает ценность товара/услуги, когда он становится неотъемлемым элементом оформления продукции.

Неоспоримый факт: эстетическая ценность имеет определенное объективное значение для потребителя.

4️⃣ Рекламировать

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