Размещено на http://www.allbest.ru/

Федеральное агентство по образованию

Государственное образовательное учреждение высшего профессионального образования

Ивановская государственная текстильная академия (ИГТА)

Факультет экономики и управления

Кафедра прикладной математики и вычислительной техники

Курсовой проект

«Проектирование пользовательского интерфейса на примере графического модуля швейно-трикотажной САПР»

Выполнили: студентки группы 4э10 Горнакова С. С. Липанова Е. А. Мижиддорж П.

Специальность: информационные технологии в дизайне

Принял: Алешина Д. А.

Иваново 2010

СОдержание

Введение

1. Техническое задание: характеристика объекта и задача проектирования

1.1 Описание аналога

1.2 Формулировка задания

1.3 Анализ фактора, влияющего на проектирование пользовательского интерфейса

2. Эскизный проект

2.1 Списки

2.2 Поле ввода

2.3 Крутилки и ползунки

2.4 Панель инструментов

2.5 Пиктограмма

3. Процессы проектирования пользовательского интерфейса

3.1 Первоначальное проектирование

3.2 Создание прототипа

3.3 Тестирование

4. Рабочий проект

4.1 Создание функции инструмента

4.2 Программная реализация

Список используемой литературы

ВВЕДЕНИЕ

САПР - комплекс средств автоматизации проектирования, взаимосвязанный с подразделениями проектной организации и выполняющий автоматизированное проектирование. Под автоматизацией проектирования понимается такой способ проектирования, при котором все проектные операции и процедуры или их часть осуществляется при взаимодействии человека и ЭВМ. В результате функционирования САПР - от технического задания, последовательно, проходя ряд проектных стадий, пользователь получает рабочий проект объекта проектирования (в нашем случае это готовая модель изделия с технической документацией). Одной из важных составных частей САПР является машинная графика (обозначает обработку на ЭВМ графической информации, а также ввод результатов в виде различных графических изображений). САПР выполняет ряд процедур определенным образом логически связанных между собой и служащих для принятия проектных решений.

САПР могут быть использованы в различных областях науки, техники и производства: для автоматизации проектирования отдельных деталей, предметов и узлов; механизмов и машин, комплексов машин и агрегатов; производственных линий целых производственных предприятий и комплексов. Разработка, внедрение и развитие элементов и подсистем САПР в различных отраслях текстильной промышленности, являются одной из важных задач по выводу отросли на современный уровень мирового промышленного производства товаров широкого потребления. [1]

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

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

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

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

На основе поставленного задания, отталкиваясь от принципа работы предложенного прототипа - САПР Lectra, создан дизайн удобного пользовательского интерфейса, а так же действенное программное содержимое.

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

1. Техническое задание: характеристика объекта и задача проектирования

1.1 Описание аналога

Компания Lectra, образовавшаяся в 1973 году, - мировой лидер по проектированию, производству и распространению программного обеспечения САПР. На первом этапе своей истории Компания Lectra работала в основном над созданием программ, облегчающих изготовление лекал и оптимизацию их раскладок в швейном производстве. С того времени сфера продукции и услуг, предлагаемых Lectra, значительно расширилась. К 2009 г. расширила номенклатуру своих программных продуктов на все этапы изготовления одежды (от дизайна до продажи), текстильных изделий, в том числе технического назначения, мягкой мебели, белья, автомобильных сидений и др. Оборудованием компании оснащена большая часть швейных предприятий Китая. В 2002 г. поглотила испанского конкурента - компанию Investronica.[2]

Система автоматизированного проектирования одежды Lectra предоставляет широкий спектр услуг. Среди них:

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

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

· ColorWeave (Конструирование ткани) - программа для создания и имитации фактуры ткани.

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

· Gallery (Картотека изделий) - полностью интегрированное решение для управления информацией о продукции.

· Modaris (Конструирование, градация лекал) - программа быстрого создания лекал, моделей и градаций.

· Diamino (Раскладка лекал) - программа раскладки лекал для любого типа материала.

