SAAS (Программное обеспечение как услуга) - популярная бизнес-модель, и, как вы могли представить, системам SAAS нужны веб-сайты, чтобы объяснять и демонстрировать свои услуги потенциальным клиентам. К счастью, существует множество веб-сайтов SAAS, созданных с помощью Divi. В этой статье мы рассмотрим 11 примеров веб-сайтов SAAS, созданных с помощью Divi, чтобы вдохновить вас на следующий проект SAAS.

Эти сайты могут помочь с вдохновением для макетов, цветов, изображений, описаний продуктов, встроенного видео, тематических исследований, CTA (призывов к действию), навигации и многого другого. Большинство из них - это брошюры с таблицами цен. Многие включают чат и другие системы связи. Веб-сайты расположены в произвольном порядке.

1. Центр выставления счетов

Invoice Central отображает полноразмерное изображение со слоганом и призывом к действию, а также раздел с логотипами для СМИ, в которых была представлена ​​эта услуга. При нажатии на изображение открывается встроенное видео Vimeo. В верхнем меню есть кнопка чата и кнопки входа / регистрации. В следующем разделе показаны элементы с перекрывающимися разделами. В разделе «Приступая к работе» процесс показан с помощью значков. Ползунок с прокруткой показывает логотипы клиентов. Ползунок отзывов отображает отзывы с анимацией масштабирования, за которыми следует призыв к действию и нижний колонтитул со ссылками. Сайт - отличный пример использования графики и цвета.

2. Визуальное планирование

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

3. Стажировка

Traineaze использует полноэкранное фоновое изображение с информацией о платформе и призывом к действию. При прокрутке отображается раздел со значками, который всего несколькими словами показывает преимущества. В следующем разделе используются чередующиеся изображения и текст, чтобы показать подробную информацию о системе. Далее следует раздел с ценами и призывом к действию, отзывы клиентов с логотипами компании, раздел с наградами и призывом к действию, а также нижний колонтитул с контактами и информацией. В меню также есть призыв к действию. Окно сообщения Zendesk остается на экране. Сайт отлично использует цвета и изображения, используя чистый макет.

4. Высота 365

Altitude 365 использует полноэкранное фоновое изображение с анимированными наложениями, которые появляются и исчезают при предоставлении информации об услуге. Ссылки на сообщения блога отображаются справа с разноцветным фоном. Меню включает в себя несколько логотипов, ссылку на электронную почту, ссылку справки, а также стандартное меню и гамбургер-меню. Гамбургер-меню включает интерактивные контакты и социальные ссылки. В следующих разделах показаны временная шкала процесса, список услуг, тематические исследования с наложениями и раздел «О нас» с использованием временной шкалы со ссылкой на дополнительную информацию. На странице блога последние три сообщения отображаются большими блоками, за которыми следует обычный список блогов в четырех столбцах. Сайт имеет чистый макет и отлично использует цвета.

5. Formaliti

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

6. Нетсил

Netsil использует полноэкранное изображение со слоганом и призывом к действию. В меню также есть призыв к действию. Далее следует раздел «О нас» со ссылкой для загрузки на технический документ, раздел с пояснениями об услугах и раздел, показывающий, как это работает, включая значки и CTA. В разделе блога отображаются избранные статьи. Пользовательский нижний колонтитул включает ссылки и форму регистрации на фоне частиц. Кнопка чата остается на экране. На сайтах широко используются фирменные цвета и анимация.

7. Касисто

Kasisto использует полноэкранное фоновое изображение со слоганом и призывом к действию в оверлее. В следующем разделе используется фон со значками с информацией, логотипом и призывом к действию в оверлее. Далее следует полноразмерное изображение с наложением для демонстрации продукта и списка функций, раздел, показывающий анимацию продукта, работающего с CTA, раздел с цитатами из СМИ, заявление компании на фоне и нижний колонтитул с Форма обратной связи. На сайте отлично используются цвета и изображения.

8. RankAbove

RankAbove использует полноразмерное изображение со слоганом и призывом к действию в оверлее. При прокрутке отображаются размытые изображения со значками и призывом к действию, раздел с логотипами клиентов со ссылкой в ​​наложении поверх изображения веб-сайтов клиентов с истинным параллаксом, а также раздел со статистикой с использованием счетчиков в кружках и графики с плоским дизайном. Отзыв отображается поверх изображения компании в параллаксе. В разделе об услугах используются обведенные изображения и ссылка. Большой нижний колонтитул включает ссылки и контактную форму. Ссылки для контактов и входа размещены в верхнем меню. На сайте хорошо используются оверлеи и параллакс.

9. Ezypay

Ezypay использует полноэкранное фоновое изображение с информацией и призывом к действию в оверлее. Он даже включает кнопку воспроизведения видео, которая воспроизводит видео YouTube в модальном окне. В нескольких разделах представлены функции продукта со ссылками для получения дополнительной информации. Полноразмерный раздел включает фоновое изображение с призывом к действию веб-семинара в оверлее. Запросы отправляются через полную контактную форму. Нижний колонтитул содержит ссылки на сайт на разных языках. На странице цен есть переключатель страны. На сайте удачно используется фирменный цвет.

10. vcita

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

11. OpenRemote

OpenRemote отображает полноэкранное изображение со слоганом и ссылкой на видео YouTube в оверлее. Видео воспроизводится в модальном режиме при нажатии кнопки. Он включает полноразмерное меню под логотипом с разделительной линией. В следующем разделе показаны этапы процесса с помощью значков. Далее следует раздел с пояснениями об услугах, полноразмерный слайдер с отзывами над фоновым изображением, раздел с новостными лентами и последними твитами, слайдеры для клиентов и наград, а также нижний колонтитул со ссылками и поиском. На сайте широко используется фирменный цвет.

Последние мысли

Эти 11 примеров веб-сайтов SAAS, созданных с помощью Divi, являются отличными примерами того, что Divi используется для создания интересных веб-сайтов SAAS с подробной информацией о продуктах и ​​преимуществах, таблицами цен, тематическими исследованиями, встроенным видео, системами чата и т. Д.

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

Какие элементы этих сайтов Divi SAAS вам нравятся больше всего ? Дайте нам знать в комментариях ниже!

Лучшее изображение через venimo / shutterstock.com