Сегодня тема модульных сеток и зачем они вообще нам нужны? Раньше сетки были немного хаотичные, но мы уже не те что прежде, у нас есть 📏 линейки! Мы неустанно стремимся к упрощениям и повторениям, это делает наш дизайн легче для восприятия. Сложных форм все меньше, нас захватили прямоугольники 🔳

http://telegra.ph/Prostaya-setka-12-12

СХ (клиентский опыт)

Друзья, я часто пишу о UI UX, но совсем не разбирала тему CX. Мой личный опрос показал, что далеко не все знают, что это вообще такое.
"Исследования показали, что 86% ваших клиентов готовы платить больше за более лучший CX, чем UI UX."
Так что давайте подробно рассмотрим эту тему.

http://telegra.ph/SH-12-13

Figma спросила 18 дизайнеров о том, какие тенденции UI / UX они прогнозируют в 2018 году.

1. Доступность в первую очередь, Эго во вторую
2. Сотрудничество в области проектирования будет эхоинженерным
3. Дизайнеры будут сосредоточены на этике
4. Дизайнеры будут слишком сильно опираться на отраслевые стандарты
5. С большой эффективностью приходит большая ответственность
6. Мы проигнорируем одну тенденцию, в которой мы все нуждаемся
7. Дизайн будет основным игроком в социальных изменениях
8. Инструменты дизайна сделают дизайнера из каждого
9. Джейсон Шварцман сказал, что взаимодействие - это лучше всего
10. Навыки людей будут иметь большее значение, чем когда-либо
11. Пришло время динамически реагировать на окружающую среду
12. Лучшие инструменты дизайна приведут к лучшему брендингу через системы проектирования
13. Системы проектирования будут обслуживать людей, а не продукты
14. Плоский дизайн больше не будет фокусом ...

подробнее по ссылке https://blog.figma.com/18-designers-predict-ui-ux-trends-for-2018-2d04d41361c6

"Красота — это повтор. Красота — это когда есть ровный, предсказуемый ритм." 🎹

Я посвещаю эту цитату нашим друзьям - иконкам!
Иконки во многом определяют стиль ui, поэтому заслуживают немного исторических сводок. Подробнее о подборе иконок и их истории в статье 👇
http://telegra.ph/Risuem-ikonki-12-12

Туннельное зрение

Если вы догадываетесь, что ваша целевая аудитория скорее всего прибывает в состоянии стресса, нужно помнить о "туннельном зрении". Например сайты для адвокатов. Логично, что события в жизни человека не самые приятные и скорее всего он немного нервничает. В таком состоянии человек теряет способность к периферическому обзору. Воспринимается лишь изображение, попадающее на центральную область сетчатки глаза. Это, конечно, крайний случай, но совсем сбивать со счетов не стоит.

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

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

Решила сделать для вас еще одну небольшую подборку для поиска шрифта мечты:

Если вам нравится какой-то шрифт, можете поставить себе приложение WhatTheFont. Для iPhone точно есть, для Android — не знаю. Фотографируете текст, программа отправляет его на сервер и возвращает ответ, какой это шрифт.

Если вы хотите сочетать шрифты между собой, рекомендую зайти на сайт Fonts in use и поискать тот шрифт, что вам нравится. Если его там нет, не пользуйтесь им. Скорее всего, он 👹

Наконец, есть сайт Font Squirrel с кучей бесплатных шрифтов. Там есть поиск по кириллице.

Как легко проверить читаемость шрифта?

1 Скопируйте слой с текстом, преобразуйте в смарт-объект или в обычный растр
2 Фильтры > Размытие > Размытие по Гауссу
3 Сравните шрифты после фильтра, как вы заметите один шрифт читается лучше другого. Это может сыграть большую роль для слабовидящих.

Так же подборку шрифтов я предлагаю в статье http://telegra.ph/Podborka-shriftov-11-14

Нулевой интерфейс

Не так далеки те времена, в которые наш дизайн перейдет в новое измерение.

А может оно уже настало? Нулевой интерфейс - это отказ от сенсерного интерфейса, переход к голосовому и тактильному .

Ноль - это то, как мы, как пользователь взаимодействуем с нашим содержанием. 🌀

