Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Графика и мультимедиа > Мосты Москвы


Автор: Caramel 5.7.2005, 17:13
Цитата

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


Пока выкладываю страницу третьего уровня smile

Как выглядит структура:
Предпологается, что пользователь попадает на главную страницу, выбирает с какого места он начинает путишествие. Это первый уровень.
Второй - одно из колен Москвы реки, где можно выбрать интересующий мост.
Третий - описание моста.

Мне интересно насколько логично получилось расположить информацию smile
Естественно это все - субъективно. Но в этом-то и интерес - услышать мнение людей, которые, возможно, будут ресурсом пользоваться smile

Часть фотографий находится здесь: http://forum.vingrad.ru/index.php?showtopic=56892

Автор: Sardar 5.7.2005, 17:30
Классно. Красиво, качественно и со вкусом smile

Автор: Cheba 5.7.2005, 18:04
Критика. Где критика, Sardar? smile

Автор: Mal Hack 5.7.2005, 18:37
1. Заголовок простым текстом не смотрится.
2. текст по ширине.
3. не понравились как бы крепежи маленьких фотографий (слишком выделяются).
4. Низ как-то не ложится на глаз. Почему, сказать не могу smile

Автор: Alex 5.7.2005, 19:03
А мне понравилось smile

Автор: Wowa 5.7.2005, 20:09
Красиво!

Автор: LSD 5.7.2005, 21:26
Цитата(Caramel @ 5.7.2005, 18:13)
в этом-то и интерес - услышать мнение людей, которые, возможно, будут ресурсом пользоваться

Тока без обид smile

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

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

Кнопки вверх по течению и вниз по течению можно попробовать разместить вертикально.

Чертежи в левом нижнем углу, тоже ИМХО не к месту. Можно попробовать в качестве фона поставить чертеж моста.

А теперь о хорошем smile
Понравилась цветовая гамма, приятный мягкий цвет. Хорошо оформленна большая фотография и скрепка там весьма к месту. Особенно понравилось: Как добраться и Перекусить smile

Автор: Gold Dragon 6.7.2005, 08:15
Цитата(LSD @ 5.7.2005, 21:26)
Пластырь по бокам маленьких фотографий не в кассу. Создается ощущение, что фотография заляпана по краям, надо или посильней его выделить или удалить вообще.

согласен

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

Автор: Caramel 6.7.2005, 08:49
Сардар, спасибо smile


Mal Hack
Цитата(Mal @ 5.7.2005, 19:37)
1. Заголовок простым текстом не смотрится.

Да, согласна. Буду править.

Цитата(Mal @ 5.7.2005, 19:37)
2. текст по ширине.

Не очень поняла.

Цитата(Mal @ 5.7.2005, 19:37)
3. не понравились как бы крепежи маленьких фотографий (слишком выделяются).

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

Цитата(Mal @ 5.7.2005, 19:37)
4. Низ как-то не ложится на глаз. Почему, сказать не могу 

Не мур) Уточняй smile

Алекс, Шоша, спасибо smile


Цитата(LSD @ 5.7.2005, 22:26)
Выбивается неровный отрыв бумаги (верх правая половина), надо или в другим местах тоже неровный край сделать или везде ровный ставить.

Мне кажется не очень. Вроде бы к месту.


Цитата(LSD @ 5.7.2005, 22:26)
Чертежи в левом нижнем углу, тоже ИМХО не к месту. Можно попробовать в качестве фона поставить чертеж моста.


Это не чертежи. Подвал предназначен для справочной информации: как доехать, где можно отдохнуть-поесть и т.д. Рисунок просто символизирую то, что обычно пишется от руки на клочках бумаги. Может быть стоит сделать их более рваными и мятыми - это да. Но убирать - нет.


Цитата(Red @ 6.7.2005, 09:15)
Не понятно чем будет отличасться первый уровень от второго


