На этой неделе у канала dui был день рождения 🥳
Приятно видеть, что ровно в день его создания, он прошёл планку 8 тыс подписчиков.
Спасибо всем вам! Что подписываетесь и следите за моим проектом ❤️
Понравилась подпись в рассылках Яндекса. Особенно про юридические детали, которые они не стали выносить в письмо.
Читать полностью…Опубликовал на своём YouTube канале выпуск подкаста «Поговорим» на тему — «Как стать джуном в дизайне интерфейсов и найти первую работу».
Обсудили вместе с Матвеем, дизайн-лидом в Дзене основные темы и ответили на вопросы читателей канала.
🎶 Ссылка на видос — https://youtu.be/qN1IYXS4PxU
Во время занятий на платформе Skyeng, можно рисовать на баннерах. Практическое пользы кажется никакой, просто весёлый элемент.
Читать полностью…Очень нравится, что на андроиде можно быстро менять настройки уведомлений у приложений. Выбирать только нужные для себя категории, причем это сделано в самой системе, не нужно входить в настройки внутри приложения. Но явно это работает лишь после того, как разработчик поддержит системную фичу, тут я в вопросе технологий не разбираюсь.
Очень не нравится когда приложения не дают настройки уведомлений и приходится терпеть лишний информационный шум для редких и важных пушей. Респект разработчикам, которые дают возможность настройки.
Недавно в твиттере увидел этот набор иллюстрации, которые полностью нарисовала нейронная сеть. Такое развитие технологий — поражает!
Но если присмотреться детально к изображению, то понимаешь, что художники не останутся без работы и скорее всего будут заниматься модерированием таких изображений в будущем. К примеру, править детали и корректировать их, так как на иллюстрациях заметно, что сетка не смогла в правильность рук и глаз.
Наглядный пример, важности анимации в интерфейсе.
Тут без анимации скрола списка к выбранному элементу не очень понимаешь, что случилось. Так как горизонтальный список тем сдвигается и одновременно меняется цветовая тема, воспринимать интерфейс становится сложно.
Как можно было бы улучшить.
1. При выборе темы в списке плавнее сдвигать список к этому элементу, что бы явно видеть движение.
2. Сам цвет интерфейса было бы идеально менять аналогично, когда он явно перекрашивается.
Еженедельная рубрика «Пять в Пят»
Пять интересных ссылок за неделю.
1. Чеклист по созданию хорошей типографики в проекте https://is.gd/dl4f9e
2. Инструмент для создания системы типографики. Можно экспортировать в Sketch с привязкой стилей - https://is.gd/hkv8s7
3. Помоги благотворительным фондам выполняю интеллектуальную работу. Не только для дизайнеров. Хорошая возможность выполнить настоящие проекты и наполнить своё портфолио - https://is.gd/i6czmi
4. Сайт где можно посмотреть скринкасты, как работают профессионалы дизайна - https://is.gd/2sqgiv
5. Orion – сервис с отличными иконками для работы https://is.gd/ij8w26
#5вПят
Как использовать Вариативные шрифты в вебе
Вариативные шрифты для тех кто слышит о них в-первые. Это один шрифт, который включает в себя огромное множество начертаний. Каждый параметр шрифта можно настраивать отдельно, таким образом получая уникальный внешний вид. Вариативный шрифт имеет один файл шрифта, в отличии от обычных шрифтов, где каждое начертание хранится в отдельном файле.
Пример из статьи:
Roboto имеет 12 файлов шрифта и 12 начертаний соответственно. Вариативный шрифт - 1 файл и большое множество начертаний.
По ссылке можно посмотреть пример работы вариативного шрифта - https://is.gd/lrsfkk
У вариативного шрифта можно регулировать список параметров:
- Weight
- Width
- Optical size
- Slant
- Italic
Вариативные шрифты можно подключить к веб странице так же как и обычный шрифт. Для настройки шрифта в CSS есть свойство font-variation-settings:
К сожалению вариативные шрифты поддерживают пока не все браузеры. Например мой Safari 11.0.2 отказался работать с сайтом axis-praxis (хотя автор говорит, что последние версии браузера имеют поддержку). Пришлось открывать в Chrome. В конце 2017 Adobe Photoshop и Illustrator добавили работу с вариативными шрифтами. В панели Properties есть возможность настроить шрифт.
Ссылка на статью со всеми подробностями - https://is.gd/s42cnd
Пару дней назад разработчик плагина diya для анимаций в Sketch, сообщил о закрытом бета тесте плагина и поделился со мной сборкой. Я попробовал плагин в работе и написал маленько ревью по ссылке https://goo.gl/QhcNuU
Читать полностью…Дизайнер Юля Кондратьева из looi, рассказала почему, по её мнению pie-chart не так удобен для отображения расходов в банковских приложениях. И что лучше отображать статистику трат в виде линейной диаграммы с отображением категории трат и места.
https://is.gd/lczeaq
Мне сообщили, что в статье про Wikipedia не у всех может отображаться ссылка на статью. Видимо это проблема есть в приложении Telegram X для iOS.
Добавлю ссылку на статью отдельно - https://is.gd/dkqo1a
Аналитика от Flurry за 2017
Сервис аналитики Flurry поделился статистикой использования смартфонов и приложений за 2017.
Мобильные приложения
Использование мобильных приложений выросло на 6% в 2017 по сравнению с 2016. Подросла популярность у категории приложений Shopping. Люди стали чаще покупать, особенно на этот рост оказало влияние Apple Pay и Samsung Pay. Просела популярность категории приложений Lifestyle.
Устройства
Фаблеты наиболее популярные устройства у пользователей (55% в 2017, против 41% в 2016).
Производители
Apple на высоте, Samsung держит позиции, китайские бренды немного подросли в 2017.
🇺🇸 Подробнее обо всём в статье с графиками - https://is.gd/n3ex05
Как с помощью дизайна, а точнее я бы сказал геймификации, можно менять привычки людей.
В одном из переходов Стокгольма, ступеньки заменили на клавиши пианино 🎹 причём шагая по ним, они издавали звук.
Поток желающих воспользоваться экскалатором уменьшился после внедрения этой фичи :)
В видео (☝️) с Матвеем, мы говорили о том, что для наработки опыта и портфолио можно попробовать помогать с дизайном различным проектам.
К примеру, опенсорс проектам частенько не хватает хорошего дизайна. Искать такие проекты можно на GitHub или мобильные для Android в F-Droid.
https://f-droid.org/
Опубликовал на своём YouTube канале выпуск подкаста «Поговорим» на тему — «Как стать джуном в дизайне интерфейсов и найти первую работу».
Обсудили вместе с Матвеем, дизайн-лидом в Дзене основные темы и ответили на вопросы читателей канала.
🎶 Ссылка на видос — https://youtu.be/qN1IYXS4PxU
Привет! 👋 В скором времени хочу сделать новый проект, в котором планирую обсудить такую тему, как 《Как стать джуном в продуктовом дизайне и найти работу》, буду готов ответить в нём на интересующие вас вопросы.
Если у вас есть вопросы к выпуску, то присылайте их в форму по ссылке, постараюсь учесть интересные вопросы и ответить на них — https://forms.gle/ZxjBhP6aFobw66958
Рубрика — «от читателей канала».
Толя Вербицкий, сделал конспект с недавней конференции Figma Schema 2022. В этом году конференция была посвящена дизайн системам.
О чём рассказали:
— Какой подход к проектированию компонентов лучше.
— Как внедрить дизайн мышление и создать систему в большой компании.
— Аналитика и важность исследований в дизайн системах.
— Синхронизация кода и дизайна.
Ссылка на конспект — https://blog.anatoly.tech/?go=all/virtual-schema-by-figma-design-systems/
Вообще развитие сеток не стоит бояться я считаю, люди всегда боятся технологий, но мы не замечаем, что все профессии всегда эволюционируют и адаптируются ко всему.
Подобные сетки, как midjourney я вижу, как хороший инструмент для художников и концепт артистов. С помощью них можно быстро набросать идеи разных форматов и стилей и выбрать нужное для дальнейшей доработки. Я бы назвал это — такие скетч наброски нового уровня.
Для меня это выглядит, как когда работаешь над какой-то большой концепт дизайн задачей. Прежде ты начинаешь просто рисовать всякие разные варианты дизайнов экранов приложения, улетаешь в адский космос, пока ищешь, как бы что задизайнить и решить. Часто это случается в поиске стиля для будущего продукта, когда ты просто рисуешь тонны вариантов и в нужный момент ты осознаёшь — «А вот эта идея получилась отличная! И начинаешь уже глубже прорабатывать и доделывать.»
Понравилось, как ребята из сервиса Locals.org решили рассказать о новых возможностях в приложении.
При старте приложения сверху в ленте отображается сообщение, нажатие на которое открывает веб страницу со всеми обновлениями в формате блог заметки, где есть видосики и иллюстрации.
Вообще такой формат онбординга в новые фичи мне кажется наиболее работающим. Похожее делает Telegram, когда присылает сервисное сообщение с заметкой из официального блога после обновления приложения.
В копилку прозрачного дизайна. Павербанк Shargeek 😍
https://www.shargeek.com/products/storm2
Вчера, 25 января каналу исполнилось 2 года! Большое спасибо, всем вам, что читаете канал 🎉
Читать полностью…Всем привет и с днём студента! 👩💻👨💻
Сегодня расскажу о совместной истории со школой Contented. Ребята позвали меня посмотреть их программу обучения «Дизайнер интерфейсов» и поделиться своими впечатлениями. Для меня это особенное предложение. Хотел по возможности пройти подобный курс и возможно структурировать текущие знания.
Поэтому, ближайшие несколько месяцев я буду держать вас в курсе обучения, напишу пару рецензий и инсайтов, если они появятся. Всё обучение проходит онлайн.
Кто хочет учиться в школе параллельно со мной - скидка 25 %. Промокод EL2MGZ (работает до 30 января).
Ссылка на обучение - https://goo.gl/hhWJqX
Юра Ветров собрал интересные анонсы с недавно прошедшей выставки CES (Consumer Electronics Show) 2018, которые касаются интерфейсов в своём канале - t.me/pdigest/16
Рекомендую подписаться на его канал, а лучше на ежемесячную эмейл рассылку дайджеста. По ссылке можно найти форму на подписку в любом дайджесте - https://is.gd/7xko2o
Еженедельная рубрика «Пять в Пят»
Пять интересных ссылок за неделю.
1. Коллекция референсов сайтов на любую тему со всего мира. Полезно в работе на стадии анализа конкурентов - https://is.gd/m86t0n
2. Плагин Timeline для Sketch. Позволяет создавать анимации внутри редактора https://is.gd/hlreg5
3. Как получить многие сведения о пользователе не задавая лишние вопросы. Подборка инструментов, советов и наборов данных от Антона Жиянова https://is.gd/3ffjqy
4. Сборник полезных хоткеев для работы в Sublime Text https://is.gd/ikew36
5. Видео интервью с Леонидом Иваховым — руководителем отдела дизайна социальной сети «Одноклассники». Рад, что мне удалось работать под руководством Леонида, я получил полезный опыт - https://is.gd/ljayfn
#5вПят
FAB в нижней навигации приложения
Мнение, стоит ли прятать FAB (Floating Action Button) в приложениях в нижнюю панель навигацию. Визуально это выглядит хорошо, но пользователям может быть не понятно, действие это или навигация. Теряется смысл кнопки. Стоит учитывать это когда используете подобный партер в своём приложении.
🇺🇸 Ссылка на статью - https://is.gd/w31u1c
Обзор работы приложения Kite compositor для macOS
Kite compositor - вышел в прошлом году и это тот инструмент, который может помочь наладить коммуникацию между разработчиком и дизайнером при передаче анимаций. Приложение чем то похоже на Principle или After Effects, есть огромный список Actions и событий, но её фишка в том, что он может генерировать на выходе анимации код для Xcode.
В посте на хабре дизайнер рассказал о своём опыте работы в приложении, а разработчики из команды дали фидбек полученному коду. Выделил основное из статьи.
Про анимацию и генерируемый код:
- Kite compositor плохо импортирует из Sketch. Теряет некоторые элементы.
- Ограничения работа с трансформацией объектов в анимации.
- Кривой режим демонстрации анимации.
- Генерируемый приложением код «мусорный» и много дублирования. Разработчикам потребуется прописывать функции и чистить полученный код.
- Не учитываются другие разрешения. Нет адаптивности. В каком коэффициенте дизайнили в том и код получайте.
- Мало туториалов.
Итог статьи в том, что в целом инструмент хороший и двигается в правильном направлении, сейчас к сожалению нет других хороших инструментов для передачи анимаций программисту. Lottie от AirBnb имеет свои ограничения и не всем подходит. Не всегда получается подключать к приложению дополнительную библиотеку для проигрывания анимаций. Я надеюсь в 2018 мы увидим много приложений, которые будут решать проблему передачи анимаций в код.