Лучшие заметки «Дизайн Мании» за 2019 год — шаблоны, веб-дизайн, сервисы, вдохновение

Лучшие заметки "Дизайн Мании" за 2019 год

Лучшие заметки "Дизайн Мании" за 2019 год

В начале нового года есть смысл не только стоить планы на будущий, но и подводить итоги прошедшего. Именно поэтому каждый раз мы пишем статью с подборкой лучших заметок «Дизайн Мании» – можете почитать соответствующий дайджест за 2018 и пост за 2017. Многие из имеющихся там публикаций (для вдохновения, скачивания разных дизайнерских материалов и т.п.) все еще актуальны.

Записи сгруппированы в отдельные тематические блоки чтобы удобнее было воспринимать информацию. Они полностью совпадают с разделами блога. Побить прошлогодний рекорд с 55-тью размещенными статьями, вряд ли, получится, т.к. времени проекту в 2019 уделялось чуть меньше… но ведь и качество контента важнее количества.

Веб-дизайн и создание сайтов

  • Все про подвал сайта (footer) — рекомендации как лучше его сделать, зачем он нужен + 10 вариантов оформления футера с пояснением их преимуществ и плюсов.
  • Эффективны Hero Image для вебсайта — 8 советов по созданию данного элемента страницы дабы он получился максимально полезным для пользователей.
  • Виды кнопок в пользовательском интерфейсе — какие вообще могут быть кнопки в приложениях и на веб-проектах (текстовая, гамбургер, выпадающая, призрачная, социальная и т.п.), в чем их основные особенности и полезные стороны.
  • Идеальная форма логина — рассмотрели, как не следует делать при разработке онлайн формы авторизации (чтобы ваши посетители оставались довольными). Например, крайне не желательно делить процесс логина на несколько этапов/шагов.
  • Вертикальный текст в веб-дизайне — в статье приведены примеры использования этой техники и описаны ее преимущества в тех или иных случаях.
  • Эффективные B2B-сайты — 10 реальных вебсайтов с пояснениями соответствующих дизайнерских решений, скриншотами и советами какие подходы лучше применять для B2B-проектов.
  • Mailto ссылка на сайте — практическая заметка о том, как сделать линк на адрес электронной почты + парочка лайфхаков по верстке.

Логотипы

Материалы для скачивания

Тут традиционно будет несколько подрубрик, однако сначала хотим поделиться одним крутым обзором:

  • Подписка One от TemplateMonster — данная платная подписка предоставляет неограниченный доступ к более чем 11500+ премиальным материалам: начиная от шаблонов, плагинов, заканчивая разной графикой в виде мокапов, иллюстраций, паттернов и даже стоковых фото. Платите единожды — используете целый год или получаете доступ навсегда.

Шаблоны

  • Woostroid2 — детальный обзор премиального универсального макета для создания топовых онлайн-магазинов. Здесь рассмотрены все возможности по дизайну и функциональности (т.е. включенные в стоимость плагины). Как и Monsroid2, крутой продукт, только заточенный под eCommerce нишу.
  • HTML5 шаблоны для сайтов — 30+ классных адаптивных дизайнов для ваших веб-ресурсов, сделанных с помощью HTML5-технологии. В посте представлены как бесплатные, так и платные варианты, чтобы каждый смог найти подходящий на свой вкус и бюджет.
  • Топовые макеты Magento — они больше подходят не для обычных вебсайтов, а скорее для онлайн-магазинов, т.к. в каждом есть каталог товаров, корзина и т.п. Всего публикация содержит 30 тем.
  • 20 адаптивных русских HTML шаблонов — здесь чуть меньше материалов нежели в предыдущих постах, но отличительная их черта в том, что все они имеют русскоязычную локализацию, т.е. вам не придется добавлять перевод. Не забывайте, что HTML-темы не включают в себя CMS-движок.
  • 20+ плагинов и шаблонов Elementor — если вы используете данный модуль конструктора страниц для WordPress, то готовые дизайны/плагины однозначно пригодятся в работе.

Кисти

  • Кисти сердечки для Фотошопа — тут найдете более 50-ти тематических наборов, которые можно использовать для графики ко дню святого Валентина или любых других романтических картинок.
  • Кисти для рисунка мелом на доске — у нас когда-то была аналогичная заметка про шрифты мелом, а теперь добавили еще и с кисточками. Последние, разумеется, подходят не для текстов, а используются при рисовании — содержат как абстрактные варианты, так и наборы с конкретными объектами.
  • Кисти листья для Фотошопа — пригодятся при создании каких-то природных иллюстраций. Среди материалов встречаются и отдельные листочки, и небольшие композиции.

Иконки

  • Телефоны и смартфоны — 25+ абсолютно разных по содержанию наборов: есть полностью детализированные копии реальных устройств; просто тематические иконки; красочные и наоборот моногромные картинки.
  • Почтовые иконки — запись включает в себя изображения с конвертами, письмами, email’ами и тому подобными вещами. Всего 25 архивов + ссылки на сервисы, где сможете найти их еще больше.

