10014

11

ского восприятия человеком цветовой палитры экрана и формы объектов,

использованных для построения интерфейса.

Типология человеческого восприятия и его особенности

Зрение для человека является ключевым каналом восприятия. Для этой непростой задачи используется практически половина ресурсов моз-

га, которые анализируют, обрабатывают и интерпретируют информацию,

полученную человеком.

Существует два основных типа зрения- центральное и перифериче-

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

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

Рис.1. Пример центрального типа зрения. В фокусе находится «деталь» общей картины – бабочка

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

Физическое воздействие цвета обусловлено физиологией пользова-

теля и исследовано экспериментальным путем. Таким образом, стало из-

вестно, что красный цвет возбуждает нервную систему, вызывает учаще-

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

13

В настоящее время практически все операционные системы реали-

зуют взаимодействие компьютеров с пользователем через графический ин-

терфейс [1-2]. Это позволяет начинающим пользователям уверенно рабо-

тать, не испытывая сложностей и не проходя специальных курсов.

Графический интерфейс (рис.2) позволяет осуществить взаимодей-

ствие с компьютером в форме диалога с использованием меню, графиче-

ских элементов, окон и элементов управления (панелей, диалоговых кно-

пок и так далее).

Рис.2. Элементы управления графического интерфейса

Графический дизайн - художественно-проектная деятельность по со-

зданию гармоничной и эффективной визуально-коммуникативной среды.

Таким образом, дизайн позволяет реализовать графическую часть интер-

фейса, определяет цветовую палитру, разнообразие форм и решений.

Известно, что сфера дизайна постоянно развивается и изменяется

[3]. Меняются потребности людей, придумываются все новые и новые идеи, которые упрощают работу пользователей, делают ее более удобной и понятной. Достаточно обратить внимание на развитие компании

14

Microsoft. Каждая новая версия операционной системы Windows отлича-

ется от предыдущей. Самые значительные изменения произошли после выхода Windows 8.

Windows 8, в отличие от предыдущих версий - Windows 7, Windows

Vista, Windows XP и более ранних, использует новый интерфейс под названием Metro. Этот интерфейс появляется после запуска системы са-

мым первым. Он схож по функциональности с рабочим столом, который был ранее стартовым экраном. Он имеет плитки приложений (аналогич-

ные ярлыкам и иконкам), по нажатию на которые запускается приложе-

ние, открывается сайт или папка (рис.3). Интерфейс Metro более ориенти-

рован на сенсорный экран, но не исключает использование на несенсор-

ных ПК.

Рис.3. Metro интерфейс Windows 8

Кроме новых типов интерфейса в наше время стали часто использо-

ваться такие особенности, как минимализм и плоский (flat) дизайн.

Минимализм является популярнейшим трендом среди многих со-

временных дизайнеров. Обычно в стиле минимализм внимание пользова-

15

теля стараются сфокусировать на чем-то конкретном, т.е. рисуется какой-

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

носятся:

1)простота и понятность,

2)минимум графических элементов,

3)функциональный интерфейс,

4)черно-белый цвет,

5)минимальные тени.

Примером минимализма в Windows 8 может послужить диалог с пользователем во время установки операционной системы, функциональ-

ный интерфейс окна настроек, а также отсутствие теней.

Flat-дизайн, не менее популярный и близкий по стилю к минима-

лизму, также был применен в Windows 8. В основу flat -дизайна был по-

ложен двумерный стиль. Основная идея этого стиля — изображение гео-

метрии элемента только с помощью цветов, без каких-либо других спосо-

бов придания глубины: теней, скосов, рельефов, градиентов. Каждый эле-

мент пользовательского интерфейса должен восприниматься однозначно,

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

ным для пользователей. Характерные особенности:

1)никаких дополнительных эффектов,

2)использование простых фигур,

3)контрастные цветовые решения.

В настоящее время используется множество приемов в дизайне.

Ежедневно выпускаются новые программные средства, которые реализу-

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

16

зрения такие изменения и исправления являются достаточно затратными.

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