· Optiplan (Сердце раскройного цеха) - программа планирования производственного заказа - сердце интеллектуального раскройного цеха. Optiplan оптимизирует производственный заказ для достижения соответствия параметрам производства, дает точные инструкции каждому звену, вовлеченному в производственную цепочку, а также оптимизирует использование всего оборудования раскройного цеха. [3]

пользовательский интерфейс проектирование программный

1.2 Формулировка задания

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

1.3 Анализ фактора, влияющего на проектирование пользовательского интерфейса

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

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

Тщательное первоначальное проектирование интерфейса дает шанс избежать затянутого тестирования. Здесь важную роль играет такое понятие, как юзабилити (англ. usability).

Для компьютерных программ юзабилити понимается как "... качество работы пользователя в некоторой интерактивной среде (web-сайт, программа, и пр.)" (Як Нильсен). Этот термин еще не устоялся и его понимание нуждается в уточнении, т.к. качество работы - довольно общее понятие. Качество работы может завесить как от особенностей (способностей, навыков, и пр.) субъекта труда, так и от характеристик орудий труда. Usability - это качество использования самого инструмента. Оно выражается в тех и только тех характеристиках орудия, от которых зависит эффективность деятельности.

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

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

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

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

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

В работе подобрана приятная цветовая гамма. Основным цветом графического интерфейса является песочный оттенок с шестнадцатиричным кодом fcda6f.

2. Эскизный проект

2.1 Списки

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

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

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

Палитра цветов относится к раскрывающим спискам.



Рисунок 2.1-Окна палитры цветов

При выборе способе заливки на верхней панели инструментов предлагается раскрывающий список заливка или узор:

Рисунок 2.2-Раскрывающийся список выбора узоров

Аналогичное решение применено при выборе узла:

Рисунок 2.3-Раскрывающиеся списки стандартных узлов и возможность загрузки из БД

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

Рисунок 2.4 -Список шрифтов

2.2 Поле ввода

Тип элемента управления «Поле ввода» предназначен только для небольших объемов редактируемого текста.

В окне палитры цветов используется поля для цветовой модели RGB или CMYK, а также пользователь имеет возможность ввести шестнадцатеричный код цвета:

Рисунок 2.2.1-Палитра цветов

При работе с линиями, ластиком предусмотрена удобная опция для изменения толщины путем введения значения в поле:



Рисунок 2.2.2-Поле ввода для работы с ластиком и линиями

Справка к программе САПР - это первый уровень помощи пользователям. Использование поля ввода в поиске является необходимым атрибутом для работы со справкой.

Рисунок 2.2.3-Окно Справки программы САПР

Типовая документация - форма документа, используемая при разработке (работе с проектом) проекта и служит для интерактивности системы (Рисунок 2.2.4). Она является необязательной для заполнения.

.

Рисунок 2.2.4-Окно Типовая документация с полями ввода

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

Рисунок 2.2.5-Цветовой баланс

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



Рисунок 2.2.6-Поле ввода для инструментов изменения масштаба, угла поворота, размеров шрифта

2.3 Крутилки и ползунки

Ползунки являются плавным регулятором настроек параметров. В нашей программе используются ползунки для изменения масштаба узора, узла, в цветокоррекции изменяя уровень значения от 0 до100 %.

Рисунок 2.3.1-Ползунки для изменения масштаба узла и узора

Рисунок 2.3.2-Ползунки: регулировка баланса белого и черного ползунок масштаб в %

Рисунок 2.3.3-Инструменты верхней панели для изменения угла поворота и масштаба

Цвета в градиентах могут быть непрозрачными, частично прозрачными и прозрачными.

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

Рисунок 2.3.4-Ползунок прозрачности флажков и изменения цветов градиента

2.4 Панель инструментов

Панель инструментов (toolbar) - элемент графического интерфейса пользователя, предназначенный для размещения на нём нескольких других элементов. Это панель с кнопками и параметрами, которые используются для выполнения команд.

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

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

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

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

Внешний вид боковой панели инструментов представлен рисунке 2.4:

Рисунок 2.4-Боковая панель инструментов САПР

2.5 Пиктограмма

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