Текстуры

  • Черные текстуры для Photoshop — каким-то немыслимым образом нам удалось подобрать около 60-ти реально красивых и необычных материалов. Раньше, кстати, уже были белые текстуры, возможно в 2020 выберем для себя еще один цвет.
  • Бесшовные текстуры цветов — тут имеются классические паттерны для Фотошоп и векторные файлы — всего 50 наборов. Выглядят все они приятно и мило.

Разное

  • Мокапы MacBook в PSD — собрали 30+ бесплатных макетов/шаблонов в формате PSD, где в изображение экрана компьютера сможете вставить свою фотку/картинку.
  • Бандлы для дизайнеров-фрилансеров — статья включает 20 всевозможных дизайнерских заготовок/макетов, использование которые упрощающих работу.

Для вдохновения: дизайны сайтов, фотки, обои

Как и в прошлом «инфоблоке», тут представлено сразу несколько тем, но мы не будем разделять их на подкатегории.

  • 40+ примеров Hero Image в веб-дизайне — этот пост своего рода дополнение к похожей статье про эффективное использование крупных картинок в шапке главной страницы. В нем увидите применение всех актуальных методов на практике.
  • Красивые формы логина — еще одна практическая демонстрация к написанной ранее заметке на схожую тему. Однако здесь кроме скриншотов дизайнов есть и готовые HTML/PSD исходники с полноценными работающими формами.
  • Использование иллюстраций для сайтов — все 35 примера оформления веб-проектов из публикации сгруппированы в несколько стилистических жанров: рисованные от руки, акварельные, 3D, градиентные и т.п. По каждому из них есть небольшое описание.
  • 60+ рисованных веб-дизайнов — в отличии от предыдущей ссылки тут только изображения/скриншоты веб-ресурсов, где активно используются всевозможные рисунки и иллюстрации.
  • Скандинавские цвета и стиль для сайтов — эти 60+ творений веб-дизайнеров помогут хорошо прочувствовать и понять основные тренды и тенденции данной ниши.
  • Лучшие черно-белые фотографии — в заметке будет более 50-ти мега эмоциональных, ярких, тонких, чувственных фотокадра. Ч/б стилистика — это что-то необычное.
  • Иллюстрации от Hannah Davies — жаль, что в 2019 получилось сделать всего одну статью с подборкой работ каких-то художников, т.к. на самом деле это очень интересный формат. Здесь по графике с красивыми природными узорами очень хорошо заметен почерк автора.
  • Рождественские и новогодние обои — 45+ классных тематических картинок на рабочий стол, пост был опубликован как раз перед новогодними праздниками.
  • 35+ WordPress Wallpapers — практически все ссылки на источники в прошлой версии заметки были утеряны, поэтому в срочном порядке пришлось ее переписать.

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

Онлайн сервисы для дизайнеров

  • Разные инструменты для UX/UI дизайна — краткий обзор таких проектов и площадок как UXPin, Mason, Interfacer и Webflow.
  • Сервисы убирающие фон на картинке — если перед вами стоит подобное задание, то приложения, описанные в статье, смогут пригодиться.
  • Canva для презентаций — пошаговая инструкция и советы как сделать в сервисе Canva полноценную презентацию и даже сохранить ее в PowerPoint.
  • Калькулятор для сайта stepFORM — веб-ресурс позволяет создать онлайн калькулятор или форму для своего сайта без знаний программирования.
  • Canvas Chrome для рисования — приложение не имеет ничего общего с предыдущим одноименным сервисом, оно дает возможность рисовать непосредственно в Google Chrome,  Firefox и др., а следовательно на планшетах и ПК. В принципе, прикольно.
  • MixaPixa — помогает создавать крутые анимированные gif/html5 баннеры и промо-ролики без сложных программ по типу After Effects.

Для шрифтов

  • Онлайн сервисы распознавания шрифтов — рассмотрели все топовые инструменты в данной нише: есть софт, распознающий по картинке/тексту, расширения для браузеров.
  • Font Combination Tool — позволяет легко и быстро находить красивые комбинации фонтов для типографики вебсайта (кроме обзора найдете 10 примеров удачных комбинаций).
  • FontDrop — загружаете в специальную форму любой шрифт и сможете просмотреть всю информацию о нем + имеющийся внутри него набор символов.

Итого. В дайджесте получилось 48 статей, что, как и предполагалось, меньше прошлогоднего результата. Придется теперь в 2020 наверстывать упущенное. Если посмотреть на тематику публикаций, то в прошлом году было слишком мало постов с наборами иконок, также уменьшились объемы по теме фотографии или логотипам, остальные материалы — плюс-минус остались на том же уровне.

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