KubrickHabr
@KubrickHabr
вордпресс тим

Что добавить или убрать на продающем сайте, советы по сайту и какие основные ошибки?

Хочу поделиться с вами нашим новым проектом 4dekor.com.ua. Цели у посадочной страницы это
1. Перейти в конструктор заказа печати, далее на страницу оформления.
2. Заполнить заявку для перезвона.
И собственно хотелось бы услышать ваши отзывы по структуре, дизайну и содержанию сайта. Ваши боли и страхи за заказ печати какие можно убрать с помощью сайта.
И какие есть ошибки которые нужно исправить? Спасибо за то что уделите время :)
  • Вопрос задан
  • 344 просмотра
Решения вопроса 1
indrigor
@indrigor
web designer
Первое впечатление - что в дизайне сайта задействованы методы из дизайна полиграфии (разнообразия шрифтов, цветов и прочее), что пагубно отражается на юзабилити, слишком сложный для восприятия. Дизайн сайта значительно отличается от дизайна полиграфии. Пользователь должен как можно больше находится на этом сайте, ничто не должно его отвлекать. Если все будет разного размера, в разных шрифтах, в разных цветах - пользователь просто уйдет из сайта, ему будет не интересно. Другими словами сайт не будет работать.

По Главной:
1. Шапка сайта: Социконки нужно переместить в другое место, не нужно лепить их к логотипу, логотип должен выделяться, а социконки над ним только отвлекают внимание от него (логотипа).
- Телефон нужно выделить, он не заметен (или сделать крупнее или выделить к примеру белым цветом )
- Меню. Эффекты при наведении немного непривычны :), но корзину нужно сделать крупнее и возможно как-то выделить, она теряется

2. Слайдер: Не понятно что иконка со стрелкой это просмотр Видео. ВОзможно стоило выделить ему отдельное место на слайдере или сделать типо такого www.soft.se
С типографикой на баннере слайдера нужно поработать. Здесь методы, которые применяются в дизайне печатных продукции работать не будут. Желательно для сайта использовать два (максимум три) шрифта.
"Или" не нужно делать косым, выглядит чужеродно.
Ссылка "заполнить форму" нужно показать, как она будет выглядеть при наведении, чтобы пользователь визуально понял, что он навел на эту ссылку.

3. Три блока под слайдером. Нужно сделать эффекты при наведении (рамка появляется, картинка затемняется или наоборот - становится светлой, тут на свое усмотрение:)). Главное чтобы пользователь понял на что он наводит. Возможно типографику на этих блоках нужно сделать цельной, подписи под этим блоками стоит убрать, их все равно никто читать не будут и так понятно, о чем они (блоки).

4. Заголовки. Первое впечатление, которое возникнет у пользователя - что это большие кнопки. Если выделять заголовки, то точно не так. Слишком много они отвлекают на себя внимания, а это плохо ).

5. "Почему выбирают именно нас". Яркий желтый блок заголовка отвлекает внимание от описания этого блока.
Заголовки "Мы любим...", "Обработка..." и "Материалы..." лучше не центрировать, теряется целостность.

6. "Узнать о нас". Не понятно, что это ссылка.
Блоки "Доступные цены" и "Премиум качество" нужно выравнить, такое ощущение, что слетела верстка )).
Описание этих блоков не делать заглавными буквами, плохо читается и теряются на фоне Заголовков и кнопок, где шрифт сделан заглавными.

7. Примеры работ. Нужны эффекты при наведении на работы. Поискать эффекты можно здесь tympanus.net/codrops/category/playground или просто хоть как-то дать понять пользователю, на что он наводит )

8. Как заказать печать. Сделать такой же размер, как остальные заголовки. Вначале принял за кнопку ))
Блок в целом выглядит инородным. Другие иконки, другие цвета.
В плане иконок лучше сделать их цветными, а цифры монотонными, уменьшить или вообще их убрать (они отвлекают на себе ненужное внимание). Возможно иконки немного уменьшить. Заголовки иконок отцентрировать, чтобы было гармонично. Возможно, иконки выделить каким-нибудь одним ярким цветом, но это мое личное мнение )