Отличаться будет и сильно. К сожалению страница второго уровня не готова. Там предпологалось разместить карту и дать возможность выбрать мост.

Автор: Sardar 6.7.2005, 12:28
Цитата(Cheba @ 5.7.2005, 17:04)
Критика. Где критика, Sardar?

Критикую smile

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

В заголовке название("Старый Андреевский Мост") смотриться хорошо, так как шрифт не сглаженный. Хотя если бы я делал, то привычка заставила бы сделать шрифт побольше, жирным.
Под линухом все шрифты сглаженные, что сделает строчку размытой и трудночитаемой. Придёться делать крупнее.

Цвета мягкие, приятные, но это пока глазами в целом бегаешь. Как только начинаешь читать текст, сразу чувствуеться нехватка контраста. Глазные капли в помощь smile

Большая скрепка сверху смотриться хорошо, но её копия внизу "у вредных как я" smile вызывет чувство: "автор слаб на воображение или библиотека клип-арта настолько мала, что не из чего выбирать".

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

Навигация "Вернуться к карте -> главная...." очень хорошо спрятанна, вчера я её не заметил smile
Если должна служить как навигация, то выставь на видимое место, например по центру страницы, на границе светлого и тёмного.

Поделив подвал вертикально на две половины, то правая часть завершенна и приятна на вид. Левая вызывает общее чувство "не то". Не примочка в левом углу, а скорее текст, его цвет, вообще смысл текста. Возможно придираюсь smile

Автор: mvdr 6.7.2005, 12:35
может сделать анонс следующих мостов и по, и против течения? Непосвязщенному в направление течения очень сложно понять какой мост куда. или компас нарисовать.
Добавлено @ 12:35
А-а, еще можно карту Москвы и и выделять то место, где сей мост находиться

Автор: Mal Hack 6.7.2005, 12:50
Цитата(Caramel @ 6.7.2005, 09:49)
Не очень поняла.

текст по края выровнять.

Цитата(Caramel @ 6.7.2005, 09:49)
Не мур) Уточняй smile

Ну не ложится на душу как-то... smile

Автор: Cheba 6.7.2005, 13:41
Так и быть. Я тоже покритикую. smile

Опять же скотчь на фотках. Может, будет лучше сделать как в старых вотоальбомах, когда уголки фоток вставлялись в чтраницу фотоальбома.

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

Если бы Sardar не сказал про навигацию, то я бы и не нашел ее...

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

С заголовком тожде нужно что-то сделать. "Старый Андреевский Мост" - это конечно же прикольно, но перейдя к другому мосту у меня возникнет чувство, что я попал вообще на другой сайт. Вот такой вот я. smile Просто шапка сайта (лично для меня) должна быть одинаковой. Ну, там название сайта... А как подзаголовок можно без проблем вместить тот же Старый Андреевский Мост. Шапка - это заголовок сайта. А заголовок сайта - это его название. Наверное...

Автор: LSD 7.7.2005, 00:28
А я тогда похвалю smile

Сайт интерестный, по крайней мере по оформлению, а если еще и по содержанию будет Sehr gut!, то я место в закладках я для него найду smile

Автор: Caramel 7.7.2005, 17:31
Внесла небольшие исправления smile

Автор: Mal Hack 7.7.2005, 17:35
низ очень большой.
Отдельный фон под текстом "инфа моста" не катит.
Ссылки в топе (те что по середине), и названия мостов - тускло выглядят

Автор: Cheba 7.7.2005, 17:46
Вот. Шапка уже намного лучше. Мне нравится. smile

Но внизу теперь пусто стало. И текст теперь кажется оторванным от фотографии почему-то...

Автор: Caramel 7.7.2005, 17:50
Шапку переделывала. Низ пока опустел потому что убрала "рыбный" текст. smile

Думаю там подсократить подвал.
Вообще эта чать отвечает за ссылки на подобные ресурсы и вопросы типа "как добраться"

