В предверии выхода iPhone X нашёл на хабре подробный гайд по дизайну для iPhone X и для iOS11 в целом.
Возможно повторяюсь, но материал подробный и полезный для дизайнеров новичков, причём и на русском.
https://is.gd/u1WuF6
Когда и как применять фильтры и сортировку.
Резюме исследования от Laura Cunha. Её статья основана на исследованиях Baymard institute в области e-commerce и статье Thierry Meier о популярных паттернах фильтров и сортировки.
Выписал основные тезисы из статьи - http://telegra.ph/Filtry-10-26
Небольшая статья, как сделать форму оплаты заказа удобней.
Исследователи из Baymard Institute выяснили, что во время оплаты заказа в интернет магазине, пользователям сложно не только вводить номер карты, но и проверять его корректность.
Основные выводы по улучшению форм ввода номера карты:
- Принимать номер карты в любом введёном формате. Учитывать набранные пользователем пробелы, а не выдавать их как «ошибка ввода».
- Не рекомендуется ограничивать колличество символов в строке ввода номера карты. Многие карты состоят из 16 цифр. Но есть варианты с номера от 12 до 19 символов.
- Хорошо, если поле будет автоматически форматировать введёный номер.
Дмитрий Симбирев выложил в своём канале круговую диаграмму всех инструментов для дизайнера интерфейсов в PDF.
Полезно иметь такую памятку под рукой.
О дизайне верхних элементов интерфейса в iPhone X
Автор статьи делиться советами по проектированию верхних элементов в iPhone X. Учитывая, что гайдлайны Apple не рекомендуют скрывать вырез чёрными полосками приложения, а работающее приложение должно покрывать всю существующую область экрана.
Статья простая с примерами иллюстрациями.
Отметил для себя несколько интересных моментов.
Область статуса бара занимает 44pt в высоту и имеет скругления углов 44pt. Такую высоту имеет и следующая навигационная панель. Это равно рекомендуемому размеру тач элементов по гайдлайнам Apple.
Узнал, что размер скругления экрана в 44pt, прекрасно гармонирует с рамками устройства. Красота.
При прокручивании, скролл бар визуально останавливается у начала скругления углов статус бара.
Ссылка на материал - UI Design for iPhone X: Top Elements and the Notch
Дизайнер Саша Окунев написал пост, как эффективно применять символы в скетче и какие бывают уровни детализации в интерфейсах. Спойлер.
1. Логический уровень,
2. уровень проектирования,
3. визуально-эмоциональный уровень,
4. уровень масштабирования.
Подробнее обо всём этом в его статье на Medium - https://goo.gl/V92Quw
28 сентября в Moscow Coding School стартует трехнедельный курс по основам UI/UX для всех, кто соприкасается с дизайном продуктов и сервисов — дизайнеров, разработчиков, маркетологов, проджектов, копирайтеров.
Преподаватель — Михаил Розов, основатель и арт-директор студии PINKMAN, проектами которых ежедневно пользуются миллионы пользователей. Среди клиентов: Skoda, Volkswgen, Raffaello, Сбербанк.
Узнать подробности и записаться — moscoding.ru/design
#реклама
Креативное агенство Red Keds проведёт первый в России фестиваль digital креатива G8. Можно подать свою работу на оценку зарубежным профессионалам всего за 1$
В конкурсе – шесть категорий: Интерактивные проекты и сайты, Мастерство, Медиаформаты, Социальные медиа, Мобильные технологии, Инновации.
Прием заявок продлится до 1 октября.
Подробная информация о событии и список жюри на сайте фестиваля - https://2017.ggggggggfest.com
Важно. Отправлять свою работу через десктоп версию сайта.
#Реклама
Шаблон для создания иконок iOS приложений в формате Sketch - http://www.iosicontemplate.com/
#tool
Вопрос
Вообще интересно узнать у вас. Cтоит ли мне кидать в канал подобные мелкие ссылки на различные ресурсы или лучше не засорять канал, и публиковать эти ссылки в твиттер канала?
Проголосуйте пожалуйста.
Канал - эмоджи дом
Твиттер - эмоджи птица
Readymag ищет дизайнера в Московский офис.
Обожаю этот онлайн инструмент публикаций. С ним сделать красивые презентации стало проще. Использую его для презентации рабочих проектов.
Попробовал бы сам откликнуться на вакансию, но живу в Питере и не хочу переезжать в Москву.
https://readymag.com/readymag/hiring/3/
#вакансия
Компания Apple на прошлой неделе опубликовала гайдлайны по работе с дополненной реальностью. Я подготовил перевод на русский основных рекомендаций.
http://telegra.ph/Perevod-Gajdlajny-Apple-po-rabote-s-dopolnennoj-realnostyu-09-07
Подробный гайд по оптическому выравниваю объектов для дизайнеров и разработчиков.
В конце статьи автор делится скриптом для быстрого выравнивания объектов в Adobe Photoshop и Illustrator. Для Sketch есть платный плагин Optically, но сам я им не пользовался к сожалению. Расскажите как он в деле если используете? Интересно узнать.
Я выравниваю объекты на глаз в зависимости от их визуального веса. Но из статьи узнал несколько других методов для более точного выравнивания.
https://habrahabr.ru/company/badoo/blog/333992/
Дизайнер Дмитрий Симбирёв рассказал простым словами и показал на видео, как добиться идеального совмещения 8px Grid и Layout сетки в Sketch.
Вывел формулу расчёта и поделился калькулятором в своей статье
В дополнении к посту о подкастах. Большая подборка каналов для дизайнеров с коротким комментарием автора по каждому из них
http://telegra.ph/Telegram-kanaly-pro-dizajn-produkty-i-strategiyu-07-18
18 Августа
Лекция от продакт-дизайнера Twitter Джона Белла - Дизайн, защищающий пользователей.
Джон расскажет об эволюции коммуникационных процессов и решении проблемы абьюза в онлайне.
http://strelka.com/ru/events/event/2017/08/18/designing-with-abuse-in-mind
19 и 20 Августа
Воркшоп от продакт-дизайнера Twitter Джона Белла - Этика в онлайн сообществах
Белл научит создавать пространство для безопасной коммуникации на примерах различных сценариев сетевых атак.
http://strelka.com/ru/events/event/2017/08/19/ethics-in-the-network-learn-design-that-protects-users
2 и 3 Сентября
Воркшоп от куратора программы Digital August, Лии Сафиной
Воркшоп Лии будет посвящен разработке успешной стратегии бренда и инструментов удержания пользователей.
http://strelka.com/ru/events/event/2017/09/02/liya-safina-leading-ux-designer-red-antler-new-york
9 и 10 Сентября
Воркшоп от продакт-дизайнера Google Джесса Майра
Участники воркшопа проанализируют конкретные методики дизайна для новых пользователей и отличия его от западных принципов, а также создадут прототипы сервисов и продуктов, ориентированные на развивающиеся рынки.
http://strelka.com/ru/events/event/2017/09/09/jess-myra-google
11 Сентября
Лекция от продакт-дизайнер Google Джесса Майра - Будущий миллиард пользователей
Джесс Майра расскажет, как изменится рынок, когда рост пользователей будет происходить за счет старшего поколения и жителей удаленных районов, ранее не вовлеченных в интернет-экономику, почему стоит обнулить дизайн-интуицию и начать опираться на культурные соображения новых неискушенных юзеров.
http://strelka.com/ru/events/event/2017/09/11/great-leaps-at-google-redefining-scale-to-build-for-billions
@uxidesign канал дизайнера, который публикует переводы полезных материалов для дизайнеров интерфейсов.
Раз в месяц автор делает пост с подборкой полезных ссылок и инструментов для дизайнеров в своём канале.
Подписывайтесь: @uxidesign
#реклама
Возможно вы уже слышали, что стартанул турнир Russian Design Cup 2017 (RDC). RDC - ежегодный, крутой и сильный конкурс для дизайнеров и проектировщиков.
Сейчас начался отборочный тур. Записаться можно по ссылке https://russiandesigncup.ru/
Успеха всем участникам!
Коллекция маленьких советов по улучшению визуального дизайна в интерфейсах - https://goo.gl/5EnSgJ
Читать полностью…Дизайн нижних элементов в iPhone X
Дополнительная статья от этого автора с советами по дизайну нижних элементов в iPhone X.
Все элементы, которые раньше прилипали к нижней границе экрана можно сделать плавающими и поднять на 32 pt от нижнего края экрана.
Max Rudberg - Visual & User Interface Designer - UI Design for iPhone X: Bottom Elements
Nielsen Norman Group провели исследование, какой тип рекламы больше всего ненавидят люди в вебе.
Не стал создавать длинное сообщение и вынес основные тезисы из исследования в статью на телеграф
http://telegra.ph/Samye-nenavistnye-tipy-reklamy-v-vebe-10-03
Мой любимый инструмент публикаций Readymag обновил панель виджетов.
Раньше все элементы при добавлении их на страницу, формировались в горизонтальную ленту снизу. В таком виде работать с большим количеством элементов в большом проекте было сложно.
В последнем обновлении эту важную часть интерфейса переосмыслили. Теперь панель виджетов выглядит, как привычная многим панель слоёв в графических редакторах. Виджеты можно группировать и перетаскивать, и проводить другие действия с ними.
Всё это должно упростить работу с проектами в которых используется большое количество элементов.
Подробнее про обновление виджетов в Readymag на Medium
Сделал выборку статей из блога Анастасии Щебровой UX Experience.
Анастасия простым языком и с примерами рассказывает, как создавать карту эмпатии, персонажей, карты путешествия пользователей, сценарии, карты сценариев. Для чего всё это нужно и какие есть минусы у каждого метода.
Выписал основные тезисы по каждой теме. Рекомендую прочитать эти статьи всем начинающим и опытным проектировщикам и дизайнерам продукта. Ссылки на каждую статью в посте.
http://telegra.ph/Artefakty-proektirovaniya-09-22
Яндекс представили свою систему для автомобилей «Яндекс.Авто». Это как CarPlay от Apple и Android Auto от Google. Видео обзор, как работает система - https://youtu.be/mt4ES0G6mG0
Читать полностью…Apple добавила рекомендации по созданию приложений для нового iPhone X.
1. Графика для iPhone X должна подготавливаться в @3x.
2. Не рекомендуется размещать элементы управления в приложении, близко к краям и нижней части экрана.
3. Панель датчиков сверху экрана не должна перекрывать элементы управления в приложении.
4. Дисплей iPhone X поддерживает цветовое пространство P3, оно отображает больше цветов чем sRGB.
5. Так как управление в новом айфон основано на жестах, важно учитывать это при создании кастомных жестов в приложении. Они не должны конфликтовать с системными жестами.
6. В iPhone X появился новый и метод подтверждения FaceID, он заменил TouchID. Поэтому важно, что бы приложения для iPhone X не ссылались на TouchID. Аналогичное правило для устройств, которые не имеют FaceID.
Подробнее обо всех обновлениях в связи с выходом iPhone X в гайдлайнах https://developer.apple.com/ios/human-interface-guidelines/overview/whats-new/
При создании любого сервиса важно думать не только, как обычные пользователи будут использовать ваш продукт, но и как им будут пользоваться люди с нарушением зрения.
Автор двух полезных статей по этой теме сделал обзор популярных мобильных приложений с точки зрения их доступности. Дал свои рекомендации по улучшению доступности сайтов и мобильных приложений.
Выписал несколько основных тезисов - http://telegra.ph/Kak-uluchshit-dostupnost-sajtov-i-mobilnyh-prilozhenij-09-12
#accessibility
Josh Fleetwood - тимлид моушен дизайна из Google представил два инструмента для эффективной работы в Sketch и After Effects.
1. Sketch2AE - плагин, который переносит все ассеты из скетча в After Effects. Символы переносит как прекомпозицию, маски остаются масками, векторные шейпы, шейпами, а группы привязываются как родительский слой.
2. Inspector Spacetime - собирает спецификацию анимации в After Effects. На основе кейфреймов собирает все необходимые данные для разработки. Значения кривых, координаты, время анимаций.
Звучит всё классно, надо пробовать.
#tool
Люк Вроблевски проиллюстрировал какую пользу могут принести очки дополненной реальности (AR).
Он привёл несколько кейсов использования очков учитывая метод Скотта Дженсона о том, что польза от использования должна быть выше «проблем» использования. Например, устройство которое требуется заряжать каждый день должно приносить пользователю особенную пользу.
🤒 К сожалению, болел на этой неделе и не смог подобрать информативные статьи для канала. На следущей неделе исправлю это. Спасибо, что читаете канал.
Всем здоровья и выздоровления если болеете!
Подборка подкастов для дизайнеров на английском.
Обсуждение популярных тем, интервью с экспертами в области и список подкастов для дизайно-мыслящих разработчиков.
Вдвойне полезно, если вы как и я изучаете английский язык.
https://goo.gl/69vfxE
Московский институт медиа, архитектуры и дизайна «Стрелка» поделился с каналом расписанием событий в рамках их программы - Digital August. Программа, посвящена дизайну и предпринимательству от экспертов Google, Twitter, Dots и Red Antler.
К сожалению не успел вовремя прочитать их сообщение и пропустил пару событий. Извиняюсь за это.
Публикую список актуальных событий в следующем сообщении.
Лекции бесплатны, воркшопы платные.