Метод прогрессивного JPEG: сначала покажи весь сайт, потом вылизывай детали

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

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

Клиенту полезно увидеть весь замысел раньше

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

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

Смотри, в этом варианте ты как будто решил задачу целиком, но на минимальной детализации. Сам сайт ещё не готов, работы впереди полно. Однако заказчик уже может посмотреть и сказать: этот раздел нужен, вот этот лишний, а здесь мы вообще не то рассказываем.

И ты исправишь прямоугольник с подписью, а не будешь переделывать готовый красивый блок. Есть разница? По-моему, огромная.

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

Когда я говорю, что задача на каждом этапе решена целиком, это не значит, что можно нарисовать квадраты и отправить клиенту счёт за законченный сайт.

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

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

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

Как я бы шёл от структуры к дизайну

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

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

После согласования добавляю визуальную часть. Цвета, шрифты, конкретные элементы. Если работаем в Figma, принцип тот же: сначала минимальная версия всей страницы, затем постепенно доводим.

И уже дальше реализация. Неважно, какой инструмент ты используешь. Важно, чтобы подробности не появлялись раньше понимания целого.

Объясни клиенту, что именно ты показываешь

Тут есть нюанс. Ты отправляешь схему, а человек смотрит на неё как на финальный дизайн и говорит: «Что-то у вас всё серое и некрасивое».

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

Не надо обижаться, что клиент не умеет читать твой рабочий черновик. Это ты каждый день с ним живёшь. Для человека он может быть первым в жизни. Покажи, объясни, задай нормальные вопросы.

И договорённости сохрани. Иначе вы сначала согласуете структуру, а через неделю никто не вспомнит, почему решили делать именно так.

Я так же подхожу к текстам и курсам

У меня был опыт подготовки небольшой брошюры. Я не садился с мыслью: первая глава, погнали, а дальше как-нибудь разберусь.

Сначала сделал план. По сути, содержание: крупные главы, внутри подзаголовки. Когда структура появилась, начал обкладывать её мясом — писать текст. Уже видел, что за чем идёт, куда относится мысль и чего не хватает.

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

Если сразу записывать всё, что приходит в голову, можно получить кучу хороших видео, из которых не складывается понятное обучение. А потом переделывать, переставлять, дозаписывать. Зачем, если часть этого видно ещё в плане?

Попробуй на ближайшей задаче

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

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

Мне нравится этот подход тем, что работа всё время остаётся обозримой. Я вижу, что делаю, клиент видит, куда мы идём. И меньше шансов идеально выполнить кусок, который в итоге вообще никому не понадобится.