9. Блок "Ты нам нравишься" лучше не стоит делать таким высоким и не делать социконки вразброс (делать на одном уровне, визуально так удобнее кликать).

10. Заполнить форму. Принял это за кнопку )). Зеленая кнопка выпадает из стиля. Для всех кнопок я бы сделал высоту побольше, они должно выделяться.

11. Рассылка. Поле выбивается из стиля. В дизайне элементы с острыми углами, а тут с закругленными. Возможно стоит тогда делать и кнопки с закругленными углами, тогда возможно поле для ввода впишется в общий стиль дизайна.

Сделал описание только Главной страницы, так как в основном она задает общий стиль сайта.
Еще один момент который сразу бросается в глаза - бредкрамс (хлебные крошки) абсолютно незаметны, это есть нехорошо. Не думаю что кидать их вправо это хороший вариант. Нужно размещать там, где их легко можно будет заметить.
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
я б не купил.
мое субъективное мнение, если учесть, что это все-таки лендинг (но тут не одна страница):
- такой слайдер на лендинге себя не оправдает.
- заголовка нет при открытии страницы, он появляется позже = плохо (сначала вообще все белое, вместо слайдера)
- prntscr.com/b5tbre - лишнее что-то, либо надо иначе делать.
- нет цены !!
хватит для начала :)
Ответ написан
Denormalization
@Denormalization
Взгляд потенциального покупателя:
1) Нет нормальных цен. Вместо того чтобы быстро прикинуть по ценам, мне нужно идти в констурктор и 20 мин разбираться как он работает.
2) Конструктор имхо слишком сложный. Не для среднего пользователя.
3) На главной на слайдере есть купон, но его нельзя скопировать. Предлагаете мне его запоминать? Да, мне сложно запомнить 6 знаков.
4) "ЗАПОЛНИТЕ ФОРМУ И МЫ ВАМ ПЕРЕЗВОНИМ" - что это? Почему я 5 мин пытался что-то написать в это поле?
Кнопка "Заказать в 1 клик" выглядит как кнопка сабмита, и я тупо боялся ее нажать.
И что конкретно вы предлагаете заказать если я нажму на кнопку? Сделать заказ или просто заказать обратный звонок? Сложнааа...
5) Очень "страшная" форма для "Заказать в 1 клик". Почему на кнопке написанно "Заказать в 1 клик", а мне предлагают заполнить 100500 каких-то полей? Я боюсь...
6) Диптих, триптих - это на украинском? Я просто не в курсе что это за слова... Почему мне нужно лезть в гугл чтобы сделать заказ?
7) (на форме "Заказать в 1 клик") - "К оплате" 700. Чего 700?
8) Соц.кнопки ужасны. Скачут как ненормальные...
9) Куча мелких "несоотвествий". В одном месте обращение на Вы, в другом на Ты. Вы уже определитесь как вы к клиенту обращаетесь.
10) Плашки с купонами неаккуратны. Код купона выглядит как кнопка.
11) (чисто придирка) "Без риска. 100% гарантия." - Я бы убрал "Без риска". Я как только увидел эту надпись, сразу отпало желание что-то заказывать, так как тараканы забегали. Что значит "Без риска"? Какой риск может быть? Почему вы про это упомянули? Ааааа...
Ответ написан
Nekto_Habr
@Nekto_Habr
Чат дизайнеров: https://t.me/figma_life
Беглый взгляд: шрифты надо сокращать, я их штук 5 насчитал за 4-5 секунд просмотра страницы. Это сильно влияет на качество дизайна.
Ответ написан
Комментировать
MIkola35
@MIkola35
Team Lead UX/UI Designer
Что-то я тут писал много и ответ потерся. Странно.

Коротко: Лэндинг переполнен информацией. Нужно делать проще. Учитесь у них -
https://launchkit.io/
https://launchkit.io/sales/
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы