1. Главная
2. Кейсы
3. Газоны Костромы
4. Техническое задание

Техническое задание на справочник по газону с калькулятором

Пример ТЗ по кейсу «Газоны Костромы»: справочник описан таким, каким он работает на kostromagazon.ru. Так выглядит документ, который мы составляем до начала работ: что на каждой странице, как считает калькулятор, что проверяем при приёмке.

1. Общие сведения

Назначение	Справочник по газону на частном участке в Костроме и области: расчёт семян и рулонов, сроки работ по месяцам, выбор вида газона.
Аудитория	Владельцы домов и дач, которые сеют или укладывают газон сами и хотят понимать местные сроки.
Главная задача	Узнать, сколько семян или рулонов нужно на свою площадь и в какие недели их сеять или укладывать, чтобы газон пережил костромскую зиму.
Чем не является	Магазином: цен на сайте нет, бюджет считается только по цене, которую вписал сам человек. Оценок и рейтингов фирм нет.
Язык	Русский.

2. Структура сайта

• / — главная: калькулятор, лента сроков, виды газона, таблица норм, вопросы
• /kalendar/ — календарь работ март–ноябрь
• /partern/ — партерный газон
• /sportivnyj/ — спортивный газон
• /tenevoj/ — теневой газон
• /rulonnyj/ — рулонный газон

Шапка на всех страницах: знак-лист и название «Газоны Костромы», меню из четырёх пунктов (Калькулятор, Календарь работ, Виды газона, Где купить). До 980 px меню прячется за кнопку, Esc закрывает. Подвал: полоса травы с силуэтом построек, то же меню, подпись «Справочник для владельцев частных домов и дач». На внутренних страницах — хлебные крошки. Страницы видов намеренно устроены по-разному: тест, списки, ползунок, сравнение.

3. Главная страница

1. Первый экран: заголовок «Газон, который переживёт костромскую зиму», кнопки к калькулятору и к ленте сроков, три тезиса с иконками, фото газона у бревенчатого дома с рукописной подписью.
2. Калькулятор семян и рулонов (раздел 4).
3. «Когда что делать в Костроме»: лента из семи дат от середины апреля до середины ноября, ссылка на календарь.
4. «Какой газон подойдёт»: четыре карточки с фото, каждая ведёт на страницу вида.
5. Таблица норм высева: тип, нагрузка, свет, уход, норма посева и подсева.
6. Частые вопросы: шесть раскрывающихся ответов.

4. Калькулятор семян и рулонов

4.1. Поля

Поле	Значения	По умолчанию
Площадь, м²	1–100 000	500
Тип газона	партерный, спортивный, теневой, рулонный	партерный
Подсев	галочка	выключена
Цена, ₽	за кг семян или за рулон, необязательно	пусто

4.2. Расчёт

• Семена, кг = площадь × норма / 1000, выводится диапазоном. Нормы, г/м²: партерный и спортивный — 40–50 (подсев 20–25), теневой — 35–45 (подсев 18–25).
• Рулоны = ⌈площадь / 0,8 × 1,07⌉: рулон 0,4 × 2 м, запас на подрезку 7 %. Считаются при любом типе.
• Для типа «рулонный» семена не считаются (подпись «семена не нужны»), поле цены становится «Цена за рулон».
• Бюджет = кг × цена за кг (диапазон) или рулоны × цена за рулон, округление до 10 ₽. Без цены — прочерк и подсказка вписать цену из магазина.
• Пересчёт на каждый ввод, изменившаяся цифра коротко подпрыгивает.

5. Календарь работ

1. Вводный абзац «коротко по сезону» и оговорка: окна — средние многолетние, сдвиг на неделю-две нормален.
2. Полоса сезона: шкала с 1 марта по 1 декабря, полосы снега, заморозков, двух окон посева (15.05–10.06 и 15.08–5.09, почва +8…+10 °C) и сезона стрижки. Полосы «вырастают» при появлении на экране.
3. Отметка «сегодня» ставится по дате браузера, если дата между 1 марта и 1 декабря; вне сезона отметки нет.
4. Девять карточек месяцев: «что делать» и «пора, если». Карточка текущего месяца подсвечена и получает метку «сейчас».
5. Три частые ошибки и четыре вопроса «если весна не по календарю».

6. Страницы видов газона

6.1. Партерный — тест

Три вопроса по два ответа: готовы ли косить раз в 5–7 дней; будут ли на газоне дети с мячом или собака; есть ли полив, когда хозяев нет. Вердикт появляется после третьего ответа:

Ответы	Вердикт
Все три в пользу партера	«Партер — ваш вариант»
На газоне каждый день играют	«Лучше спортивный газон»
Остальные сочетания	«Партер будет страдать»

Дальше на странице: состав смеси из трёх трав и «Сколько работы за лето» — 15–20 стрижек, высота 4–5 см, 2–3 подкормки, прочёсывание раз в год.

6.2. Спортивный

Два списка «выдержит / не выдержит», состав смеси с полосками долей (мятлик, овсяница красная, райграс), ремонт вытоптанного места за выходные — четыре шага.

6.3. Теневой — часы солнца

Часы прямого солнца	Что показывает сайт
0–1	«Газон здесь не вырастет» — почвопокровные или кора
2–3	«Теневая смесь — но редкой будет»
4–5	«Теневая смесь подойдёт», норма 35–45 г/м²
6–8	«Тени почти нет» — обычная смесь

Ползунок 0–8 с шагом 1 час, по умолчанию 3. Яркость фото участка меняется вместе с ползунком. Ниже — три случая тени (берёза, ель, северная стена) и таблица трёх теневыносливых трав.

6.4. Рулонный

Три цифры в первом экране (0,8 м² в рулоне, запас 5–10 %, около 3 недель до первой нагрузки), сравнение «рулон или посев» в пять строк, лента «день укладки и три недели после» — шесть шагов.

7. Источники чисел

Климатические даты — с источником; агрономические нормы — ориентиры, на сайте подписаны оговоркой «на упаковке может быть своя норма».

• Сход снега в середине апреля, снег лежит 150–155 дней, безморозный период 100–130 дней — МЧС России по Костромской области, «Характеристика субъекта».
• Устойчивый снежный покров — середина ноября: обзор ЦГМС за 2021 год.
• Последний весенний заморозок — середина мая, первый осенний — конец сентября: даны словами, сходятся с безморозным периодом по данным МЧС.
• Нормы высева, окна посева, температура почвы, высота покоса, размер рулона — общепринятые ориентиры с оговоркой.

8. Дизайн

Журнальный «садовый» стиль: кремовая бумага с точечной фактурой (#F6F1E7), тёмно-зелёный мох (#24452F), жёлтые кнопки (#E8B931) с тенью-подложкой, асимметричные скругления фото, рукописные пометки поверх снимков. Шрифты: Fraunces для заголовков, Golos Text для текста, Caveat для пометок. Фото газона, участка и тачки — сгенерированы и подготовлены в двух плотностях под ретину; знак, иконки, лента дат, трава в калькуляторе и полоса в подвале — SVG. Анимации: подпрыгивание цифр результата, поочерёдное появление ленты дат, рост полос сезона, пульс точки «сегодня», подъём карточек при наведении, лёгкий наклон фото за курсором (только на мыши). При настройке «уменьшить движение» всё отключается.

9. Технические требования

• Статические страницы: HTML, CSS, JavaScript без библиотек одним файлом; расчёты — в браузере, без сервера. Ничего не хранится в браузере.
• Шрифты и все файлы — на своём сервере, сторонних запросов нет.
• Адаптивность: контрольные точки 980, 640 и 560 px; одна колонка, лента дат вертикальная, таблица норм — карточками, без горизонтальной прокрутки на 390 px.
• SEO: свой title и description у каждой страницы, canonical, schema.org (WebSite на главной, Article и BreadcrumbList на остальных), картинки для соцсетей 1200 × 630, sitemap.xml, robots.txt.
• Доступность: один H1 на странице, alt у содержательных картинок, вопросы — на нативных раскрывающихся блоках.

10. Приёмка

Проверка	Ожидаемый результат
Значения по умолчанию: 500 м², партерный	Семена 20–25 кг, 669 рулонов, бюджет — прочерк
Подсев, партерный, 500 м²	10–12,5 кг
Теневой, 500 м², цена 300 ₽/кг	17,5–22,5 кг, бюджет 5 250–6 750 ₽
Тип «рулонный»	Семена — прочерк, поле цены «за рулон»
Тест партера: «да, каждый день» во втором вопросе	«Лучше спортивный газон» со ссылкой на /sportivnyj/
Ползунок солнца по умолчанию	3 ч, «Теневая смесь — но редкой будет»
Календарь в сезон	Отметка «сегодня» на полосе, текущий месяц с меткой «сейчас»
Ширина 1440 и 390 px	Нет горизонтальной прокрутки, меню открывается кнопкой, ошибок в консоли нет
Сторонние запросы	Нет ни одного