Дизайн страницы ИНФО (info.anastasia.ru)
Выбрать сообщения с
# по # Помощь
[/[Печать]\]
На страницу Пред.  1, 2, 3, 4, 5, 6 ... 12, 13, 14  След.  Раскрыть всю тему
forum.anastasia.ru -> _Архив (Библиотека старых тем)

#61:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Ср 10 Май 2006, 12:39
    —
На данный момент - это итоговый вариант дизайна главной страницы Международного Информационно-Аналитического Центра (МИАЦ) расположенной по адресу info.anastasia.ru

Дизайн постепенно уточняется и дополняется.

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

Изменения от 10.05.06
- исправлен размер страницы (под 1024*768)
- увеличена надпись "МИАЦ"
- исправлено положение белого поля

Изменения от 19.05.06
- первый образец тех. задания и создание итоговых макетов страниц

Тех. задание ещё сырое. Надо дописать про 2 варианта дизайна и про стандартный размер страницы + уточнения и дополнения.

Дописала про дизайн для первичного входа.
Уточнен дизайн по макету varlenn

Дописала про простой вариант дизайна.



Тех. Задание.
демоматериал
- макет полноцветного дизайна страницы с анимационными элементами
- схема макета полноцветного дизайна с пронумерованными секторами страницы
- макет дизайна страницы для первичного входа на ИНФО
- эмблема ЗКР (два варианта)
- эмблема МИАЦ не представлена (нужны предложения от веб-дизайнеров), описание в тексте.
- лента орнамента для разделения столбцов в варианте простого дизайна не представлена, описание в тексте


Размеры рисунка для полноцветного дизайна страницы.
1) Либо рисунок не масштабируется, делаем под стандартное разрешение мин. 1024х768.
2) либо рисунок должен быть масштабируемым, точнее, дизайн должен быть устойчивым к изменениям горизонтали окна от 800 до 1600 хотя бы.
Пожелание - сделать всё-таки рисунок масштабируемым.

Разрабатывается три макета с различными вариантами дизайна.

1). дизайн для первичного входа на страницу ИНФО. Этот вход служит исключительно для выбора пользователем двух дизайнов ИНФО и содержит эмблему ЗКР (ветка кедра на фоне солнца), эмблему МИАЦ (летящий, парящий орел) и два ссылочных поля на разные дизайны ИНФО. Данная страница позволяет пользователю, впервые зашедшему на ИНФО, выбрать в соответствии с возможностями его компьютера и интернет-трафика тот вариант дизайна, который будет загружаться в кэш быстрее. В дальнейшем этот пользователь будет попадать сразу в тот дизайн, который поставит себе по умолчанию, но с возможностью всегда его поменять на второй вариант.
Страница первичного входа оформляется в соответствии с предоставленным макетом. Основной фон - зеленый и голубой. В центре страницы помещено слово ВХОД (не активно). Справа и слева от него располагаются два ссылочных поля (кнопки, стилизованные под солнца), подписанные "Полная версия" и "Легкая версия" соответственно. Вверху страницы первичного входа дается надпись Международный Информационно-Аналитический Центр (шрифт повторяется из шапки дизайна ИНФО, см.ниже), под ним более мелким шрифтом надпись "Объединенные ресурсы под знаком ЗКР". и в ряд с этой надписью - эмблема МИАЦ - парящий орел. Слева от названия МИАЦ в шапке помещается эмблема ЗКР. Внизу страницы по центру под входами в два варианта дизайна ИНФО помещается краткий текст-приветствие с информацией о назначении МИАЦ.
Image

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

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

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

Image

В «шапка» страницы изображён пейзаж (4,5,6) (стилизованный под векторное изображение): голубое небо (градиент), холмы покрытые лесом и луга.
На фоне неба расположено название страницы: «Международный Информационно-Аналитический Центр» и ниже, более мелкая надпись «Объединённые ресурсы под знаком «ЗКР».

В левой части «шапки» видна крона дерева с ветками, хвоёй и кедровой шишкой. (1,2)
Одна ветка отходит от ствола вправо и располагается на фоне солнца (3), образуя, таким образом, символ ЗКР (ветка кедра на фоне солнца).

Нижнее горизонтальное поле (17,18 ) состоит из изображения травы.

