Разработка дизайн-макета для web-страниц курсовой работы

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

1) создаётся белое изображение стандартного для веб-страницы размера – 1024x768 (рис. 3.3);

2) на изображении выделяем эллипс, уходящий за рамки изображения (с помощью кадрирования области, которые ушли за границу изображения, можно обрезать). Мы его вырезаем, а на пустое (прозрачное) пространство помещаем нужное изображение, часть его – остаётся за белым слоем (рис. 3.4);

Рис. 3.4 Окно визуального редактора GIMP, выполняется выделняется эллиптическое выделение

3) избавляемся от нижней части эллипса для создания навигации;

Рис. 3.5 Вырезана нижняя часть верхнего слоя

4) аналогичными простейшими обрезаниями создаётся изображение справа и линии для меню. При соблюдении контура большого эллипса, создаётся некий стиль страницы, появляется вид аккуратной рассортировки изображений;

Рис. 3.6 Вставленное изображение, находящееся внизу слева

5) создаётся текст в определённом расположении – «по дуге»;

6) сверху накладывается ещё один слой отдельного чёрно-белого изображения. Со сменой его прозрачности у страницы появляется не столь очевидный, но уместный рисунок, чтобы заполнить белый фон. Смена прозрачности происходит на рис. 3.7; конечная версия страницы – рис. 3.8.

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

Рис. 3.7 Смена прозрачности

Рис. 3.8 Окончательная версия дизайн макета в формате png