Смекни!
smekni.com

Анализатор цветового набора для WEB-страницы (стр. 2 из 2)

1.3Формальная постановка задачи

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

1. Изучение, выбор и спецификация параметров html-страницы, по которым будет производиться анализ;

2. Выбор и изучение в необходимом объеме программных средств реализации интерфейса;

3. Разработка проекта системы, включающего в себя следующие пункты:

-структуры внешних данных;

-Разработка Спецификация требований к данной системе;

-Разработка сценария интерфейса;

4. Формирование набора тестов;

5. Реализация проекта в выбранной среде;

6. Отладка реализованной версии системы;

7. Разработка инструкции пользователю.

2 Требования к окружению

2.1 Требования к аппаратному обеспечению:

- Требования к компьютеру совпадают с требованиями ОС.

- Устройство ввода - мышь, клавиатура.

- Устройство вывода - монитор.

2.2 Требования к программному обеспечению:

- ОС MS-WINDOWS 9x/NT/2000/ХР и более поздние.

2.3 Требования к пользователю:

- Иметь навыки работы в ОС WINDOWS

- Уметь работать с устройством ввода - мышью и клавиатурой.

- Знать русский язык


3. Архитектура системы (Общие требования)

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


4. Спецификация данных

4.1Описание формата или структуры данных

4.1.1 Формат входного файла

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

Данная WEB-страница должна удовлетворять следующим требованиям:

-Документ должен быть написан на языке HTML 4.0 и выше;

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

-Код документа не должен содержать описания стилей (Style) и классов (Class);

-Код документа не должен содержать скриптов (Script) (“javascript” и др.)

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

4.1.2 Формат файла базы данных цветов

Данные о цветовых наборах хранятся в отдельном текстовом файле в кодировке Win-1251. Для разделения строк используются символы CRLF. Названием файла является: “col_base.dat”. Пример строки в “col_base.dat”: таблица 1.

Таблица 1: Формат базы данных цветовых комбинаций.

Идентификатор комбинации Набор цветов в формате RGB
<Combination 1: Cool pastels> #99cc99 #ffcc00 #99ccff

Идентификатор комбинации должен содержаться в угловых скобках ( “<”, ”>” ) и включать в себя ключевое слово “Combination”, за этим словом следует порядковый номер комбинации (1..n - integer), через “:” следует название цветовой комбинации.

Через знак пробела следует сам набор цветов в формате: #RRGGBB, где RR – доля красного цвета, GG – доля зеленого, BB – доля синего. Доли каждого из цветов записываются в шестнадцатеричном формате (1..f), строчными латинскими буквами.

Каждая запись начинается с новой строки.


5. Функциональные требования:

Данный программный продукт должен предоставлять пользователю следующие возможности:

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

- Анализировать выбранный им HTML-документ, при этом система запрашивает у пользователя следующие параметры:

- Имя и местоположение HTML-документа с помощью стандартного Windows интерфейса;

- Название метода подбора цветов, согласно которому будет произведен анализ выбранного документа;

- Указание на автоматическое определение типа предложенного документа.

- Просматривать результат анализа выбранного пользователем HTML-документа, при этом программа должна предоставить пользователю информацию о:

- Ошибках (связанных с набором цвета на данном HTML-документе);

- Недостатках (связанных с набором цвета на данном HTML-документе);

- Наиболее подходящей цветовой гамме, рекомендуемой для данного HTML-документа;

- Целесообразность использования указанного метода анализа с учетом подбора цветовой гаммы данного HTML-документа;

- Статистические сведения по цветовым параметрам, для указанного HTML-документа

- Изучать справочную информацию по ряду вопросов создания эргономичных интерфейсов, в том числе и по правилам выбора цветовой палитры создаваемого интерфейса, в зависимости от предназначения создаваемого интерфейса (в данном случае HTML-документа);

- Добавлять свои цветовые наборы в существующую базу данных, при этом система запрашивает у пользователя следующие параметры:

- Название цветовой гаммы (желательно на английском языке);

- Перечисление всех цветов из вводимого набора в формате RGB. Символ “#”, указывать не требуется (более подробно формат базы данных цветов указан в Таблице 1);

- Сохранять результаты анализа в отдельном текстовом файле, при этом система запрашивает у пользователя следующие параметры:

- Имя файла для сохранения;

- Путь для сохранения.

5 Требования к интерфейсу

Данный программный продукт должен иметь Windows-интерфейс, предоставляющий следующие возможности:

- Переход к анализатору

- Переход к справочной части

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

- Возможность выбирать метод подбора цветов

- Возможность сохранения результатов

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

6 Проект

6.1Модули и алгоритмы

Программа состоит из следующих модулей:

1. Модуля анализатора, реализующего следующие функции:

- Выбор файла (HTML-документа) для анализа

- Анализ файла, в соответствии с выбранным методом

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

- Сохранение результатов анализа

- Добавление своего набора цветов в базу данных

2. Справочного модуля, который реализует следующие функции:

- Предоставление справочной информации по выбранной теме

6.2Структура данных

Основной структурой данного проекта является промежуточный файл с именем “tempfile.htm”, который аналогичен входному файлу, но во входном файле все символы латинского алфавита преобразуются в нижний регистр, на одной строке находится только один тег.

Также используются следующие структуры, указанные в Таблице 2:

Таблица 2.

Имя Тип Комментарий
ColNum Array [1..20],[1..2] of String

Таблица перевода цвета в формат RGB:

“red” - “#ff0000”

Resrvd_Words Array [1..20] of String Массив ключевых слов языка HTML, отвечающих за цвет на странице.
Founds Array [1..1000] of String Массив, в котором хранятся все найденные цвета (в формате #RRGGBB)

6.3Проект интерфейса

В данной системе будет использован следующий проект интерфейса:


Рисунок 2: Проект интерфейса

7 Заключение

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

- Изучен язык разметки гипертекста HTML

- Изучены основы работы с Delphi.

- Разработан формат файла базы данных цвета.

- Изучены методики подбора цвета для WEB-страниц.

- Собрана, изучена и систематизирована информация о правилах создания эргономичных интерфейсов (в том числе WEB-интерфейсов).

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

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

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

Список литературы

[1] Гофман В. Э., Хомненко А. Д. ,Delphi 5. – СПб.: БХВ-Петербург, 2001. – 800 с.: ил.

[2] Карпов Б. ,Delphi: Специальный справочник. – СПб.: Питер, 2002.- 688с.: ил.

[3] Немнюгин С. А.,TurboPascal. – СПб.: Издательство «Питер», 2000. – 496с.: ил.

[4] Петров В.Н.,Информационные системы. – СПб.: Питер, 2002. – 688с.: ил.

[5] Гончаров А., Самоучитель HTML. – СПб.: Питер, 2001. – 240с.:ил.

[6] Минаси М., Графический интерфейс пользователя: секреты проектирования: Пер. С англ. – М.:Мир, 1996. – 160с.:ил.

[7] http://graphicdesign.about.com

[8] http://www.webmascon.com/design

[9] http://www.symbol.ru/dk/articles/color.html

[10] http://www.osp.ru/