Автор: July 7.7.2005, 17:58
ИМХО текст с буквицей лучше будет смотрется.

Автор: Caramel 7.7.2005, 18:05
Цитата(July @ 7.7.2005, 18:58)
ИМХО текст с буквицей лучше будет смотрется.

Точно! smile
Джулай спасибо smile

Автор: Sardar 7.7.2005, 22:43
Под флагом "на вкус и цвет...":
  • кнопки вверх/вниз по течению лучше стояли внизу
  • заголовок раньше был лучше, я бы оставил всё как было, только текст написал бы новым шрифтом
  • ссылки в голове (ввернуться к карте, главная...) как буд-то стоят не на своём месте
  • тело страницы по центру в самый раз, текст читаем, всё красиво, в самый раз smile
  • в подвале не хватает красок, уныло как то стало.


Автор: Caramel 10.7.2005, 13:46
Еще одно исправление
(подвал чуть-чуть не наполнен. Просто думаю пока какую информацию еще можно там расположить)

Очень хочется выложить страницу выбора моста, но незя.... Слишком сырая smile

Автор: Mal Hack 10.7.2005, 13:57
Низ лучше, но:

Цитата(Mal @ 7.7.2005, 18:35)
Отдельный фон под текстом "инфа моста" не катит.
Ссылки в топе (те что по середине), и названия мостов - тускло выглядят

это не нравится... ИМХО...

Автор: Cheba 10.7.2005, 17:02
Caramel, супер! Идея с фотками-марками очень нравится. smile

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

Автор: Sardar 10.7.2005, 21:02
Вверх/Вниз в шапке лишние, ИМХО.

Идея с марками просто замечательная smile

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

В целом страница впечатляет, классно smile

Автор: Caramel 11.7.2005, 08:38
Цитата(Cheba @ 10.7.2005, 18:02)
Только вот отпельный фон для текста под большой фоткой моста теперь не нужен, имхо.

Нужен. Иначе удобство чтения пропадает - слишком мало контраста. smile



Цитата(Sardar @ 10.7.2005, 22:02)
Подвал ещё кажеться чуточку не завершённым, как буд-то последнего штриха не хватает.

Не хватает. Ты прав. Он еще не заполнен информацией. Но по всей видимости так и будет пока не отрисую оставшиеся страницы.

Автор: dr.ZmeY 13.7.2005, 03:18
Могу сказать, что не понравилась скрепка... У неё неестественный ракурс.... Нужно ли было загибать в подвале угол? Я бы просто вырвал клочёк smile и на оторванном месте дал бы копирайт...

Автор: Caramel 14.7.2005, 13:08
Цитата(dr @ 13.7.2005, 04:18)
Я бы просто вырвал клочёк

Как-то хотелось все целым оставить. Больше рваностей нет, а копирайт вроде хорошо поместился.

Цитата(dr @ 13.7.2005, 04:18)
У неё неестественный ракурс

Свет не так лежит?

Автор: dr.ZmeY 17.7.2005, 06:00
Цитата(Caramel @ 14.7.2005, 14:08)
Свет не так лежит?

smile Нет.. Перспектива... Она на плоскости, а создаётся ощущение, что под углом, как бы нижний конец уходит к горизонту... Это такое заужение... smile

Автор: IZ@TOP 29.7.2005, 11:26
Caramel, просто СУПЕР!!!! Молодец! Особенно последний вариант. smile

Автор: Caramel 29.7.2005, 22:32
Спасибо. Осталось скрепку поменять и научить кораблик не тонуть smile

Автор: Caramel 9.8.2005, 20:29
Взялась за флеш-версию.


Страница первого уровня.

Автор: Caramel 9.8.2005, 20:30
Страница второго уровня - выбор моста
Добавлено @ 20:31
Все уже отрисованно во флеше.
Кораблки плавает (и не тонет! )))) )
Ссылки мигают)

