В этой статье я постараюсь дать Вам базовые знания что же такое GUI (Графический интерфейс пользователя) и какой вред может нанести его неправильное проектирование.

GUI (Графический интерфейс пользователя) - разновидность пользовательского интерфейса, в котором элементы интерфейса (меню, кнопки, значки, списки и т. п.), представленные пользователю на дисплее, исполнены в виде графических изображений.

В начале карьеры (а может и не в начале) многие дизайнеры создают дизайны веб-сайтов на живую. У них есть базовое техническое задание с описанием необходимых пунктов меню и различных блоков, которые планируется разместить на сайте. И, соответственно, имея это базовое задание, дизайнеры открывают photoshop (или какую-либо другую программу) и начинают творить дизайн. Результат работы нравится, как дизайнеру, так и заказчику, но после прохождения некоторого времени использования заказчик замечает, что к некоторым частям веб сайта его посетители не добираются. Некоторые части невидимы вообще. А сложная система навигации и фильтрации вводит пользователя в уныние.

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

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

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

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

Проект веб-сайта создан и утвержден. Дизайнер постарался и сделал отличный дизайн. Разработчик воплотил дизайн в жизнь. Сайт заработал и начал приносить доход, но как же оценить – работает он на все 100.

Самый дешевый вариант встроить в сайт коды статистики имеющие возможность выводить карту кликов или тепловую карту (google и yandex  предоставляют такую возможность).  Данные сервисы показывают на какие элементы посетители чаще всего кликают а на какие не обращают внимание.

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