31
Май 2019
Заметки

Веб-дизайн дайджест #36

  • Главная
  • Заметки
  • Подборка интересных материалов для веб-дизайнера за май 2019. Статьи для развития, видео-уроки по Photoshop и Illustrator, интересные ресурсы и сервисы, бесплатные кириллические шрифты, проекты для вдохновения и другое. Изучайте, вдохновляйтесь и становитесь лучше!

    Для развития

    30 полезных советов и лайфхаков в Photoshop

    Хоткеи и сочетания клавиш, полезные фишки, а также различные техники.

    Все об SVG анимации

    В данной статье автор описывает тонкости работы с SVG-графикой, SVG анимацию (в том числе и path), проблемы и способы их решения, а также разнообразные подводные камни, коих в SVG огромное множество.

    Работа с текстом в Photoshop: 10 эффективных приёмов

    1. Правильное сглаживание текста
    2. Стили абзацев (Paragraph Styles) и символов (Character Styles)
    3. Вписывание текста внутрь фигур или написание текста по контуру
    4. Автоматический рыбный текст
    5. Применение Postcard и 3D Extrusion к тексту
    6. Конвертирование строчного текста в блочный и обратно
    7. Преобразование в фигуру
    8. Использование Smart Objects для сохранения возможности редактировать текст и применения фильтров или деформации
    9. Горячие клавиши для очень быстрой работы с текстом.
    10. Копирование CSS текстовых слоёв

    Психология: 39 исследований человеческого восприятия

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

    UX поиска: как создать доступную форму поиска

    • Поиск влияет на прибыль вашего бизнеса. Поиск без усилий приводит к переходам без усилий.
    • Широко признано, что размещение формы поиска в верхнем колонтитуле обеспечивает лучший пользовательский опыт.
    • Использование таких кнопок, как увеличительное стекло, дает пользователю необходимый триггер и возможность отправлять свой поисковый запрос различными способами.
    • Будьте готовы, что пользователи попадут на несуществующие страницы. Чтобы вытащить их с этих страниц, сделайте поиск доступным по всему сайту.
    • Расширенные параметры поиска позволяют пользователям сузить область поиска до нужной им страницы / сегмента.
    • Мобильные формы должны быть четко видны и учитывать экраны разных размеров.
    • Автозаполнение сокращает время, необходимое для поиска конкретной страницы или продукта.
    • A / B-тестирование показывает, как различные места размещения формы поиска влияют на коэффициент конверсии и, в конечном итоге, на пользовательский опыт.

    Анимация в мобильных приложениях: тестируем Lottie

    LottieFiles это библиотека для iOS, Android, Web и Windows. Библиотека состоит из файлов json, в которых закодирована анимация из Adobe After Effect. Плагин, который участвует в создании таких файлов, называется Bodymovin. Он имеет JavaScript движок и рендерит анимацию в режиме реального времени.

    Посмотреть

    Уроки по Photoshop. Дизайн и практика от Moscow Digital Academy

    Курс «Элементарно, Вектор!» по изучению Adobe Illustrator CC 

    Сервисы и ресурсы

    Чек-лист от Михаила Грекова по созданию таблиц с которыми работают

    В чек-листе 65 требований и ссылки на теоретическую базу. Требования касаются как дизайна, так и разработки/тестирования.

    HARD CLIENT

    Сайт со статьями и кейсами об UX исследованиях. Автор, Станислав Хрусталёв, в поисках формулы идеального клиентского опыта публикует на сайте: Детальные обзоры сервиса компаний на всех стадиях пути клиента с рекомендациями; Статьи о том, как создать лучшую систему управления клиентским опытом с нуля; Обзоры платформ и сервисов, применяемых в управлении клиентским опытом.

    Geenes

    Сервис для подбора оттенков цвета для интерфейса. Результат отображается сразу на примере интерфейса. Набор цветов можно экспортировать в Sketch, Css, Sass и тому подобные препроцессоры и библиотеки.

    cssfx

    Коллекция готовых к использованию прелоадеров и ховер-эффектов

    Sheet2site

    Сервис по созданиею простых сайтов из гугл таблиц

    Google Earth Studio

    Программа для сооздания анимированных видео 3d моделей объектов земли

    Useberry

    Простое и быстрое создание и проведение юзабилити-тестов прототипов.

    Portlab Icons

    Бесплатные анимированные иконки

    Figma

    Figma Plus

    Платформа для установки плагинов. Теперь Figma станет намного гибче и универсальнее.

    Framer

    Framer Playground

    • Новый встроенный редактор кода
    • Полная библиотека прототипов
    • Лучшая документация

    Adobe Xd

    unDraw for XD

    Плагин: Коллекция бесплатных иллюстраций

    Adobe XD представляет дизайн-системы. Большое обновление

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

    Sketch

    Charts

    Более 60 бесплатных адаптивных графиков и диаграмм для Sketch.

    Обновленный Sketch 55

    • Smart Distribute — быстрая настройка расстояния между слоями в столбце или строке.
    • Слои из SVG Code — скопируйте код SVG и вставьте его в Sketch. Фигуры будут создаваться из этого кода.
    • Улучшение привязки — новые символы, стрелки, линии и слои лучше привязываются к сетке.
    • Повышение скорости — копирование и вставка между документами работает значительно быстрее.
    • Улучшение привязки — слои привязываются к повернутому тексту.

    Шрифты

    Cyntho Next

    Бесплатный современный шрифт light-начертания с поддержкой кириллицы

    Cyntho Next Slab

    Бесплатный шрифт с засечками light-начертания с поддержкой кириллицы

    Cocobiker

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

    Cover image

    Geometrica Sans

    Бесплатный для персонального использования шрифт.

    Trapist

    Бесплатный шрифт с поддержкой кириллицы

    Для вдохновения

    MISSGUIDED — Interaction Vol. 1 by Anton Pecheritsa
    Kaiser // / Slideshow by Andrew Baygulov
    Thug Kitchen Restaurant Concept by Nathan Riley
    Art culture by Aimm
    0
    комментить
    поделиться
    246
    подписаться
    Веб-дизайн дайджест #35 Веб-дизайн дайджест #37
    Привет! ;) Меня зовут Владислав
    я — веб-дизайнер

    Люблю дизайнить, создавать что-то новое и совершенствовать существующее. В теме с 2010 года. Постоянно прокачиваю себя в данной сфере, слежу за трендами.

    Увлекаюсь спортом, люблю слушать музыку, путешествовать, развиваться и расти, как специалист. Стараюсь брать от жизни сполна!

    • photoshop
    • Figma
    • XD
    • responsive
    • adaptive
    • UI
    • UX
    • Interactive
    • modern
    • html
    • css/scss
    • css
    • JavaScript
    • jQuery
    • gulp
    • php
    • Wordpress