Автор: Mal Hack 9.8.2005, 21:03
Цитата(Caramel @ 9.8.2005, 21:29)
Страница первого уровня.

Очень красиво.
Единственно визуально шапочка и низ как-то в воздухе висят...

Цитата(Caramel @ 9.8.2005, 21:30)
Страница второго уровня - выбор моста

Красиво smile)

Для обоих страниц можно изображение в середине побольше сделать.

Автор: Caramel 9.8.2005, 21:06
Там много всплывающих надписей.
Названия мостов. Набережных.
Попутная информаци.

Чувствую что как сайт это не прокатит. Будет жить на диске smile

Автор: Mal Hack 9.8.2005, 21:10
Цитата(Caramel @ 9.8.2005, 22:06)
Чувствую что как сайт это не прокатит. Будет жить на диске smile

Не должны такие вещи на диске жить... В инет их !!!

Цитата(Caramel @ 9.8.2005, 22:06)
Там много всплывающих надписей.

Вопрос снят.

Автор: Sardar 9.8.2005, 23:28
Цитата(Caramel @ 9.8.2005, 19:29)
Страница первого уровня.

Качественно, со вкусом. Читай любовался минут пять smile

Цитата(Caramel @ 9.8.2005, 20:06)
Чувствую что как сайт это не прокатит. Будет жить на диске

Не нужно делать как один большой .swf, нужно подгружать инфу, сделать что то наподобие вьювера пакетов с инфой о мостах. Есессно нужно это дело программить smile

Автор: ManiaK 10.8.2005, 07:29
Цитата(Caramel @ 9.8.2005, 21:30)
Страница второго уровня - выбор моста

Не очень. Как-то расплывчато... с трудом надписи читаю.

Автор: Caramel 10.8.2005, 09:14
Цитата(Sardar @ 10.8.2005, 00:28)
Не нужно делать как один большой .swf, нужно подгружать инфу, сделать что то наподобие вьювера пакетов с инфой о мостах. Есессно нужно это дело программить 

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


Цитата(ManiaK @ 10.8.2005, 08:29)
Не очень. Как-то расплывчато... с трудом надписи читаю.

Пока кроме тебя никто не жаловался.
Посмотрим что дальше будет smile

Автор: ManiaK 10.8.2005, 09:41
Цитата(Caramel @ 9.8.2005, 21:30)
  2.jpg 30,66 Kb

В строке вверху создаётся впечатление отогнутого и пришитого края - хорошо. А вот внизу такое ощущение, что просто сверху бумажку положили. А идея, насколько понял была вроде кармашка, в котором лежит свёрнутая записка с надписью "Caramel 2005". Если так, не логично ли было бы сделать тень, чтобы показать, что записка действительно внутри кармашка?..

Автор: Caramel 10.8.2005, 09:45
Цитата(ManiaK @ 10.8.2005, 10:41)
не логично ли было бы сделать тень, чтобы показать, что записка действительно внутри кармашка?..

Логично.
Пасиб)

Отлажу карту и положу флешверсию.

Автор: Gold Dragon 10.8.2005, 10:23
Цитата(Caramel @ 9.8.2005, 20:29)
Страница первого уровня.

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

Цитата(Caramel @ 10.8.2005, 09:14)
Цитата (ManiaK @ 10.8.2005, 08:29)
Не очень. Как-то расплывчато... с трудом надписи читаю.

Пока кроме тебя никто не жаловался.

я жалуюсь smile .. действительно не читаются


Да и фон очень мрачный

Автор: dr.ZmeY 10.8.2005, 21:32
Не слишком ли блёкло?

Автор: dr.ZmeY 10.8.2005, 21:44
Гляди у Тёмы скрепка какая... http://www.microsoft.com/Rus/gov2005/

Автор: Caramel 10.8.2005, 22:22
Цитата(dr @ 10.8.2005, 22:44)
Гляди у Тёмы скрепка какая...

