Круги дизайн-инноваций

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

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

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

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

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

Основной целью нашего исследования является проведение редизайна главной страницы сайта с применением кругового дизайна с дальнейшей оценкой полученного результата.

Для начала приведем в пример исследование бизнес-школы INSEAD. Участникам демонстрировали рекламу обуви и мебели с круглым и угловатым логотипом. Люди восприняли товары с круглой айдентикой как удобные, привлекательные, а с угловатой — только практичными.

И так, из всего выше сказанного мы знаем, об основных метриках круга, которые будем использовать в нашем эксперименте:

1. Обращает на себя внимание, успокаивает и объединяет:

2. Центрирует внимание на предметах:

Наличие у человека навыков использования круговой информации:

Используя имеющуюся информацию проведем сравнительный эксперимент.

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

Оригинал макета Главной страницы:

Результат редизайна оригинала:

Макет сайта стал более вместительным, сократился до двух экранов, процесс прочтения теперь цикличный, отпала необходимость в подвале(footer). Пользователь в результате прохождения по сайту возвращается в начало сайта, что дает простор для внедрения новых идей в функционал. Все выводы, насколько дизайн стал лучше сточки зрения UX/UI предлагаем сделать нашим читателям и поделиться ими в комментариях.

На данный период времени круговой дизайн вышел за пределы графического и веб-дизайна, на его основе так же создаются всевозможные гаджеты:

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