Большинство новичков вообще не понимают, как происходит общение с заказчиком и работа по разработке сайта в целом. Я тоже прошла через этот ад невдупления и неуверенности в своих словах и действиях. Поэтому, показываю все изнутри.
Поступил заказ на редизайн главной страницы. Компания занимается электромонтажом, проще — делает так, чтобы в любом помещение светилось.
Технического задания не было. Если не считать «хочу красиво!». Было 2 условия: сохранить цвет компании и логотип, возможны минимальные изменения под сайт.
Задаем вопросы:
- Что не нравится в сайте?
- Зачем нужен редизайн?
- Скидываю примеры сайтов с разной стилистикой, чтобы понять, что ближе к клиенту.
- Определились со стилистикой material design.
- Попутно изучаю старый сайт, вычленяю тезисы и инфу о компании.
- Объясняю, что тексты хуйня и надо переписать. Привожу аргументы в пользу нормальных, полезных текстов. Клиент не охотно соглашается, рассказываю про мой подход с помойками. История про помойки выстреливает, до заказчика наконец-то дошло (либо он притворился, чтобы я поскорее отъебалась), что я хочу как лучше, а не для галочки.
- Прорабатываю структуру главной. По классике добавим офер в первый блок, расскажем, чем компания занимается, отзывы впихнем, клиентов покажем и контакты добавим. Отзывы. У меня бомбит от отзывов на сайтах, они не вызывают доверия и отторгают нормальных клиентов. Пользователь не дурак и понимает, что вся эта слащавая писанина выдумки больного копирайтера. Люди покупают не потому, что «текст», а потому что видят пользу в продукте. Хороший продукт работает лучше, чем хороший продающий текст. В итоге отзывы убрали:)
Старая версия сайта:
Тематика для меня абсолютно не знакомая, открываю сайты конкурентов. Наблюдаю аналогичный пиздец.
Разбираемся с текстом. Я считаю, что дизайн делается на основе текста. Хороший дизайн лишь помогает донести пользователю информацию. Поэтому никаких «Lorem ipsum dolor sit amet, consectetur...». Переписывайте текст сами. Дизайн без хорошего текста не дизайн!
Выделяю весь массив текста с главной страницы. Получает бессвязный поток говна, вытираемся и пытаемся разобраться чем компания занимается и в чем заключается утп.
>Компания промэлектро выполняет любые электромонтажные работ
Любые это какие? Нихуя не понятно, а вдруг мне надо электрику в ракете провести, а они таким не занимаются. Значит пиздеж, врать не нужно, выкатывайте пользу вперед.
Читаем дальше
>Специалисты нашей команды имеют профильное образование, что гарантирует вам быстрое и качественное выполнение всех работ...
На самом деле это хуевые гарантии. Во-первых все ошибаются, во вторых это гарантирует только то, что «специалист» отсидел 4 года в пту на электрика.
>Мы разработаем проект для любого промышленного или коммунального предприятия , и быстро внедрим его в жизнь.
Ого, вот уже проскальзывает польза. Становится ясно с кем компания работает. Оставляем на заметку.
Дальше идут 3 адекватных блока с полезной инфой. Закидываем в миксер, получаем: «Проектируем, прокладываем, налаживаем, поставляем электричество в любое помещение». Почему я выше выебывалась на слово «любое», а сейчас сама запихнула его в утп? Потому что дальше я доказываю, что компания проводит электричество в ЛЮБОЕ помещение.
Наконец-то дизайн. Начинаю думать над первым блоком. Компания налаживает электрику в помещениях, значит с какой болью обращаются пользователи? Правильно, до обращения у них либо не было света, либо он работал хуево. Какой результат работы «Промэлектро»? Свет! Собственно, размещаю включенную лампочку в первый экран. С бекграундом разобрались, дальше идет акцентный цвет. Открываю UI палетку, выбираю красивый синенький, размещаю на кнопках. Заебись, мне нравится. Преображаю в иллюстраторе логотип, убираю стремный градиент, добавляю акцентный цвет. Огонь, едем дальше.
Самое сложно — переписывать тексты на тему в которой ты не разбираешься. Мне повезло, исходные блоки были ничего, убрала воду, сделала простую структуру. Решила добавить ЖИЗНИ с помощью иллюстраций. Все иллюстрации беру с Freepik. Купила за 7 евро PRO аккаунт, радуюсь жизни.
Дальше идут простые блоки с клиентами, нахожу логотипы в формате svg. Почему свг? Свг векторный формат => изображение ресайзится без потери качества. Добавляю «френдли» в контакты, зазываю в гости, это показывает, что компания открыта к сотрудничеству и дружелюбна!
Отправляю заказчику для получения фидбека. Получаю ответ «Все нравится, кроме блока про услуги, ссылки это 2003, хочу что-то другое». Мне ссылочки нравятся, но спорить не стала, есть много вариантов, как обыграть эту ситуацию иначе.
Открываю сайт с кучей классных иконок. Главное правило выбора иконок — иконки должны быть из одного набора. Если на странице используются разношерстные иконки в разной стилистике, то получается ебучая окрошка (вы же не любите окрошку?). Нам окрошка не нужна, поэтому открываем один набор и из него тащим иконки.
Компонуем, отправляем заказчику. Кстати, когда первый раз отправляете макет клиенту, то обязательно описывайте каждый блок! Почему кнопки так, а не иначе, почему лампочка, почему офер, почему собираем только телефон, а не «имяфамилиятелефонпочтаадрескличкакошкидевичьяфамилияматери». Описывайте все очевидное и не очевидное. Во-первых, наглядно покажите, что вы в теме, а не хуй с горы. Во-вторых, заказчику может быть не очевидным ваши решения, он и не обязан в этом разбираться, как и вы в электромонтаже! Перед отправкой проверяйте текст на наличие ошибок, никто не любит безграмотных с претензией на экспертность. Не отправляйте картинки в супер большом размере, прогоните их через компрессор.
Подводим итог: не стесняйтесь задавать вопросы, делайте больше, чем нужно, не тупите и разбирайтесь в теме клиента. Тогда вас будут рекомендовать, к вам вернуться и начнет работать сарафанка, деньги польются рекой, успевай только обналичивать!
До и после. Стало лучше? Чтобы вы исправили? Знаете, как лучше обыграть тематику? Оставляйте комментики здесь или в инсте, можно еще в директ написать :)
Всех чмок в пупок, лайк в инстаграме поставить не забудьте!