Разработка интерфейса и навигации

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

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

· Средства при помощи которых отображается информация, а также сама информация, форматы и коды.

· Устройства и технологии ввода данных.

· Диалоги, взаимодействие, а также транзакции между пользователем и компьютером.

· Обратная связь с пользователем.

· Поддержка принятия решений в конкретной предметной области.

· Порядок применения программы и документация на нее.

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

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

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

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

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

Главная страница является лицом сайта и кратко отображает максимальное количество информации. Главной страницей сайта является страница olesiy-nerungri.ru, представленная на рисунке.

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

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

· Тип меню.

· Раздел страницы.

· Свойства графики (цвет фона, изображения, положение и выравнивание).

· Свойства полей (размер и выравнивание).

Рис

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

Рис.

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

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

Рис

С левого края расположены логотип и название аптеки «Олеся». Неспроста логотип располагается в левой части " шапки". Это сделано, потому что основная масса пользователей принадлежит к культурной среде с направлением письма слева направо.

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

Справа находятся поиска товара и корзина покупателя, которые представлены на рисунке.

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

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

Рис

Ниже располагается каталог товаров, представленных в интерне-аптеке. Он состоит из 7 категорий: Лекарственные средства, БАДы, Изделия медицинского назначения, Ортопедия, Мама и малыш, Красота и уход, Медицинские приборы и аппараты. В каждой из категорий есть возможность выбора конкретного типа товара (рис).

Рис

«Тело» главной страницы - это её основная часть, исключающая только верхнюю и нижнюю полосы, состоит из двух колонок. «Тело» главной страницы представлено на рисунке.

В левой колонке расположена краткая информация об истории и деятельности ООО «Олеся». Она представлена на рисунке.

Рис.

Справа находится карта города Нерюнгри, где отмечены все аптеки компании (рис.).

А также блок с возможностью для покупателей оставлять комментарии и голосовать (рис.).

Рис.

Рис.

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

«Подвал» интернет-аптеки состоит из трёх элементов. Слева расположена надпись, отображающая информацию об аптеке (название и контактные данные). Все элементы подвала изображены на рисунке.

Рис.