Большая правая область страницы состоит из двух частей:
1) узкая вертикальная область (10,11,12), на которой изображено продолжение пейзажа из «шапки» страницы. Таким образом, эта область визуально составляет одно целое с «шапкой».
2) Белое информационное поле (19), выделенные границы этого поля (16) а также небольшой элемент в виде загиба листа бумаги (8 )

Описание каждого сектора на странице:

1. Рисунок. Ствол кедра и часть кроны
2. Рисунок. Часть ствола, пейзаж, крупная ветка, хвоя и шишка. Возможно шишка будет отдельным изображением-ссылкой.
3. Анимированный объект (flash). Небольшое покачивание (на ветру) ветки и создающийся из-за этого эффект мерцание солнца (свет, проходящий через хвою).
При наведении курсора вокруг солнца появляется надпись «Звенящие Кедры России». При убирании курсора надпись исчезает. Этот элемент также является ссылкой, ведущей на сайт Anastasia.ru

Image

4. 5. 6. Рисунки. В пятом секторе располагается заголовок страницы
7. Рисунок. Дощечка-кнопка
8. Рисунок. Загиб листа.
9. Рисунок. Изображение края ствола кедра. Это изображение повторяется на протяжении всего ствола (до сектора 2), чтобы уменьшить итоговый размер страницы. Однако, при этом должно сохраняться визуальное единство ствола.
10. 11. Рисунки. Являются продолжением пейзажа, изображённого в «шапке страницы».
12. Рисунок. Изображение травы. Является переходным от анимированного 18 сектора к 11-му. Создаёт визуальное единство секторов 11 и 18.
13. Рисунок. Изображение коры. Такой же принцип, что и в секторе 9.
14. Рисунок. Белый цветок, находящийся между дощечками. Это изображение повторяется на протяжении всего ствола кедра (как и секторы 9 и 13)
15. Рисунок. Кора дерева. Повторяется между всеми дощечками.
16. Граница белого поля (рисунок наверное?..)
17.18. Анимированные объекты (flash). Изображение травы, которая слегка покачивается (на ветру). Анимация интерактивная. При проведении по траве курсором, она (трава) пригибается и снова выпрямляется.
Сектор 18 может быть разделён на несколько одинаковых flash-элементов (для экономии трафика)

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

--
Исправлено мама Света Пт 19 Май 2006, 23:31


--
Исправлено мама Света Вс 21 Май 2006, 14:36


Последний раз редактировалось: Eco-Heretic (Сб 20 Май 2006, 19:58), всего редактировалось 11 раз(а)




Дизайн-ИНФО.jpg

 Имя файла:
Дизайн-ИНФО.jpg
 Просмотрено:  123996 раз(а)  Размер файла:  48.43 KB




Дизайн-ИНФО---схема.jpg

 Имя файла:
Дизайн-ИНФО---схема.jpg
 Просмотрено:  123996 раз(а)  Размер файла:  42.05 KB


#62:  Автор: love_harbingerНаселённый пункт: Kursk - Greece СообщениеДобавлено: Сб 06 Май 2006, 23:47
    —
Лучше бы я дурак всё таки молчал про шапку...
Кстати, у варлена она хороша.

А насчет гирлянды из земли, это уже надо Еретику на компе сделать (аль вообще не делать)

Не вырезать же одну веревку с бумаги...

#63:  Автор: varlenn СообщениеДобавлено: Вс 07 Май 2006, 0:22
    —
Спасибо, что нравится. Если сделаю полезное для самого любимого сайта, то значит не зря дизайном занимаюсь многие годы Smile
Осталось дерево вставить слева, у меня просто не нашлось под рукой ничего подходящего, кроме одной векторной ёлкиSmile

На счёт анимации, хотел сделать проблывающие облака, да там надпись МИАЦ, и если добавить анимацию, то тогда шапка автоматически превращается из статичной картинки (jpg, gif), в flash ролик. А для просмотра сайта с флэш анимацией зашедшему будет автоматически предложено скачать програмку (~800 кб), для просмотра флэш сайтов. Такие дела.
И чтоб сделать более сложную анимацию, нужен флэш-дизайнер, флэшер (зря я Flash не учил).

#64:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Вс 07 Май 2006, 10:23
    —
varlenn, классня картинка! Правда солнце немного не на месте. А ты не мог бы мне мне отдельно выслать: шрифт, саму картинку и солнце (на прозрачном фоне). Я всё это совмещу и выложу итоговую картинку. Солнце, кстати, очень симпатичное. Smile

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

