Дизайн
Евгений Яровой

76 ссылок, которые помогут сделать концепцию дизайна эффектнее и быстрее

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

Если вернуться на восемь лет назад и посмотреть оттуда — невольно накатывается слеза. Тогда набор был скудный: Shutterstock, два шрифта Google fonts и Helvetica. Можно было фотографировать или искать 3D дизайнера, но это ресурсы, которых на проекте часто не было.

Ко всему клиент мог просто не согласовать тяжелую концепцию. Так студии и уходили в минус, создавая дорогие картинки сугубо для портфолио.

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

3D-конструкторы и программы

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

  • Adobe Dimension — программа, которая входит в пакет Creative Cloud и дает возможности простой работы с 3D. На объекты можно наклеивать изображения, настраивать свет, размер и положение камеры. Также на Adobe Stock можно купить 3D-объекты и свет дополнительно. Поддерживается OBJ формат.
  • Онлайн-конструктор Vectary. Им мы практически не пользуемся, но у этого софта есть преимущество — он полностью браузерный и есть возможность командной работы. Бесплатный тариф на 25 проектов, а с командой работой за 12$ в месяц.
  • Spline — инструмент для создания 3D, которые можно оттуда экспортировать в код. Отличная идея, но реализация еще сырая.
  • superscene — набор, который включает в себя 140 объектов, 14 персонажей и другие элементы, есть исходники Blender и файл для Figma. Заплатить нужно будет 60$ для доступа ко всему набору.
  • Подборка 3D наборов на UI8, включая абстрактные фигуры, персонажей и прочее от 8 до 80$.
  • ToyFaces 3D — набор объемных аватарок.
  • Объемные руки на Getillustraion.
  • Так же наборы есть в комьюнити Figma, например, простейшие геометрические фигуры, которые доступны бесплатно.

Типографика

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

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

  • TypeToday — создатели известных кириллических шрифтов, таких как Graphik, Druk или Kazimir. Последний, например, начинается от 2800 рублей за одно начертание.
  • TypeTypeTT Commons или TT Norms сбалансированные и нейтральные шрифты, которые хорошо подходят для цифровых проектов. Цена TT Norms от 39$.
  • Paratype — их вы хорошо знаете по Circe или Futura PT. Так же они на сайте продают шрифты разных авторов, такие как Proxima Nova или Gilroy.
  • fontfabric — шрифт INTRO или BEBAS их работа.
  • Шрифты с открытой лицензией на Google Fonts.
  • Pangram Pangram Foundry, Parachute и Grillitype — кириллическая версия попадается редко, но иногда найти можно.

Для поиска хорошо использовать Myfonts, для вдохновения ModernCyrillic и Futurefonts. Если сомневаетесь в покупке и экономите бюджет, то шрифт можно арендовать при помощи Fontstand.

Создать объявление Отключить рекламу
Маркетинг
Как «Пятёрочка» с помощью Perfluence через микроблогеров привлекла 18 000 новых клиентов доставки
«Пятёрочка Доставка» запускалась в феврале 2020 года на Юго-западе Москвы. Пандемия и режим самоизоляции стимулировали…

Иконки

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

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

  • «Спектр формы» — набор на 3000 геометрических форм, от дизайнера Лебедева Тимофея.
  • 159 000+ иконок на icons8, есть объемные и интересные emoji.
  • Flaticon — ветеран дизайнерских иконок, лучший способ найти что-то базовое быстро.
  • Иконки в комьюнити Figma, например, есть трендовые Glass icons.
  • Наборы на UI8, Creative Market и других агрегаторах разных авторов.

Графические приемы

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

Мокапы

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

  • LS graphics — мокапы для брендинга и презентации сайтов, если анимированные, средняя цена 30$
  • Don Design — все позиции стоят одинаково по 1,99$. Есть решения для настоящих ценителей, такое как ВАЗ 2109