Пиктограмма хороша тем, что она визуально отделяет кнопки друг от друга и для опытных пользователей обеспечивает ускорение при поиске нужного им действия (Рисунок 2.5.1). Они особенно хороши для тех кнопок который можно легко нарисовать и для тех, которые нужны особенно часто (при этом качество пиктограммы особого значения не имеет, важно только их различия между собой). [6]

Рисунок 2.5.1-Пиктограммы панели действий

С пиктограммами, их еще называют иконками, мы встречаемся каждый день при использовании компьютера, т.к. они формируют основу графических интерфейсов, которые используются для современного программного обеспечения. Эти маленькие рисунки используются для представления файлов (включая веб-страницы) и программ, а также для выполнения команд. По своей структуре, иконки имеют стандартные размеры, обычно достаточно небольшие: 16x16, 48x48, 128x128 пикселей (Рисунок 2.5.2).

Рисунок 2.5.2-Три варианта иконок программы САПР соответственно: 48х48, 32х32, 16х16

Курсор (англ. cursor -- указатель, стрелка прибора) -- экранная пометка, показывающая:

· место на экране, где появится следующий символ

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

Представлено два варианта курсоров:

Рисунок 2.5.3 - Курсор отображается в объекте главного окна

Рисунок 2.5.4- Курсор отображается в клиентской области при работе с объектами

3. Процессы проектирования пользовательского интерфейса

3.1 Первоначальное проектирование

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

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

Последний этап в любой программе - это сохранение работы.

3.2 Создание прототипа

К курсовому проекту прилагается презентация, представляющая прототип программы САПР. См. презентацию «Прототип программы САПР.ppt»

3.3 Тестирование

Целью тестирования программного обеспечения является исследование качества продукта.

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

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

Существует множество подходов к решению задачи тестирования и верификации ПО, но эффективное тестирование сложных программных продуктов -- это процесс, в высшей степени, творческий, не сводящийся к следованию строгим и чётким процедурам или созданию таковых. [7]

Презентация прототипа программы САПР была показана трем экспертам для определения слабых мест. Посредством наблюдения за пользователем было выявлено, что восприятие интерфейса легкое.

4. Рабочий проект

4.1 Создание функции инструмента

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

Инструмент Линия предназначен для рисования прямых сплошных линий любого цвета.

Инструмент Карандаш

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

Инструмент Полигон

Соединив несколько точек, мы получим основной элемент компьютерной графики - полигон. [8]

Любой полигональный объект задается набором полигонов (иначе именуемых полигональными гранями) и потому объединяет множество таких однотипных элементов, или подобъектов, как вершины, ребра и грани (Рисунок 4):

· вершины-- это точки, в которых сходится и соединяется друг с другом любое число ребер;

· ребра -- это линии границы грани. Ребра могут быть видимыми, если соседние грани не лежат в одной плоскости, в противном случае они невидимы;

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

Рисунок 4.1-Представление вершин, ребер и граней полигона

С помощью инструмента полигона можно нарисовать различные сложные элементы одежды.

Заливка фона типовой фигурой

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

4.2 Программная реализация

В окне программы созданы инструменты Прямая линия и Карандаш, которые выполняют функции рисования. (см. Программу PaintN)



Рисунок 4.2- Программная реализация средств дизайна

СПИСОК ЛИТЕРАТУРЫ

1. http://www.studfiles.ru/dir/cat40/subj1301/file13281/view136277.html Электронный каталог

2. http://www.rustm.net/companies/69.html Российские торговый марки

3. http://www.eleandr-soft.ru/lectra.htm Дизайн и технологии

4. http://www.info-system.ru/interface/interface_design_interf_tz.html Мастерская Dr.dimdim

5. http://ru.wikipedia.org/wiki/Интерфейс_пользователя Энциклопедия

6. http://www.mgopu.ru/ininfo/ATLAS/tech_h04.htm#A12 Статья «Атлас стандартных элементов пользовательских программных интерфейсов» сайта Московского Государственного Гуманитарного Университета

7. http://ru.wikipedia.org/wiki/QA Энциклопедия

8. http://community.livejournal.com/autodeskmaya/5685.html статья полигоны сайта Autodesk

Размещено на Allbest.ru