Психофизиологические аспекты создания сайтов
В тайм-менеджменте есть понятие «отложить в долгий ящик» — так мы поступаем с задачами, которые требуют затрат большого количества времени и энергии.
Эти же законы работают при взаимодействии с сайтами. Помните об этой особенности нашего организма, делайте дизайн и интерфейс удобным и максимально простым для восприятия, позвольте посетителю вашего сайта чувствовать себя уверенно.
Закон сохранения энергии в основе построения интерфейса
Около 25-30% энергии организм расходует на содержание нервной системы. Чем меньше времени мозг работает в интенсивном режиме, тем экономичней его содержание. (Наука и жизнь, Энергетический подход к эволюции мозга)
В целях уменьшения времени интенсивной работы, организм идёт по пути меньшего сопротивления или вовсе избегает решение проблемы.
Упрощайте и структурируйте
Обнаруженная американским учёным-психологом Джорджем Миллером закономерность, названная «Кошелёк Миллера» или «Магическое число семь плюс-минус два», состоит в том, что кратковременная человеческая память не может запомнить и повторить более 7 ± 2 элементов.
Разбивайте, компонуйте, упорядочивайте информацию и элементы интерфейса. Идеально, когда в рамках одного экрана 5-7 блоков, а в меню 5-7 разделов. Далее эти разделы могут содержать подразделы, переход к которым является уже следующим шагом и комфортно воспринимается.
Когнитивная карта памяти
Ориентироваться в пространстве, полагаясь не на органы чувств, а на внутреннее представление о пространстве, помогает «когнитивная карта» или «внутренний GPS». Внутреннюю систему координат формируют открытые в результате исследования головного мозга grid-нейроны («координатные нейроны», «нейроны координатной сетки»).
Теория «внутреннего GPS» работает как в пространстве города, так и на поверхности экрана. Подчинение интерфейса какому-либо геометрическому закону делает взаимодействие с сайтом более эффективным, ведь в таком случае мозг пользуется знакомыми схемами.
Пользователи обычно попадают на сайт с определённой потребностью и пользуются своего рода шаблоном, согласно которому происходит осмысление информации. Оказавшись на вашем сайте, пользователь будет обращать внимание на те области, которые по его опыту предоставляли необходимую информацию и игнорировать те, которые не несли для него важности в схожих ситуациях.
Представьте, что в вашем смартфоне поменяли местами расположение иконок приложений. В результате этого действия вы какое-то время будете запоминать новую навигацию и по инерции искать нужное на прежних местах. Так же дела обстоят и с интерфейсом сайтов. Размещая меню в непривычном месте, а не слева или наверху страницы, вы создаёте пользователю неудобства.
Научите любить читать — фокус на типографику
Длинные строки в описании заставляют нас водить по экрану не только взглядом, но и совершать движение головой. Как мы выяснили выше, наш организм защищается от дополнительного расходования энергии, а значит шанс, что такой текст будет прочитан, ничтожно мал. Результаты исследования Якоба Нильсена подтверждает это: всего 28% пользователей читают текст на сайте компаний, а длинные тексты и вовсе пролистывают.
Чем структурированнее и гармоничнее подача материала, тем больше шансов, что человек дочитает до конца. Используйте удобную ширину строки, заголовки, инфорграфику, разделяйте текст на абзацы, делайте межстрочный интервал комфортным для восприятия. Давайте больше воздуха в расположении контента. Лучше перенести текст на следующий экран при скроллинге, чем пытаться уместить всё в рамках одного экрана. Пользователи давно не боятся длинных страниц, что подтверждает исследование аналитической компании Clicktale
Модель восприятия контента
Замечали ли вы, как чаще всего мы изучаем новости в СМИ: сначала смотрим картинку, потом читаем заголовок, если не понятно — подзаголовок, затем первую строку абзаца, аналогичным образом оцениваем последующие и в случае интереса возвращаемся и дочитываем новость целиком. Схема передвижения взгляда — слева направо, вниз, снова слева на право, снова вниз и т.д.
Вышеперечисленное доказывает теорию «баннерной слепоты». Она основывается на действии привычной когнитивной схемы, формирующей модель восприятия контента по F кривой — правую сторону сайтов пользователи ассоциируют с рекламным полем и не обращают на него внимания, а вот левую часть просматривают детально.
На языке графики
Наш мозг воспринимает сначала визуальные объекты, а если процесс идентификации не происходит, читаем текст. Наиболее комфортное расположение — картинка слева, текст — справа.
Использование пиктограмм (иконок) в тексте помогает воспринимать и фильтровать информацию. Многие из них идентифицируются в доли секунды подобно автомобильным знакам на дорогах. Для новых пиктограмм используйте пояснения.
Выделяйте важное среди прочего
В 1997 году Jakob Nielsen в ходе своего исследования установил, что пользователи бегло просматривают и воспринимают контент, игнорируя информацию, которая не решает их задачи в целях защиты от информационной перегрузки. Результаты этого исследования актуальны до сих пор.
Используете принцип контраста объектов — сложные на фоне более простых. Применяйте размытие, затемнение фона. Контраст цвета или размера является наиболее сильным раздражителем для нейронов нашего мозга и помогает сосредоточить на призыве к действию.
Для акцентирования внимания используйте фото людей. Положение тела, направление взгляда или указывающий жест рукой фиксирует внимание на определённом объекте и повышает его конверсию.
Call-to-action
Вам удалось захватить внимание пользователя? Подведите его к совершению целевого действия с помощью call-to-action — элементов призыва к действию. Их эффективность зависит от формы, содержания, цвета. Человек чётко должен понимать, куда надо кликнуть и с какой целью.
Интерактив
Умеренное использование графики и интерактива подобно хорошему вкусу в подборе и сочетании украшений или тюнинге автомобиля. Исключение можно сделать для сайтов с историей в сюжете.
С помощью приятной анимации можно управлять вниманием пользователей. Делайте акцент на движении — управление фокусом внимания, направляйте его. В ответ на действие пользователя должно происходить изменение состояния элементов. Помните, что плавное перестроение блоков наиболее комфортно для восприятия.
ID: 723
Название: Психофизиологические аспекты создания сайтов
Картинка для анонса:
Детальное описание:
Закон сохранения энергии в основе построения интерфейса
Около 25-30% энергии организм расходует на содержание нервной системы. Чем меньше времени мозг работает в интенсивном режиме, тем экономичней его содержание. (Наука и жизнь, Энергетический подход к эволюции мозга)
В целях уменьшения времени интенсивной работы, организм идёт по пути меньшего сопротивления или вовсе избегает решение проблемы.
Упрощайте и структурируйте
Обнаруженная американским учёным-психологом Джорджем Миллером закономерность, названная «Кошелёк Миллера» или «Магическое число семь плюс-минус два», состоит в том, что кратковременная человеческая память не может запомнить и повторить более 7 ± 2 элементов.
Разбивайте, компонуйте, упорядочивайте информацию и элементы интерфейса. Идеально, когда в рамках одного экрана 5-7 блоков, а в меню 5-7 разделов. Далее эти разделы могут содержать подразделы, переход к которым является уже следующим шагом и комфортно воспринимается.
Когнитивная карта памяти
Ориентироваться в пространстве, полагаясь не на органы чувств, а на внутреннее представление о пространстве, помогает «когнитивная карта» или «внутренний GPS». Внутреннюю систему координат формируют открытые в результате исследования головного мозга grid-нейроны («координатные нейроны», «нейроны координатной сетки»).
Теория «внутреннего GPS» работает как в пространстве города, так и на поверхности экрана. Подчинение интерфейса какому-либо геометрическому закону делает взаимодействие с сайтом более эффективным, ведь в таком случае мозг пользуется знакомыми схемами.
Пользователи обычно попадают на сайт с определённой потребностью и пользуются своего рода шаблоном, согласно которому происходит осмысление информации. Оказавшись на вашем сайте, пользователь будет обращать внимание на те области, которые по его опыту предоставляли необходимую информацию и игнорировать те, которые не несли для него важности в схожих ситуациях.
Представьте, что в вашем смартфоне поменяли местами расположение иконок приложений. В результате этого действия вы какое-то время будете запоминать новую навигацию и по инерции искать нужное на прежних местах. Так же дела обстоят и с интерфейсом сайтов. Размещая меню в непривычном месте, а не слева или наверху страницы, вы создаёте пользователю неудобства.
Научите любить читать — фокус на типографику
Длинные строки в описании заставляют нас водить по экрану не только взглядом, но и совершать движение головой. Как мы выяснили выше, наш организм защищается от дополнительного расходования энергии, а значит шанс, что такой текст будет прочитан, ничтожно мал. Результаты исследования Якоба Нильсена подтверждает это: всего 28% пользователей читают текст на сайте компаний, а длинные тексты и вовсе пролистывают.
Чем структурированнее и гармоничнее подача материала, тем больше шансов, что человек дочитает до конца. Используйте удобную ширину строки, заголовки, инфорграфику, разделяйте текст на абзацы, делайте межстрочный интервал комфортным для восприятия. Давайте больше воздуха в расположении контента. Лучше перенести текст на следующий экран при скроллинге, чем пытаться уместить всё в рамках одного экрана. Пользователи давно не боятся длинных страниц, что подтверждает исследование аналитической компании Clicktale
Модель восприятия контента
Замечали ли вы, как чаще всего мы изучаем новости в СМИ: сначала смотрим картинку, потом читаем заголовок, если не понятно — подзаголовок, затем первую строку абзаца, аналогичным образом оцениваем последующие и в случае интереса возвращаемся и дочитываем новость целиком. Схема передвижения взгляда — слева направо, вниз, снова слева на право, снова вниз и т.д.
Вышеперечисленное доказывает теорию «баннерной слепоты». Она основывается на действии привычной когнитивной схемы, формирующей модель восприятия контента по F кривой — правую сторону сайтов пользователи ассоциируют с рекламным полем и не обращают на него внимания, а вот левую часть просматривают детально.
На языке графики
Наш мозг воспринимает сначала визуальные объекты, а если процесс идентификации не происходит, читаем текст. Наиболее комфортное расположение — картинка слева, текст — справа.
Использование пиктограмм (иконок) в тексте помогает воспринимать и фильтровать информацию. Многие из них идентифицируются в доли секунды подобно автомобильным знакам на дорогах. Для новых пиктограмм используйте пояснения.
Выделяйте важное среди прочего
В 1997 году Jakob Nielsen в ходе своего исследования установил, что пользователи бегло просматривают и воспринимают контент, игнорируя информацию, которая не решает их задачи в целях защиты от информационной перегрузки. Результаты этого исследования актуальны до сих пор.
Используете принцип контраста объектов — сложные на фоне более простых. Применяйте размытие, затемнение фона. Контраст цвета или размера является наиболее сильным раздражителем для нейронов нашего мозга и помогает сосредоточить на призыве к действию.
Для акцентирования внимания используйте фото людей. Положение тела, направление взгляда или указывающий жест рукой фиксирует внимание на определённом объекте и повышает его конверсию.
Call-to-action
Вам удалось захватить внимание пользователя? Подведите его к совершению целевого действия с помощью call-to-action — элементов призыва к действию. Их эффективность зависит от формы, содержания, цвета. Человек чётко должен понимать, куда надо кликнуть и с какой целью.
Интерактив
Умеренное использование графики и интерактива подобно хорошему вкусу в подборе и сочетании украшений или тюнинге автомобиля. Исключение можно сделать для сайтов с историей в сюжете.
С помощью приятной анимации можно управлять вниманием пользователей. Делайте акцент на движении — управление фокусом внимания, направляйте его. В ответ на действие пользователя должно происходить изменение состояния элементов. Помните, что плавное перестроение блоков наиболее комфортно для восприятия.
Детальная картинка:
Количество показов: 6753