Друзья, пока это совершенно новая тема, если бы она была пирожком🥐, то мы бы сейчас только учились раскатывать тексто. Поэтому каких-то упражнение или правил для наработки опыта сейчас нет. Мне понятно, что для развития своего навыка в новом формате интерфейса нужно отталкиваться от более общих представлений о дизайне. Отойти немного в сторону от тех проблем которые волнуют сейчас и посмотреть на картину в целом.

Очевидно что нужно развивать эмпатию, я уже писала на эту тему. http://telegra...mpatiya-11-23

Что еще? Очевидно, что пригодится 3d виденье мира, так как мы уходим из плоского 2д формата и переходим в новое измерение. Для этого предлагаю вам ознакомиться с программой Cinema 4d ⚡️, я её просто обожаю. Если нет времени на изучение то просто посмотрите пару уроков на ютубе, стоит проникнуться темой.

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

Ну и как вы догадались - важно развивать понимание физических элементов управления. Развить понимание жестов над устройством без необходимости прикасаться к экрану непосредственно. Как нам этого добиться?

https://www.iphones.ru/iNotes/740767 Статья о жестах пока не нулевого интерфейса, но тем не менее схожими от Apple. Я вижу это аналогом ноля, потому что в итоге скорее всего эти жесты просто перенесутся с поверхности экрана на виртуальную площадь перед глазами.

Плюсом небольшая статья о нулевом интерфейсе, в ней подробнее описано, что это такое. http://deadsign.ru/ux/zero_ui/

Метод Хикка

Метод Хикка - изучение времени реакции на различные ситуации. При росте числа альтернатив выбора время реакции линейно растет. Психологоческие эксперементы показали, что чем меньше выбор у человека, тем быстрее он его делает. Это правило часто применятся в UX.

Например: вы предлагаете пользователю 3 пакета услуг. Эконом, Классический и Премиум. Пользователю легко выбрать по цене и границы между пакетами резкое разграничены. Поэтому пользователь может сразу определить какой вариант ему подходит. Если увеличить число пакетов до 5-7, то пользователь потратит много времени чтобы выбрать, какой для него пакет выгоднее. При этом может так и не быть уверен в своем решении и вовсе отказать от приобретения услуги в итоге.

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

Результат нашей ученицы Маши через два месяца обучения. Маша пришла к нам без навыков web-дизайнера вообще, и многому успела научиться. Спасибо за отзыв 😊

Потеря внимания пользователя

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

Есть объяснение подобным случаям - мозг отключается в моменты, которые считает недостаточно важными и включается снова, когда распознает важную для себя информацию. Это значит, что мозг воспринял контент, как белый шум. Такое восприятие информации, позволяет нам выделить главное, самую суть, а не уходить в корни деталей. В Web-e это распространено как нигде. Чем больше текстов вы размещаете на странице, тем больше пользователь пропустит мимо глаз. Но при правильном размещении текстов - они наоборот усилят восприятие ключевых моментов.
Чтобы подчеркнуть важный контент - сделайте акцентный заголовок.
Разместите информацию по центру экрана или слева в верхней части.
Сделайте элемент, на который хотите обратить внимание самым ярким по цвету и не размещайте слишком много информации вокруг.
Блоки с второстепенной информацией разместите ниже.
Мы супер-заряжаем нашу память, когда её визуализируем.
Мы лучше запоминаем смешные картинки, а схемы воспринимаются хорошо, когда уже поняли суть темы.  

Когда мы сталкиваемся с нечеткими воспоминаниями, наш мозг стремится «заполнить пробелы» — тем, что он «думает», могло быть. Поэтому технически мы помним информацию так, как вспоминали её последний раз. Это важно для визуализации. Например: если показать красный шарик и подписать "зеленый шарик", то в последствии пользователь вспомнить надпись "красный шарик", потому что картинка фиксируется в памяти лучше текста.
Пользователь лучше запомнит первый экран, последний (если доскролит), то что повторяется и то что его притягивает. Поэтому важно отразить основную мысль на первом экране четко и одарить визуализацией

Мы вошли в 10 лучших телеграм каналов по дизайну 🎉
Это круто 🙌
http://say-hi.me/design/10-luchshix-telegram-kanalov-dlya-dizajnerov.html

