Простой способ проектировать сайты тщательнее

14.03.2007

Тщательное проектирование значительно повышает эффективность процесса разработки. Это общее место. Об этом не писал только ленивый. Но как заставить себя проектировать с нужным уровнем детализации? Как повысить эту самую тщательность? Как понять, что ты продумал будущий сайт уже достаточно подробно?

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

Бумажные прототипы хороши. Не нужно ни специальных инструментов, ни особых навыков. Рисуются они мгновенно. Их можно тестировать. На alistapart.com недавно была вдохновенная статья (англ.).

При необходимости с бумаги сайт можно перенести в Visio. Помогут штучки от Гаррета (Garrett Dimon).

Статичная версия сайта. Несмотря на то, что идея не так уж оригинальна, всерьез я задумался о статичных HTML-прототипах только после дискуссии на xpoint.ru.

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

Ну и, наконец, прототипы на движке. Здесь всё понятно. Это промежуточные версии сайта с ограниченной функциональностью.

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

Комментарии

Артём Курапов, 14.03.2007 21:13

Давече делал эти "прототипы на движке" как раз. Сначала правда на бумаге всё нарисовал. Что приятно так то что можно фактически copy-paste'ом форм и элементов заниматься. Это значительно легче, когда функциональностей ещё не прикручено.
Плюс ещё в том что дизайнер сразу видит как программер видел общий скелет сайта и может наваять красивости, которые прикручиваются вместе с функциональностью.
Да и с функциональностью проще становится - сразу ясно какие надо данные показать, следовательно остаётся спросить с базы и записать.
Значительно ускоряется разработка.

http://kurapov.name

Дмитрий Сергеев, 14.03.2007 21:17

Что, опять name не прошел? Странно как-то. Я пороюсь в фильтрах, а ты, если что, оставляй ссылку с помощью тега A. Он не вырезается.

Да, мне тоже нравится именно момент детализации БД. Меньше потом придется форм переделывать из-за забытых полей. Главное, чтобы наполнение было реальным.

Дмитрий Сергеев, 15.03.2007 15:42

Только что проверил, вроде работает: сайты в зоне name не вызывают возражений у валидатора.

Джо, 15.03.2007 10:33

А что, никогда так не делал, но звучит здраво. Это я про статичную версию до сайта на движке. Попробую, спасибо.

Mr. Mishin Oleg, 15.03.2007 13:33

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

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

2 - сверстанные html-страницы. Это вообще очень удобная вещь: вопервых при создании этих страниц с линками-связками получаешь некий прототип реального сайта и параллельно прорабатываешь детали.
Кроме того, на этих же документах утверждается дизайн с клиентом, потому как дизайн в JPG - это не совсем то самое интерактивное ощущение от сайта.
Ну и опять же, как верно заметил автор - это те самые шаблоны для финального варианта, котоыре просто остается вставить в движок.

Дмитрий Сергеев, 15.03.2007 13:38

Значит, люди так делают. Отлично. Теперь и я буду. По-моему более или менее четкий порядок действий при разработке сайта -- очень хорошее подспорье.

Помню, года три назад, не знал, за что взяться. То дизайн рисую, то верстаю его, то БД проектирую, то движок, то SEO. И всё это без системы и в полном беспорядке. Очень сложные времена были. Эпоха меганеэффективности :)

idcontent, 15.03.2007 14:01

После того, как "отрисовано" на бумаге, можно приступать к XHTML/CSS прототипированию. Если более-и менее знаешь эти технологии, прототайпинг становится легкой и приятной штукой :) Это ОЧЕНЬ удобно.

Возможно, эта ссылка будет полезной

Как писать эффективный XHTML/CSS код

Я может не понял чего-то, но как в твоем проектировании учитывается task flow то есть изменение от страницы к странице в процессе решения своих задач предполагаемым пользователем?

Дмитрий Сергеев, 15.03.2007 14:09

То есть как сделать много похожих друг на друга страниц в статике? И как изменять общие на всех страницах блоки?

ARKAN, 15.03.2007 17:03

offtopic
как говорится извиняюсь, но очень хочется услышать ваше мнение
http://arkan.myst-lit.com.ua/archives/45

Дмитрий Сергеев, 15.03.2007 17:23

Да уж, действительно офтоп. И в мониторах я не очень разбираюсь. Купил три года назад LCD 17'' от Филипс и ничего вроде :)

Elena, 16.03.2007 09:33

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

Дмитрий Сергеев, 16.03.2007 10:19

Я вам написал письмо. Попробуйте на него ответить.

Вообще же всё должно быть в порядке.