Прейскурант — это невероятно важный аспект для вашего бизнеса. Внешний вид, функциональность, эффективность — все эти параметры влияют на мнение посетителя и, во многом, именно от них зависит, станет ли посетитель вашим клиентом.
Когда мы говорим о качественном прейскуранте, мы не имеем в виду, что туда необходимо втиснуть как можно больше элементов любого размера с описанием и множеством изображений. Речь о том, что все элементы должны гармонично смотреться и соответствовать дизайну сайта.
Смотрите также:
- Go Pricing — плагин WordPress для крутых и адаптивных прайс-таблиц
- Easy Pricing Tables — самый простой способ создания прайс-таблиц на WordPress
- Как добавить список цен в WordPress с помощью бесплатного плагина Pricing Table
- Как добавить таблицу сравнения цен и услуг с адаптивной версткой на WordPress-сайте
- Лучшие плагины WordPress для вставки таблиц и графиков
В нашей сегодняшней статье мы хотим представить несколько примеров, которые должны наглядно показать, как выгодно и эффектно представить свой продукт или сервис, их характеристику и цену.
Читайте дальше, получайте дозу мотивации и вдохновения, и создавайте свой идеальный дизайн ценовой таблицы.
1. Dropbox
Страница планов Dropbox, безусловно, одна из самых простых представленных здесь конструкций. Все очень конкретно, лаконично, для привлечения внимания используются специальные изображения, которые описывают пакеты.
Прейскурант гармонично сочетается с фоном, хорошо смотрится на странице. Разделение предложений для групп или отдельных лиц в виде обычной линии сверху — очень интересное решение в минималистичном стиле.
2. Wufoo
Следующий пример — планы и ценовая таблица Wufoo, которые используют яркий красочный макет.
Интерфейс интуитивно понятен, для перехода от месячных к годовым планам нужно всего лишь нажать на кнопку слайдера.
Кнопки call-to-action расположены вверху и внизу, что служит дополнительным поощрением для посетителей. Вместо того, чтобы упоминать одни и те же функции по несколько раз, Wufoo перечисляет все возможности в самом популярном пакете Bonafide, а в остальных отмечает наличие таковых зеленой "галочкой".
3. Freshdesk
Прейскурант FreshDesk — один из самых свежих и интересных вариантов, который мы видели за последнее время. Дизайнеры очень креативно подошли к оформлению и описанию планов.
Самый популярный план выделяется небольшой GIF-кой с парящим воздушным шаром. Она сразу же привлекает к себе внимание, поскольку является единственным анимированным элементом на странице.
Везде доминирует зеленый цвет, все забрендировано должным образом. Усилия компании направлены на повышение их коэффициента конверсии.
4. Plugmatter
Plugmatter для прейскурантов своих плагинов решили использовать элегантный, классический дизайн. Все таблицы цен используют matrix-макет, где функции находятся слева, а их наличие и детали справа.
Цветовая схема совпадает с темой сайта. Рекомендуемый вариант выглядит чуть контрастнее, с более яркими оттенками белого и красного цветов. Такое решение привлекает внимание посетителей.
Компания представила такой же шаблон в одном из своих плагинов для создания прейскурантов, и стоит отметить, что он пользуется большой популярностью.
5. Pulse
Дизайн прейскуранта Pulse очень простой и лаконичный. Сочетание маленького размера текста и просторного макета создает ощущение воздушности. Большая кнопка для подписки мотивирует посетителей на действие.
Главный пакет находится в центре, выделяется при помощи более контрастных цветов. К нему также прикреплен тег с надписью "Great Value", что дополнительно мотивирует посетителей подписаться на него.
6. MailChimp
Одним из наших самых любимых вариантов является сравнительная таблица цен в Mailchimp. У нее строгий дизайн и она отлично "общается" с посетителями, предоставляя всю необходимую информацию.
Есть специальная функция, в которой тег "Recommended" переходит от одного плана к другому, в зависимости от нужного вам количества подписчиков. Слайдер над таблицей делает этот процесс не только интуитивно понятным, но и полезным для посетителей, чтобы знать, что конкретно им нужно выбрать.
Разработчики не сразу указывают цену, предоставляя только важную информацию о пакетах.
7. ZenDesk
Zendesk выделяется на общем фоне, предлагая бесплатную пробную версию для всех своих пакетов.
Шанс, что ваш посетитель станет клиентом, намного увеличивается, если он сможет увидеть эффективность вашего продукта/услуги в действии.
Имея это в виду, кнопки Try выделены ярким оранжевым цветом. Это умный способ конвертировать посетителей если и не в клиентов сразу, то, по крайней мере, в подписчиков.
Рекомендуемый план не только выделен в самой таблице, но и предлагает полноценный Профессиональный план в пробной версии, на что указывает соответствующий тег.
8. Litmus
Litmus при создании своей таблицы цен экспериментировали с большими цветными блоками. И получилось очень интересно.
CTA размещены над и под таблицей, но они не одинаковые.
Вверху расположена обычная кнопка, а внизу — это предложение сэкономить определенную сумму на каждом плане, приобретая годовую подписку. Это очень мудрый ход, который безотказно работает в большинстве случаев.
9. BeanStalk
У BeanStalk одна из самых простых конструкций для прейскуранта. Здесь очень правильная, четкая структура: планы для различных целевых аудиторий расположены на разных карточках, с разными цветами.
Более дорогие планы для бизнеса и предприятий находятся на карточках с 3D дизайном, в то время как планы для фрилансеров и стартапов расположены на обычной карточке с плоским дизайном.
Имена Bronze, Platinum и т.д. возможно и не раскрывают все возможности и функции соответствующих пакетов, но отчетливо демонстрируют их различия.
10. Readymag
Таблица сравнения цен у Readymag — еще один пример очень простого и лаконичного дизайна. Используются только два основных цвета: белый и темно-синий, которые отлично сочетаются с небесно-голубым фоном.
Нет никаких лишних элементов, все четко и ясно. Обратите внимание, что знак доллара меньше, по сравнению с ценой. Такой трюк немного уменьшает волнения покупателей, и им не так страшно расставаться со своими деньгами.
Годовой вариант четко демонстрирует, сколько покупатель сможет сэкономить благодаря нему. Всплывающие подсказки рядом с некоторыми функциями в плане Super Publisher помогут посетителям понять, что именно они делают и как работают.
11. Crazyegg
При создании своей ценовой таблицы Crazyegg приняли много верных решений. Для выделения рекомендуемого пакета разработчики выбрали цвет, который вызывает доверие — синий. Кнопки CTA решили сделать зеленого цвета — цвет вдохновения.
Обычно, если свойства различаются только по величине, эта переменная выделяется жирным шрифтом. Например, как в таблице цен в BeanStalk — в пакете Bronze "3GB storage capacity".
Crazyegg выделяет эти переменные гораздо более крупным шрифтом, чтобы сделать их более очевидными и понятными для своих посетителей.
12. Heroku
Heroku для своего прейскуранта используют практически монохромный дизайн в фиолетовой гамме. Единственное исключение — голубой акцент для выделения плана Professional.
Цены указаны в самой кнопке CTA, а не где-то над ней, поэтому посетители могут делать свой выбор, основываясь на функциях пакета, а не его стоимости.
Список функций плана максимально сокращен благодаря использованию других пакетов в описании. Так, в плане All Free Features описание начинается с фразы, что сюда включены все возможности плана Free.
13. Freshbooks
Когда смотришь на прейскурант Freshbooks, кажется, что это обычный текст без рамки. Однако все достаточно структурировано и стильно.
Это работает, поскольку большинство планов отличаются только количеством клиентов и ценой.
Рекомендуемый пакет отмечен тегом “Most Popular”. Знак доллара, опять таки, значительно меньше, чем размер цены, что немного уменьшает возможные неприятные ощущения при оплате.
14. Slidedeck
Все пакеты в таблице сравнения цен Slidedeck выглядят одинаково. Рекомендуемый пакет немного темнее, но в остальном планы, по крайней мере, визуально никак не отличаются.
Почему это работает?
Для такого расширения, как Slidedeck, наличие каждой функции может быть обязательным условием для каждого пользователя. Необходим полный набор настроек и возможностей. Поэтому отличие пакетов идет только в количестве.
Простой, спокойный дизайн также играет не последнюю роль. Темно-серый фон для текстовых объектов и "галочек" отлично сочетается с яркими CTA кнопками.
15. YepText
Для обработки дизайна ценовой таблицы YepText вряд ли понадобится целая минута. Все очень просто и, самое главное, доходчиво. Вся важная информация уже там.
Имена пакетов являются описательными, помогая посетителям выбрать наиболее подходящий для них вариант.
16. BigCartel
Эта креативная таблица цен является прейскурантом компании Big Cartel.
Изображения выступают практически фоновым изображением для раздела определенного пакета. Они демонстрируют, кому этот план подойдет лучше всего. Все организовано в порядке возрастания функций и возможностей.
Таблица демонстрирует все основные функции во всплывающем окне.
Источник: wplift.com
Комментарии к записи: 0