Дизайн сайта глазами менеджера

Когда заказчик говорит, что ему нужен сайт.

Порядок действий:

Бриф и сбор материалов
Создание прототипа без дизайна
Вычитка прототипа, проверка на адекватность и эффективность
Демонстрация прототипа заказчику, чтобы сразу посмотрел на тексты
Дизайн Mobile First
Проверка дизайна внутри коллектива
Демонстрация заказчику
Дизайн для десктопа
Проверка дизайна по чек-листу
Верстка

Бриф

Что нужно выяснить, если это полностью новый заказчик:

Суть его бизнеса. Чем он занимается, что продает, какие цели преследует, какие потребности покрывает.
Цель сайта. Что он должен доносить - это реклама, магазин, личный бренд, продающая страница, информационная страница, просто брендовая красивая история "чтоб была". Заказчик может называть одно, а иметь в виду другое, поэтому задаем кучу вопросов, пока не обретем понимание. Оно точно должно появиться в голове менеджера.
Аудитория сайта. Кто будет заходить на эту страницу - клиенты и покупатели или партнеры-компании, сотрудники. Для кого он создан. Например, если это недвига, то это может быть человек, который сам хочет купить виллу и жить, а может инвестор, скупающий виллы пачками и ему пох, какая там атмосфера. Если это сайт заколок "Пенни блоссом", то это может быть конечный покупатель в лице девочки, которая покупает себе украшение, а может быть оптовый заказчик.
Конкуренты и похожие сайты. Часто бывает, что заказчик приходит уже с примерами, но даже если нет - не помешает задать вопрос. Люди поделятся сайтами в своей нише, и мы сможем увидеть, чего от нас ждут. У нас такое было с абсолютно новыми клиентами.
Предпочтения и правила в дизайне. Тут главный вопрос - есть ли готовый стиль, брендбук, айдентика, другие уже задизайненные материалы. Насколько это все актуально, хотят ли продолжать стиль или ждут нового, ждут расширения. Если придумать это должны будем мы, спросить о предпочтениях - насколько строго, весело, ярко или лаконично. Обязательно спросить, что нравится визуально - могут быть референсы.
Материалы. Брендбук и логотип (если есть), фотографии и видео, которые мы можем использовать на сайте. Если есть предпочтения - узнать, а то могут прислать, а потом говорить, что вот это и это не надо было юзать
Контент. Наполовину внутряковая часть - решаем, кто пишет контент, часто это заказчик, который требует упаковки. Тогда трясем, комментируем, трясем, пока не решим окончательно. Это все должно быть обработано согласовано с окончанием этапа прототипа.
Возможности. Хотят ли несколько языков; возможность расширения сайта; самостоятельное ведение блога; подключение аналитики; и тд.

Если заказчик давний - спрашиваем все то же самое, кроме сути бизнеса.
Для самообразования и попытки провести грамотный бриф и написать по нему хорошее тз можно дополнительно пользоваться этой статьей. В ней есть примеры вопросов и много полезного.

Если это Eventation, что нужно получить:

Где создаем сайт (как страницу на каком-то брендовом или как отдельный) и его страницы, если они есть. Отдельно спросить, если концерты тура артиста пересекаются со странами, где есть местные сайты Эвентейшн - Греция, Кипр, Турция, Израиль, Казахстан. Прям спросить "На местном сайте -Страна Такая-то- нужно отображать этот концерт?", потому что они вечно забывают, что у них есть сайты по странам
Афиша в слоях
Даты, города и площадки концертов
Пресс-релиз (описание). Могут не дать, скажут делать без него. Узнать, появится ли, чтобы учитывать в дизайне наличие или отсутствие блока
Ссылки на билеты. Обычно дают в самом конце, но узнать, когда будут - на всякий
Если нужна галерея фото, то фото
Если нужно видео, то ссылки на видео - ВК, если это канцики в РФ и русские будут пользоваться сайтом, YouTube если нерусские (либо мы подбираем сами из новых и популярных у артиста - ВК)
Если нужна инфа о площадках - пусть присылают фото и тексты, если есть. В идеале для тз собрать для всех них еще и ссылки на гугл-карты, иначе дизайнер будет их искать и может накосячить
Дата анонса - когда готовимся публиковать

Работа с прототипом

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

Задача этапа - согласовать весь контент, чтобы можно было спокойно дизайнить. Можно тут же даже и фотки навтыкать необрезанные, чтобы сразу решить вопросы с "мне не нравится, какие у меня тут волосы" или "с этого ракурса бассейн не показываем".

Если текст писал заслуживающий доверия райтер-прототипатор - то кайфуем. Если Филипп, потом Аня Дорошенко, потом Настя, потом мы причесывали вместе, потом увидели косяк, потом Филипп передумал - то потеем.

Работа с Mobile First

Тут все просто. В 2024 веке люди смотрят со смартфонов намного больше, чем с десктопа, поэтому дизайнить начинаем с мобильной версии. Заказчика нужно в этом убедить. Это не значит, что десктоп будет страшный, он будет не хуже, просто так удобнее.

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

Важно. Готовый дизайн показываем заказчику так, чтобы он мог его открыть с телефона. Либо на мокапе смартфона. Смысл - если он с ноута откроет мобильный дизайн, может залупиться, что ему узко.

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

Работа с дизайном десктопа

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

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

Проверка по чек-листу

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

Сгруппировать нужное в фигме, подписать комментарии для верстальщика, удалить ненужные и скрытые слои и тд.

Это уменьшит вопросы в процессе и косяки на выходе.

Верстка

Если это Тильда, то либо отдаем нашим, либо аутсорсерам. При правильной подготовке дизайна это будет чистый кайф.

Если это сторонние разрабы и не тильда, то, вероятно, этим будет заниматься Рустам. Этот вопрос нужно обсудить