Поняла. Ракурс действительно не тот выбрала smile
Я не уверенна что теперь буду отрисовывать ее. Сложно в векторе.

Автор: dr.ZmeY 10.8.2005, 22:56
Цитата(Caramel @ 10.8.2005, 23:22)
Я не уверенна что теперь буду отрисовывать ее.

Отсканируй smile

Автор: Caramel 10.8.2005, 23:07
Цитата(dr @ 10.8.2005, 23:56)
Отсканируй

Так все равно надо будет рисовать)
Отсканирую ведь растр)

Автор: dr.ZmeY 11.8.2005, 01:01
Так у тебя сайт целиком флэшовый будет? Или?

Автор: Caramel 11.8.2005, 09:17
Целиком во флеше.
Все вектор за исключением самих мостов))

Автор: dr.ZmeY 11.8.2005, 16:39
Уууу... тады ясно...
Тогда раст - неоправдан...

Автор: Caramel 12.8.2005, 17:02
Все три эскиза.
по порядку:
Главная.

Автор: Caramel 12.8.2005, 17:03
Второй уровень - выбор моста.
Обратите внимание - довольно пустовато, но все надписи всплывают (надо флеш класть но он еще хромает немного). Поэтому при наведении мышки страница постоянно наполняется и меняется.

Автор: Caramel 12.8.2005, 17:07
Собственно вот они все открыты

Автор: Caramel 12.8.2005, 17:07
Третий уровень. Мост. Внутренняя

Автор: Mal Hack 12.8.2005, 17:11
Класс !!!

Автор: batigoal 26.8.2005, 08:01
От жеж делают люди... Очень здорово.

Автор: Alex 26.8.2005, 14:45
Великолепно!!!

Автор: bilbobagginz 12.9.2005, 19:48
привет, прекрасый прогрессс с предыдущим вариантом!
это по поводу первого исправления к первой скриншоте. ( после видел куда ты пошла с ним далее, но шасть - релевантна и на новый вариант )

пластыри - РУЛЯТ!!! скрепки - Супер.

но, имхо:
1) границы большого фото. а также его уложить по центру тёмной серости, а то он как-то вверх и влево сдвинут...
2) нижний регион пустоват как-то...может шрифт увеличить ? - как раз как доехать знать будут.
3) ширина границ листа, расстояние между основным текстом и расстояния меж маленьких фоток - все разные. также разные - левая и правая границы листа.
стоит подровнять (IMHO, конечно):
а) посчитать какой ширины ты хочешь границу с листом, изменить соответственно фоточки, и разместить их на том же расстоянии друг от друга (возможно надо будет их растянуть/сжать немного)
б) поставить большую фоту на одной высоте с маленькими.
в) под ней ТОЙ же ширины регион основного текста, с

сравнять все эти пробелы между фотами и краем листа.

ессно может надо будет увеличить большую и маленькие фотки, чтобы высота большой была ровно как 2 фоточки+пробел


короче ... У Дачи!

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

Автор: Caramel 13.9.2005, 13:06
bilbobagginz, все хорошо. Но если почитаешь топик внимательно увидишь, что html версия отпадает. За неимением людей которые ее смогут сверстать. Мне это точно не под силу. smile

что касается:
Цитата(bilbobagginz @ 12.9.2005, 20:48)
* симметрична и уравновешена ( и верх-низ и лево-право)
* нет большого разброса по величине
( т.е. есть несколько 2-3 стандартных величин объектов и всё)
* ровно уложена либо в сеточку (таблицу) либо по какой-то симметрии, подходящей к моему круглому (шутка ) монитору. монитор то - прямоугольный.


В чем-то ты прав. Но насколько я поняла это такие общие вещи... что применять их как законы при создании страниц smile Я могу держать их в голове. Да и на мой взгляд странички вполне удобоваримы smile

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)