Приложения для прототипирования интерфейсов

Для заказчика проекта и для коллег необходимо заранее, еще в про-

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

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

Основными и самыми популярными средствами прототипирования на платформе Microsoft Windows являются BalsamiqMockups, WireframeSketcherStudio и Caretta GUI DesignStudio.

BalsamiqMockups - один из самых популярных инструментов для со-

здания прототипов интерфейсов. Приложение доступно для всех операци-

онных систем, и его можно интегрировать с различными системами сов-

местной работы, включая Jira, Confluence и GoogleDrive. Также есть он-

лайн-версия Balsamiq. В Balsamiq есть большая библиотека шаблонов,

причем почти любой элемент интерфейса можно настроить под конкрет-

ный сценарий.

WireframeSketcherStudio - возможно, самый удобный инструмент со-

здания макетов из рассмотренных в этой статье. В нем библиотека шабло-

нов даже больше, чем в Balsamiq, есть макеты под все популярные мо-

бильные ОС (iOS, WindowsPhone и Android) и даже некоторые веб-

фреймворки, например Bootstrap.

GUI DesignStudio распространяется в двух версиях: Professional и Express. Эту программу отличают от остальных наиболее широкие воз-

можности программирования поведения интерфейса. Содержимому форм

17

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

ния тех или иных переменных.

Литература

1.Википедия [Электронный ресурс]. – Режим доступа : https://ru.wikipedia.org/wiki / Графический дизайн.

2.Википедия [Электронный ресурс]. – Режим доступа :

https://ru.wikipedia.org/wiki / Интерфейс.

3. Уэйншенк, С. 100 главных принципов дизайна : как удержать внимание / С. Уэйншенк. – Санкт-Петербург [и др.] : Питер : Мир книг,

2012. – 270 с. : ил.

М.С. Полянский, А.Я. Лахов

КОМПЬЮТЕРНОЕ МОДЕЛИРОВАНИЕ ЭКСТЕРЬЕРА ЗДАНИЯ НИЖЕГОРОДСКОГО ТЕАТРА ДРАМЫ

Модель экстерьера здания «Нижегородского театра драмы» предна-

значена для знакомства пользователей с внешним видом одного из архи-

тектурных символов Нижнего Новгорода в режиме визуализации в реаль-

ном времени. Данная задача моделирования позволяет донести все тонко-

сти архитектурного объекта в удобной для восприятия форме.

Моделирование экстерьера здания выполняется с помощью про-

граммного комплекса фирмы Autodesk – 3Ds Max. Выбор данного про-

18

граммного обеспечения обусловлен тем, что он обладает большими воз-

можностями и гибкими настройками для моделирования [1,2].

Моделирование театра драмы происходит в несколько этапов: моде-

лирование основного каркаса здания, моделирование основных проемов

(дверей, окон) и моделирование художественной отделки здания.

Каркас здания создается из примитива “Box”, который необходимо перевести в режим полигонального редактирования “EditablePoly” и путем выдавливания и вдавливания полигонов создать объект необходимой фор-

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

Чтобы создать основные проемы для окон и дверей, используем бу-

левые (Boolean) операции вычитания и с помощью примитивов Box и Cylinder создаем оконные проемы в каркасе модели.

Рис.1. Создание каркаса Нижегородского театра драмы

20

Остальные декоративные элементы создаются при помощи редакти-

рования обычных примитивов – Box, Sphere и Cylinder.

Применяем функцию Mirror, которая копирует и отражает создан-

ную нами часть здания и получаем полную модель здания.

Далее создаем материалы, натягиваем текстуры, добавляем шабло-

ны деревьев и элементов улицы, а также добавляем освещение, после чего нажимаем кнопку Render и получаем визуальное отображение Нижего-

родского драматического театра.

Таким образом, создана 3D модель Нижегородского академического театра драмы им. А.М. Горького (рис.4). Она может стать частью вирту-

альной модели г. Нижний Новгород, которая позволит познакомить инте-

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

Рис.4. Визуализированное отображение Нижегородского драматического театра