Веб-дизайн 2016 года: 10 причин для волнения

Веб-дизайн 2016 года: 10 причин для волнения

От автора: несмотря на бурный рост отрасли, веб-дизайн все еще относительно молодая область. Мы всегда немного волнуемся с появлением новых пользовательских интерфейсов. Но front-end разработчики, тратящие часы лишь на то, чтобы заставить кнопку вести себя, как положено, с вами не согласятся. В целом же, вокруг работы известных дизайнеров и дизайнерских фирм складывается приятное ощущение интриги. Каков он будет, веб-дизайн 2016 года?

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

Проще говоря, еще никогда не было столько проблем, как и таких же сложных решений. А с таким количеством проблем появляется и волнение. И ниже мы представим вам список из десяти трендов и методов, которые только начинают просачиваться в широкие массы дизайнерского сообщества: 10 причин, почему в 2016 году быть дизайнером интересно.

Инструменты

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

Muse – множество эффектов и анимаций, еще больше различных шрифтов. Именно то, что вы ожидаете от Adobe.

Sketch – Быстрый, легкий и крайне эффективный инструмент. Многие пророчат Sketch будущее в масштабируемом дизайне.

Affinity Designer – Такое ощущение, что основная задача Affinity Designer быть на шаг впереди Photoshop’а. Приложение создано для тех, кого не устраивает Photoshop, в наборе есть эксклюзивные отличительные функции типа зума в миллион процентов (превосходит зум Photoshop’а 32,000 процентов). Интерфейс приложения спроектирован так, чтобы выигрывать у конкурентов. Цена около $50, часть цены это переплата за удобный интерфейс.

Draw.io – Бесплатный онлайн инструмент, предлагающий все те же функции, что и платные аналоги. Из минусов ограниченность в разнообразии, простые формы и шаблоны. Draw.io – быстрый, легкий и удобный инструмент для реализации ранних дизайнерских наработок. Возможна интеграция с Google Drive, Dropbox и Chrome.

UXPin – Больше чем инструмент для каркасного модулирования и прототипирования. С его помощью можно создавать макеты высокого качества, взаимодействовать в реальном времени с дизайном, проводить тест по юзабилити и управлять всем процессом UX с начала и до конца. Можно импортировать статические макеты из Photoshop’а или Sketch и превратить их в слои-прототипы.

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

Предугадывающий дизайн

Одна из самых интересных UX идей это «дизайн на опережение». То есть, дизайн, сокращающий количество возможных вариантов выбора в угоду удобству. Первоначально термин был предложен генеральным директором Huge, Aaron Shapiro и представляет собой революционный метод повышения UX.

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

Это может звучать немного жутко, но задача необычная, ведь так? Как мы, как дизайн сообщество, можем с этической точки зрения взаимодействовать с пользователем, чтобы улучшить его жизнь, не ставя под угрозу конфиденциальную информацию?
Ниже представлены методы из книги Тренды UX Дизайна 2015 и 2016, которые уже были применены на практике:

Приложения интернет-магазинов с предзагруженным списком товаров на основе ваших покупок

Автоматический перевод средств в сбережения на основе покупательских привычек

Целевая информация, поступающая в нужное время

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

Автоматизация дома

Домашняя автоматизация уже довольно развитое направление, но в скором времени оно станет еще больше.

На рынке уже можно найти множество товаров, относящихся к интернету вещей:

Техника для отопления, вентиляции и терморегулирования

Посудомоечные машины

Системы безопасности

Осветительные приборы

Детекторы дыма

Датчики уровня воды

Медиа плееры

Гаражные замки

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

Homeseer – одно из самых громких имен в сфере домашней автоматизации, на сайте TopTenReviews.com занимает первую строчку. Данное решение совместимо с огромным количеством приложений и сервисов типа IFTTT, систем безопасности, техники для отопления, вентиляции и терморегулирования, систем освещения, аудио/видео плееров, дверных замков, гаражных ворот, даже систем потребления воды.

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

Insteon – еще одна популярная компания по автоматизации дома, уступающая конкурентам в простоте. Если вам необходимо, чтобы все просто работало, то от вас требуется лишь купить концентратор, все соответствующие устройства и сенсоры и загрузить приложение. Также как и с HomeSeer, поддерживается целая гамма различных устройств, среди которых:

Датчики движения, датчики на двери, окна, датчики уровня воды и дыма, все они предупредят вас о различном движении в доме.

Светодиодные лампы

Термостаты

Камеры