love_harbinger,
Цитата:
Нарисовать очень красивую шапку, похожию на ту что сейчас есть, и с солнцем, и небом...

Всё-таки, солнце с веточкой кедра - это отдельный элемент, он должен быть анимированным.

мама Света,
Цитата:
Может, тогда и ствол заполнится полностью.

Это будет некрасиво. Внизу ещё можно одну добавить, но вот вверху... я думаю, что верхняя дощечка должна быть на одном уровне с верхней границей белого поля.
А верхняя часть ствола относится к шапке - от него отходит ветка (значит придётся использовать рисунки).
Анимация - пока это ветка кедра, появляющаяся надпись "ЗКР" и трава внизу страницы. На мой взгляд - хватит и этого. Пока. Wink

varlenn, на счёт флеш-роликов: сейчас это тоже не является проблемой. В крайнем случае, как ты говоришь, вошедшим будет предложено скачать флеш-плеер.
А пока человек не скачал его - вместо аниированных картинок будут статические (или - пустые поля). Для этого шапка не должна быть одной картинкой, а должна быть разбита на несколько сегментов-картинок. Какие-то из них статические, другие - анимированные.

#65:  Автор: ShamboНаселённый пункт: Russia СообщениеДобавлено: Вс 07 Май 2006, 10:30
    —
Василий дорогой, ты же можешь солнце рисовать с фоном вместе, а Тимыч потом вырежет всю картинку, как круг. И вообще проще рисовать картинку с фоном её окружающим, а потом соединять только геометрические фигуры, в которые вписывается картинка с фоном . И подгонять одну к другому. Т.е. вот будет кружок , в нем солнце светится, и ветка, а вокруг небо, цвета как у варлена на шапке допустим, у ветки ствол можно удленнить, и тогда Тимыч просто соединит само дерево с веткой путём соединения
этого круга с картинкой, где дерево. Кедр тоже можно рисовать с фоном, вверху голубое небо внизу , ну внизу сложнее, т.к. надо будет потом совместить контуры кустов и долины. Но в принципе можно постараться и сделать , а эти контуры можно соединить заполнив между фоном картинки с кедром и фоном шапки еще кустиков или бугорков.
Василий, а почему не помещается шишка, ну хоть маленькая, как-будто только выросла, типа у нас конец весны, только созревают всё.
Мальчика я так поняла рисовать не будем?
И еще по-моему надо уже с названием определяться.

#66:  Автор: мама СветаНаселённый пункт: Мытищи М.О. СообщениеДобавлено: Вс 07 Май 2006, 10:31
    —
Eco-Heretic,
Цитата:
Кажется, Света предлагала изобразить поместье (хотя бы какой-нибудь домик)...

Это не я, это Ольга предложила
Shambo писал(а):

Если можно в Варленову картинку добавить чуть крыши и немножко очеловеченного поместья, а скраю реку нарисовать. Чтобы создавалось впечатление что в середке поселение или краешек поместья, окруженного лесом.

а love_harbinger ответил
Цитата:
Поместье неплохая идея добавить. А вот реку не советую, на таком стиле она не будет выглядеть нормально.

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

Ответ Василия (на пред.странице)
Цитата:
Я об этом думал и пришел к выводу что результат не будет хорош, так как ветка слишком мала и тонка, а толстая не будет выглядеть приятно


Последний раз редактировалось: мама Света (Вс 07 Май 2006, 10:36), всего редактировалось 1 раз

#67:  Автор: мама СветаНаселённый пункт: Мытищи М.О. СообщениеДобавлено: Вс 07 Май 2006, 10:35
    —
Shambo,
Цитата:
И еще по-моему надо уже с названием определяться.
Эт точно, в теме с названием МИАЦ уже за двадцать вариантов накопилось. Выбор богатейший.

#68:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Вс 07 Май 2006, 10:51
    —
мама Света, Shambo, на счёт шишки. А зачем её рисовать прямо на конце ветки? Может сделать так: от толстой ветки (которая вверх уходит) отходит коротенькая ветка (пучок хвои) и на ней весит шишка. Т.е. она будет гораздо левее солнца, близко к толстой ветке.

#69:  Автор: мама СветаНаселённый пункт: Мытищи М.О. СообщениеДобавлено: Вс 07 Май 2006, 10:57
    —