Фото

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

  • unsplash — коллекция фотографий с лицензией на открытое пользование, много качественных фотографий.
  • Icons8 — самостоятельная коллекция, можно сразу делать коллажи в png, не редко встречается в работах дизайнеров на Behance.
  • 500px — можно договориться с автором и купить у него лично, но стоимость от 100$.
  • На Yellow images можно заказать png с прозрачным фоном, так же есть возможность повернуть изображение в нужном вам ракурсе.
  • Еще есть Adobe Stock и Burst.

Нейросети

Прорыва за прошлый год так и не случилось. Есть два-три относительно полезных сервиса, но в остальной массе нейросети генерируют разный мусор, который никак не поможет нам в дизайн-концепции.

  • Background remover — чтобы не заниматься этой рутинной работой. Во мне снова плачет дизайнер, работающий в 2010-ых годах, когда каждый волос на фотографии нужно было вырезать вручную и спасали только png объекты в google. 3 изображения бесплатно.
  • Сервис для генерации фотографий людей.

Возможно, вам пригодится сервис для ретуши и изменения фотографий от nvidia.

Анимации

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

  • Principle — незаменимая классика для Mac. Все, что можно сделать в нем, без проблем переносится в верстку.
  • Framer — очень похож на пример выше, но с командной работой и полностью онлайн.
  • Smart animate — более примитивная возможность для анимации, в сравнении с тем, что выше, зато сразу в Figma и бесплатно.
  • Есть интересные исходники для After Effects, например, кинетическая типографика: sparta cinetic, typography cinetic.
  • Есть смысл изучить и держать под рукой легко воспроизводимые эффекты, которые делаются при помощи встроенных плагинов в After Effetcs, такие как CC Sphere или СС Mr.Mercury.

Иллюстрации

Конструкторы и шаблоны иллюстраций росли последние два года семимильными шагами. Выбор очень большой: от трехмерных и объемных до анимированных и линейных.

  • +5000 иллюстраций на getillustrations.com — есть как анимированные, так и изометрические. Цена разная, но в основном не превышает 70$. Например, набор Simpline illustrations за 29$.
  • Конструктор Icons8, на данный момент 34 стиля. Маленький png до 534 px можно выгрузить бесплатно, остальное от 19$ в месяц.
  • Еще один конструктор blush.design. Начать работать можно бесплатно, тариф со всеми возможностями 15$ в месяц.
  • LS.graphics — больше 15 наборов иллюстраций, есть бесплатные версии практически в каждом из наборов. Средний ценник 30$.
  • Агрегаторы разных авторов на UI8 или Storytale.
  • Уже были подборки на vc.ru с иллюстрациями, вот такая о бесплатных, еще одна в нашем Instagram.

Это все, если мы забыли что-то важное или новое — пишите в комментарии. А после этой статьи, можно почитать нашу прошлую статью «7 точек роста дизайн-студии», либо подписаться на наш канал в Telegram.

{ "author_name": "Евгений Яровой", "author_type": "self", "tags": [], "comments": 49, "likes": 234, "favorites": 1323, "is_advertisement": false, "subsite_label": "design", "id": 198170, "is_wide": true, "is_ugc": true, "date": "Tue, 26 Jan 2021 08:58:27 +0300", "is_special": false }
0
49 комментариев
Популярные
По порядку
Написать комментарий...
19

Пользуясь случаем, хочу спросить @vc.ru : почему убрали закладки как индикатор отклика у статьи? Сейчас их на сайте не видно, а в приложении остались. Вполне релевантный, как мне кажется, показатель.  

Ответить
7

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

Ответить
3

Добавил вашу статью в закладки если что :) Спасибо.

Ответить
1

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

Ответить
3

Да! Всегда корплю над обложкой как будто для таймса или нью-йоркера :) а редактор – р-раз! и прибил ее. 

Ответить
1

Вот, ты понимаешь о чем я )))

Ответить
3

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

Ответить
0

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

Ответить

Неясный ящик

Andrey
0

В последней обнове убрали

Ответить
0

Интересно, зачем

Ответить
0

да, тоже пропало

Ответить
0

