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

Техническое задание на справочник о переезде

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

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

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

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

• / — главная: погрузка в кузов, как грузят, что не доверять кузову, переезд по дням кратко, вопросы
• /pereezd/ — план переезда по дням, как подписать коробку, сумка первой ночи

Меню нет. Навигация — «накладная», закреплённая наклейка в правом верхнем углу: «Погрузка», «Переезд по дням» и счётчик — «Вещей в кузове» на главной, «Сделано» на /pereezd/. Шапка — логотип-грузовик, домен, «Переезд без сюрпризов. Новокузнецк и Кузбасс».

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

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

4. Погрузка в кузов

4.1. Вещи и кузова

Вещь	Д × Ш × В, см	По умолчанию
Диван	210 × 95 × 90	1
Шкаф	100 × 60 × 200	1
Холодильник	65 × 65 × 185	1
Стиральная машина	60 × 60 × 85	1
Кровать в разборе	200 × 35 × 160	1
Стол	120 × 75 × 75	1
Стулья	45 × 45 × 90, в два яруса	4
Коробки	60 × 40 × 40, ярусами до четырёх	8

Количество меняется кнопками ±: до 12 штук, коробок — до 80. Размеры вещей подписаны у каждой как примерные.

Кузов	Внутри, Д × Ш × В, см
«Газель» 3 м	300 × 195 × 200
4 м	420 × 200 × 200
5 м	500 × 205 × 220
6 м	600 × 210 × 220
Свой кузов	длина 150–900, ширина 120–260, высота 100–300

4.2. Правила раскладки

• Пол кузова — сетка 5 см. Вещь, которая выше кузова, кладётся на бок: на плане контур пунктиром и подпись «лёжа». Если и лёжа не встаёт — «не влезает».
• Для каждой вещи перебираются все свободные позиции и два поворота; выбирается место, где вещь сильнее всего касается бортов и соседей, при равенстве — ближе к кабине.
• Пробуются три порядка погрузки — очередь (тяжёлое и высокое раньше), по площади, по длине. Берётся тот, где меньше вещей не влезло, при равенстве — меньше занятой площади.
• План: кабина слева, двери справа, сетка 50 см, размеры кузова подписью. Новые вещи «падают» на план.

4.3. Вывод

Результат	Что показывает сайт
Всё влезло, пол занят больше чем на 85 %	«Влезает» и «Впритык: мелочи и сумки уже некуда»
Всё влезло, 60–85 %	«Влезает» и «Останется немного места для мелких вещей»
Всё влезло, до 60 %	«Влезает» и «Места с запасом — может хватить и машины поменьше»
Не всё влезло	«Не влезает» со списком вещей и первый больший кузов, где всё встанет, или «не хватит и 6 м — вторая ходка»
Холодильник поедет лёжа	Пометка «лучше везти стоя — нужен тент повыше»

Шкала показывает процент занятого пола. Ничего не сохраняется: после перезагрузки — значения по умолчанию.

5. Страница «Переезд по дням»

1. Карточка: крошка «← к погрузке», заголовок, полоса прогресса в процентах, рисунок коробки «КУХНЯ / посуда».
2. План: шесть этапов и 20 дел с пояснениями — за 2 недели (4), за неделю (3), за 2 дня (3), накануне (3), день переезда (4, выделен красным), неделя после (3). Отметки сохраняются в браузере; накладная считает «Сделано: N», этап, где отмечено всё, получает штамп «ГОТОВО».
3. «Как подписать коробку»: коробка с надписями на гранях и четыре правила — комната, что внутри, номер, «хрупкое» и стрелки верха.
4. «Сумка первой ночи»: десять пунктов-бирок, от документов и ключей до лампочки про запас.

6. Числа и оговорки

• Нормативных чисел на сайте нет. Размеры кузовов — типичные для «Газелей» 3–6 м; на сайте сказано, что у разных машин и тентов они отличаются, и есть «Свой кузов».
• Размеры вещей — примерные.
• Сроки, которые зависят от производителя или ведомства, не называются: холодильник после перевозки лёжа и транспортировочные болты стиральной машины — по инструкции, регистрация по новому адресу — по Госуслугам.

7. Дизайн

Стиль «картон и скотч»: крафтовый фон с шумом и полосами гофры, бумажные карточки, полоски скотча на заголовках, лёгкие повороты блоков, красная рукописная линия. Красный «хрупкое» — для пометок и дня переезда, зелёный — прогресс и «ГОТОВО». Шрифты: Rubik для всего текста, рукописный Caveat для пометок, счётчика и кнопки-штампа. Два фото: «Газель» у подъезда и «Газель» в разрезе с правильной погрузкой. Логотип, иконки вещей, план кузова, иконки «не доверять кузову», коробки и силуэт города в подвале — SVG. Анимации: прорисовка подчёркивания, падение вещей на план, пульс меток на разрезе, покачивание коробки, появление блоков. При настройке «уменьшить движение» всё отключается.

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

• Статические страницы: HTML, CSS, JavaScript без библиотек; раскладка по кузову и план считаются в браузере, без сервера. План кузова — SVG, генерируется кодом.
• Шрифты и все файлы — на своём сервере, сторонних запросов нет.
• Адаптивность: до 1100 px список вещей в две колонки над планом; до 760 px накладная становится нижней панелью, фото первого экрана сверху, все сетки в одну колонку, в ленте дней остаются только подписанные дни.
• SEO: свой title и description у каждой страницы, canonical, schema.org (WebSite на главной, WebPage на /pereezd/), картинки для соцсетей 1200 × 630, sitemap.xml, robots.txt.
• Доступность: один H1 на странице, у кнопок ± — подписи с названием вещи, вопросы-ответы на нативных раскрывающихся блоках.

9. Приёмка

Проверка	Ожидаемый результат
Главная при загрузке: 18 вещей, «Газель» 3 м	«Не влезает: стол», «Хватит кузова 4 м», пол занят на 85 %
Вкладка «4 м»	«Влезает», 70 %, «Останется немного места для мелких вещей»
Свой кузов 300 × 195 × 180	Шкаф и холодильник на плане лёжа с пометкой про холодильник «лучше стоя»; не влезают кровать, диван и стол
Коробок 30, кузов 6 м	«Влезает», 58 %, «Места с запасом»
/pereezd/: отметить все дела этапа «За неделю», перезагрузить	Штамп «ГОТОВО» у этапа, «Сделано: 3», отметки сохранились
Ширина 1440 и 390 px	Нет горизонтальной прокрутки страницы, ошибок в консоли нет
Сторонние запросы	Нет ни одного