Eco-Heretic, а про "прямо на конце ветки" никто и не говорил. Smile
Цитата:
Может сделать так: от толстой ветки (которая вверх уходит) отходит коротенькая ветка (пучок хвои) и на ней весит шишка. Т.е. она будет гораздо левее солнца, близко к толстой ветке.
Надо смотреть. Рисуйте, мальчики, рисуйте Smile.

#70:  Автор: love_harbingerНаселённый пункт: Kursk - Greece СообщениеДобавлено: Пн 08 Май 2006, 15:50
    —
Сделаю шишку и посмотрю

#71:  Автор: ShamboНаселённый пункт: Russia СообщениеДобавлено: Пн 08 Май 2006, 16:28
    —
Решила описать символы. к-е должны быть на Главной МИАЦ.
1. Фон картина с пейзажем Родины нашей, причём таким, какой он должен быть. Леса, зеленая трава, голубое небо, залитые солнцем луга. Если получится там как-нибудь отразить поместья, хорошо, т.к. будет реальный образ Родины и того пространства, где должен жить человек.
2. Кедр , кедровая ветка на фоне солнца, символ Двидения ЗКР.
3. Если возможно добавить шишечку, то в каком-то роде она будет символизировать плоды этого Движения.
4. Лестница на кедре в какой- то мере символизирует этот МИАЦ, т.к воспользовавшись её можно увидеть все пространство сверху всех поместий, и имея это представление, уже что-то создавать своё. (Т.е. вспомнилось ,как малышей орлы поднимали в небо, чтобы они запомнили поместье сверху и видели всю землю)
5. А дощечки этой лесенки - это ресурсы МИАЦ, на к-е мы можем опираться , двигаясь к своей цели.

#72:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Пн 08 Май 2006, 18:56
    —
Вот ещё доделал картинку. Добавил шишку и продлил "лиану" до земли. Правда, всё равно, не понятно, куда она (лиана) должна уходить вверху... Question Что можете предложить? Wink

Последний раз редактировалось: Eco-Heretic (Вт 09 Май 2006, 11:23), всего редактировалось 1 раз




Дизайн-ИНФО.jpg

 Имя файла:
Дизайн-ИНФО.jpg
 Просмотрено:  10304 раз(а)  Размер файла:  66.91 KB


#73:  Автор: мама СветаНаселённый пункт: Мытищи М.О. СообщениеДобавлено: Пн 08 Май 2006, 19:02
    —
Eco-Heretic,
Цитата:
Правда, всё равно, не понятно, куда она (лиана) должна уходить вверху...

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

#74:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Пн 08 Май 2006, 19:23
    —
мама Света, ...ты имеешь в виду: ветка будет выходить из-за левого края страницы? Можно попробовать...

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

#75:  Автор: мама СветаНаселённый пункт: Мытищи М.О. СообщениеДобавлено: Пн 08 Май 2006, 20:02
    —
Eco-Heretic, Ага.

#76:  Автор: Eco-HereticНаселённый пункт: Казахстан, Семипалатинск СообщениеДобавлено: Вт 09 Май 2006, 11:27
    —
Обновил картинку (см. выше)

Теперь картинка смотриться гораздо лучше (на мой взгляд).

Огромное спасибо varlenn за фон, солнце и шрифты. Smile

    Добавлено пользователем cпустя 10 мин., 23 сек.:
Что осталось:
1) Пока не знаю, как лучше разместить название (которое в шапке).
Надо сделать крупнее, но тогда принётся размещать надпись МИАЦ в несколько уровней. Так, как сейчас оставлять всё-равно нельзя, т.к. надпись слишком близко подходит к солнцу - а там анимация будет (появляется надпись "ЗКР")
2) Разобраться наконец с лианой. Правую лиану можно к толстой ветке путить. А вот что левую... Наверно, придётся ещё одну ветку делать (растущую от другого дерева, за левым краем страницы) и цеплять лиану за неё.
Кстати, а в природе вьюнки используют сосны (кедры) как опору? Я просто такого не встречал... Confused



forum.anastasia.ru -> _Архив (Библиотека старых тем)


output generated using printer-friendly topic mod. Часовой пояс: GMT + 4

На страницу Пред.  1, 2, 3, 4, 5, 6 ... 12, 13, 14  След.  Раскрыть всю тему
Страница 5 из 14

Powered by phpBB © 2001,2002 phpBB Group