И верните название студии с большой буквы! :)) UPD. Сменил сам, думал, что редактирование недоступно после модерации. 

Ответить
4

Спасибо! Плюсанул и добавил в закладки.
Пригодится для моей студии из одного человека. Динамично развивающаяся компания, между прочим )))

Ответить
1

Про студии можно предыдущую статью прочитать как раз)

Ответить
4

Спасибо большое за подборку! У вас вместо Glass icons, написано class

Ответить
0

Спасибо! Поправили :)

Ответить
4

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

Ответить
0

Вам спасибо за отклик!

Ответить
3

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

Ответить
3

Графические навыки не расширяются количеством иконок, иллюстраций и фотографий
Верно - расширяется насмотренность.

Ответить
1

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

Ответить
0

спасибо! очень интересный комментарий, подумаю и вернусь к нему позже :)

Ответить
2

То чувство, когда вообще не дизайнер, но больше все сохраненок со стоками иконок и шаблонов 😂

Ответить
0

а кем работаете? 

Ответить
1

Бизнес-аналитиком

Ответить
2

Я бы еще в эту подборочку впилил тул для создания визуальных карт сайта — https://octopus.do
Он еще условно бесплатный. Не благодарите ) 

Ответить
0

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

Ответить
1

а как же photoshop express в браузере, тоже можно удалить бекграунд. не прям идеально, но ок

Ответить
2

Унылый обрубок, вот это лучше: https://www.photopea.com/

Ответить
1

🔥 в закладки однозначно

Ответить
1

за шрифты нужно платить – и это нормально

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

Спасибо за статью, но лично мне в данном контексте всегда кажется странным применение слова "нормально" к шрифтам, некоторые из которых стоят дороже отдельных программ и даже ОС. Например, Windows 10 Pro в рублях стоит дешевле некоторых наборов гарнитур, включая в себя при этом кучу человеко-часов, труд программистов, дизайнеров, различные лицензии, да даже те же системные шрифты. Чем обуславливается такая неадекватная (на мой взгляд) стоимость шрифтов? Тем, что с их помощью можно заработать? Как и с помощью ОС и программ, запускаемых на ней.

Ответить
1

Привет!

Действительно, в отдельных случаях, стоимость набора гарнитур может вызывать вопросы. Но, я скорее говорю о том эхо 2000 и 2010-ых годов, которое все еще есть у дизайнеров. 

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

Что касается сравнения с Windows, то думаю что там просто окупается все массовостью. Да и рынок думаю отрегулирует все сам :) 

Ответить
1

Спасибо, в закладки)

Ответить
1

Спасибо подборку и за то что упомянули Superscene и Storytale! Нашёл для себя Don Design. Могли бы ещё поправить плз Storytable -> Storytale. 🙏

Ответить
0

поправил :)

Ответить
1

Спасибо, полезно, как раз начал заниматься этим. сохранил :)

Ответить
1

Спасибо! Очень полезно)

Ответить
1

Спасибо за материал 💪🏻

Ответить
0

Спасибо за интерес :)

Ответить
1

Спасибо за статью)
На тему фотостока дополнил бы еще от себя, вдруг кому пригодится. https://www.pexels.com/ru-ru/ Простой и удобный фотосток, скачивание без регистрации в пару кликов, нет ограничений на разрешение картинок, бесплатно использование.

Ответить
0

супер! гляну – может еще успею в статью докинуть 

Ответить
1

Ловите линк https://www.designnotes.co/ тут все что нужно, спасибо Евгений за статью, давно слежу за вашей студией

Ответить
0

Ого, как классно, изучу. Спасибо!

Ответить
0

О, статья которую я закину в избранное и никогда не прочитаю

Ответить
1

так здесь особо нечего читать, это просто ссылки, которые могут пригодиться в процессе :) возвращайтесь, когда понадобится помощь :)

Ответить
0

Gif-ки конечно адские... просто не приятно читать статью.

Ответить
0

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

Ответить
0

Круто!  Спасибо

Ответить

Комментарий удален

Комментарии

null