В этот день совесть не разрешила мне оставить вас без подарка.🎄 Поэтому я решила одарить вас книжкой "Основа академического рисунка". Раз уж книга - это лучший подарок, у меня просто нет выбора.
С Наступающим!🎉🎉🎉

В 2017 главным прорывом было - запуск приложений AR в массы, поэтому я решила сделать для вас подборку своих любимых приложений. Сильно уж они меня увлекают, любовь на веки вечные.

Точно не знаю есть ли они на андройд, на айфон точно есть:

Monster Park - Динозавр вылазит из дыры прошлого прямо на пол вашей "кухни"! Размер динозавра зависит от выбранной плоскости, и им можно управлять, заставлять ходить куда хочешь. Что круто - все можно заснять на видео или сделать фотку для инсты. Функционал полностью встроен и очень удобный

Pigeon Panic - Приложение для пугания дурацких голубей. Сразу скажу нужно большое пространство, двор например. Чтобы было где побегать. Мне очень понравился дизайн и сама по себе идея веселая. Нужно просто гонять голубей как в детстве, без риска что тебя могут клюнуть или что похуже=)

Meow - мы все больше жизни любим котиков, поэтому это приложение вошло в мой хитпарад! Заведите себе виртуального котика, его можно гладить и кормить, чесать брюшко, просто смотреть и радоваться. Хотя мне быстро наскучило, все равно котик - это святое дело.

TwilightPioneers - Ну это круто, можно управлять драконами во время легких сражений, плавать под водой. Управлять кораблями. Пока все не сильно драматично, но многообещающе, ждем обновления.

IKEA Place - Конечно Икея, впечатлила. Можно прямо из каталога выбирать мебель и примерять в своем доме, подойдет ли кресло или шкаф. Мебель отображается в реальном размере.

AR Dragon - просто еще один милый дракон в вашей жизни.

Human Anatomy Atlas 2018 (платно) - Это стоит того, объективно. Можно изучать анатомию с большим рвением. Все на англ., надеюсь русская версия тоже появится. Посмотрите презентацию - это выше похвал.

SketchAR(платно) - для начинающих художников полезное приложение. Для детей вообще хит, наверно. Приложение позволяет накладывать на холст контур изображение.

Это те приложения, которые стоят у меня, есть еще куча крутых. Например обучение англ. языку - приложение "Вася" - но у меня не пошло, видимо нужен Х айфон.

Весело вам провести время!

Обратная связь подсказала, что есть высокая необходимость в помощи по созданию инфографики. Поэтому на свет появилась эта статья 👉

http://telegra.ph/Infografika-12-20

Ежедневный ресурс www.uplabs.com/ios

Удобный сервис, большая куча нужностей.

Если вам что-то требуется, например цветовая палитра, то просто вбейте в поиске "Color" и сервис предоставит вам крутые подборки.

Можно найти почти всё от UI kit до icon. Что примечательно, сервис предлагает разные подборки для IOS и Android.

Приятного использования.

Что определит пользовательские интерфейсы будущего?

NUI используют возможности и навыки, которые мы использовали всю нашу жизнь, тем самым уменьшая когнитивную нагрузку.

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

Есть принципы, которые можно использовать при разработке естественных пользовательских интерфейсов. По словам Джошуа Блейка , они:
* Опыт работы
* Прогрессивное обучение
* Прямое взаимодействие
* Познавательная нагрузка

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

В пример такого интерфейса можно привести Siri.

Еще один пример - это VR наушники.
Кристоф Маллет утверждает, что в течение 10 лет такие отрасли, как сектор здравоохранения и недвижимость, будут иметь свои собственные аппаратные экосистемы для людей, которые могут использовать и испытать. Фактически, Маллет продолжает утверждать, что в течение 10 лет такие аппаратные средства, как наушники VR, будут столь же распространены, как и экраны, на которые мы смотрим сегодня.

Важно понять, что мы стремимся не к созданию нового интерфейса, а его отсутствию. Стремимся к упрощению, а не к множеству экранов. Создание действий голосом или движениями - это и есть NUI (естественный пользовательский интерфейс) и интерфейс будущего.