Дверные замки

Контроллеры вентиляции

Компьютерные интерфейсы

… И еще множество вариантов в каждой из категорий.

Кроме того, Insteon совместим с другими технологиями, которые вы используете каждый день. Приложение может высылать push и email уведомления о любой деятельности внутри дома. Приложение совместимо с Apple Watch. Другие популярные продукты автоматизации также поддерживаются, типа Nest или Logitech Harmony.

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

Все устройства и приложения можно автоматизировать при помощи функции специальных команд, позволяющей множеству устройств и приложений работать совместно. Известным примером данной функции будет команда «good night», с помощью которой можно сказать дому выключить все системы.

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

В скором будущем дизайнеры смогут перекладывать часть решений с человека на систему (будет интересно начать применять принципы предугадывающего дизайна в домашней автоматизации), создавать шаблоны расписаний/команд и создавать интерфейсы домашней автоматизации, которые позволят решить некоторые проблемы с нудной работой, связанной с оптимизацией системы под индивидуальное использование.

Интеграция больших объемов данных

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

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

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

Из книги Тренды веб-дизайна 2015 и 2016 следует, что большие объемы данных позволяют:

Надежным способом проверить личность пользователя при помощи точных данных, а не предположений

Выявлять приоритеты и привычки пользователя

Повышать качество A/B тестирования при помощи тепловых карт

Выявлять проблемные области в дизайне

Постепенное увеличение бизнес-метрики

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

Производство Карточного Домика от Netflix было продумано намного серьезнее, чем большинство обычных телевизионных драм.
Руководители канала на своем сервисе онлайн стриминга на основе предпочтений своих пользователей выявили, что подавляющему большинству из них нравятся фильмы с Кевином Спейси и под режиссурой Дэвида Финчера. И компания решила свести вместе две большие Голливудские звезды и снять самую захватывающую политическую драму со времен сериала Западное Крыло.

На самом деле это неудивительно. Кто угодно может предугадать, что великолепный актер и врожденный талант к режиссуре могут произвести на свет отличное телевизионное шоу. Еще примеры Крэнстон/Джиллигэн, Гандольфини/Чейз или Хэмм/Вайнер.
Намного впечатляющим выглядит сервис предоставления индивидуального контента, который Netflix осуществляет через таргетированные предложения – как вам японские фильмы ужасов?

Netflix исследует пользовательские настройки (кино, которое вы смотрите), оценки, которые вы ставите, анализирует совокупные данные по всем пользователям (типа симпатии к антигероям, которые в последнее время очень популярны) и на основе ваших данных предлагает вам варианты.

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

Интеграция больших объемов данных для улучшения дизайна:

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

Определите проблемную область – К примеру, неэффективная лендинг пейдж для одного товара

Сделайте предположения – CTA элемент более эффективен внизу страницы, нежели наверху.

Проведите эксперимент – Запутите А/В тест для двух макетов (один с CTA наверху, другой внизу), чтобы выявить две группы пользователей.

Измерьте эффективность – Протестируйте кликабельность, время на странице, показатель отказов и конверсию.

Это простой пример, но его можно проделать и для других типов брендов для выявления проблем в дизайне. На основе полученной информации уже можно проводить более точные А/В тесты.

Отличная поддержка в браузерах для всех ваших любимых инструментов

Знаете, почему круто быть дизайнером во второй половине 2015 и начале 2016 года? Все больше браузеров поддерживают большинство из тех инструментов, которые вы используете.

Flexbox

Rems

Srcset

SVG

SMIL

Gradients

Masks

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

Виртуальная реальность и адаптивный веб-дизайн станут ближе

Если вы хотите проектировать адаптивный дизайн, который будет хорошо работать в 3D виртуальной реальности, то вам просто необходимы все возможные полезные инструменты.

Научная фантастика, скажите вы? Не совсем.

Firefox уже работает в этом направлении, и Chrome тоже не отстает. Google решили, что будет неплохой идеей заставить тех, кто хочет поэкспериментировать с VR технологиями, купить cardboard box.

Несмотря на бета-тестирование, возможность проектирования веб-сайтов под Oculus Rift очень заманчива. Представьте себе веб-сайт, работающий не только с OR, но и с cardboard от Google без каких-либо гарнитур.

Так какой же механизм стоит за этим виртуальным безумием? Всеми любимый адаптивный дизайн.

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

Борис лаконично описывает свой проект:

WebVR boilerplate — новая отправная точка в создании адаптивного VR дизайна, который будет работать с известными VR гарнитурами и плавно подстраиваться под работу на других платформах. Посмотрите несколько демо, первое и еще одно от MozVR.

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

Приличная плата которая только повышается

С чисто прагматической точки зрения вы можете довольно неплохо жить. Средняя заработная плата разработчиков/дизайнеров за последние 3 года только повышалась.

Сопутствующие навыки в программировании также существенно повысят ваш заработок. Умение программировать на .Net или PHP, к примеру, добавит значительные 9% к вашей зарплате.

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

Рост работы на дому

Посмотрим правде в глаза: вы можете делать свою работу и в нижнем белье. Не бывает такого, чтобы вы никогда не приносили проблемы с работы к себе домой. Конечный вопрос, который вы должны себе задать это: А нужно ли вам ходить на работу вообще?

Здравый смысл подсказывает, что сотрудникам, работающим на дому, лучше делать резервные копии данных. Исследования Global Workplace Analytics показали следующее:

Работники на удалении принимают более активное участие, работа на дому повышает продуктивность до 40%

80% сотрудников думают о возможности работы на дому

36% опрошенных сотрудников предпочли бы возможность работы на дому повышению зарплаты

95% опрошенных работодателей сообщили, что удаленная работа оказывает огромное влияние на предотвращение текучки кадров

Сотрудники АТ&Т, работающие на дому, как правило, работают в среднем на 5 часов больше своих офисных коллег

Работники на удалении обычно работают даже, когда болеют

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

Если 3.7 миллионов сотрудников будут работать хотя бы 50% времени на дому, сколько можно сэкономить на топливе? Сколько времени можно сэкономить на личном, корпоративном и общественном уровне?

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

И в самом деле, уже сегодня некоторые из ведущих компаний нанимают полностью удаленные команды по всему миру. С сервисами типа Slack, Google Drive и Google Hangouts расстояние для сотрудников больше не имеет значения.

Ниже представлен перечень некоторых ведущих компаний с почти или полностью распределенной командой на данный момент:

Buffer

Automattic

Basecamp

Mozilla

Upworthy

Zapier

Работайте над любой беспокоящей вас задачей

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

По данным опроса журнала Forbes 58% работников согласны на сокращение заработной платы на 15%, если им позволят работать в компании с возможностью удаленной работы. Millennials, в частности, ценит работу на компанию, которая делает ударение на сертификаты CSR.

Но они не одни. У каждого человека есть страсть к чему-либо, какие-то проблемы или беспокойства, которые затрагивают их в большей степени, чем других.

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

Дизайнер и автор Stewart McCoy в своей статье на сайте The Industry предлагает свой собственный способ решения проблем. Он описывает методы, с помощью которых можно оценить социальную ответственность компании и ее способность выполнять волонтерские цели.

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

Процесс может быть таким же простым, как своя компания на Kickstarter или Indiegogo. Не важно, какая ваша основная идея, еще никогда не было проще начать работать над решением проблемы с помощью краудсорсинга. Ниже представлено несколько заметных компаний, работающих по важным направлениям:

Streamlined Font Creation – Дизайн

Global Learning XPRIZE – Образование

Brain Performance Data and Tracking – Информация

Tailored Sleep Solutions – Здоровье и благополучие

Своей работой вы создаете будущее

Помните основную цель вашей работы. Дизайн, который вы создаете, будет оказывать влияние на жизни людей. Дизайн будет формировать методы взаимодействия, восприятия, передачи цвета и действий людям.

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

8 из 10 человек отрицательно отвечают на вопрос о возможной перспективе прекращения войн и отбрасывания самой концепции войны. Всего лишь 20 лет назад это соотношение было 5 к 10. Все потому что мы стали более взросло смотреть на мир ил стали более циничными? Необходимо вселить оптимизм в работу, которую вы делаете, и мы надеемся, что в будущем это будет иметь положительный эффект.

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

Следующие шаги

Если вы хотите более подробно изучить тренды дизайна в 2016 году, прочтите бесплатную книгу Тренды веб-дизайна 2015 и 2016 на сайте UXPin. В книге рассмотрено 166 примеров основных методов, а также представлены ссылки на 100 бесплатных ресурсов.

Автор: Zack Rutherford

Источник: http://thenextweb.com/

Редакция: Команда webformyself.

Хотите научиться создавать шикарные дизайны сайтов?

Получите бесплатную пошаговую обучающую систему по веб-дизайну

Получить

Метки:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree