SAAS(Software as a Service)는 인기 있는 비즈니스 모델이며 이미지에서 볼 수 있듯이 SAAS 시스템은 웹사이트에서 잠재 고객에게 서비스를 설명하고 시연해야 합니다. 다행히 Divi로 구축된 SAAS 웹사이트가 많이 있습니다. 이 기사에서는 다음 SAAS 프로젝트에 대한 영감을 주기 위해 Divi로 구축된 SAAS 웹사이트의 11가지 예를 살펴봅니다.

이러한 사이트는 레이아웃, 색상, 이미지, 제품 설명, 포함된 비디오, 사례 연구, CTA(클릭 유도문안), 탐색 등에 대한 영감을 줄 수 있습니다. 대부분은 가격표가 있는 브로셔입니다. 대부분은 채팅 및 기타 통신 시스템을 포함합니다. 웹사이트는 특별한 순서가 없습니다.

1. 인보이스 센터

Invoice Central은 태그라인과 CTA가 있는 전체 너비 이미지와 서비스가 소개된 미디어용 로고가 있는 섹션을 표시합니다. 이미지를 클릭하면 포함된 Vimeo 비디오가 열립니다. 상단 메뉴에는 채팅 버튼과 로그인/가입 버튼이 있습니다. 다음 섹션은 겹치는 섹션이 있는 피처를 보여줍니다. 시작하기 섹션은 아이콘을 사용하여 프로세스를 보여줍니다. 스크롤 시세는 클라이언트 로고를 보여줍니다. 평가 슬라이더는 확대/축소 애니메이션과 함께 평가를 표시한 다음 링크가 있는 CTA 및 바닥글을 표시합니다. 이 사이트는 그래픽과 색상을 사용한 좋은 예입니다.

2. 시각적 기획

시각적 계획에는 전체 화면 게시물 슬라이더, 다양한 SAAS 옵션에 대한 링크가 있는 평면 디자인 이미지가 포함된 섹션, 뉴스레터 가입 양식 및 이벤트 일정이 있는 2열 섹션이 포함됩니다. 다음은 SAAS 솔루션, 두 개의 CTA 및 링크가 있는 바닥글을 설명하는 문구가 있는 섹션입니다. 메뉴 시스템에는 색상 브랜딩과 일치하는 클릭 가능한 연락처 정보 및 소셜 링크가 포함되어 있습니다.

3. 트레이닝

Traineaze는 플랫폼 및 CTA에 대한 정보가 포함된 전체 화면 배경 이미지를 사용합니다. 스크롤하면 몇 단어로 이점을 보여주는 아이콘이 있는 섹션이 나타납니다. 다음 섹션에서는 이미지와 텍스트를 번갈아 사용하여 시스템에 대한 세부 정보를 표시합니다. 다음은 가격 및 CTA, 회사 로고가 있는 고객 평가, 수상 및 CTA가 있는 섹션, 연락처 및 정보가 있는 바닥글입니다. 메뉴에는 CTA도 포함됩니다. Zendesk 메시지 상자는 화면에 남아 있습니다. 사이트는 깔끔한 레이아웃을 사용하여 색상과 이미지를 잘 활용합니다.

4. 고도 365

Altitude 365는 서비스에 대한 정보를 제공하면서 왔다 갔다 하는 애니메이션 오버레이가 있는 전체 화면 배경 이미지를 사용합니다. 블로그 게시물에 대한 링크는 다양한 배경색으로 오른쪽에 나타납니다. 메뉴에는 여러 로고, 이메일 링크, 도움말 링크, 표준 메뉴와 햄버거 메뉴가 모두 포함되어 있습니다. 햄버거 메뉴에는 클릭 가능한 연락처 및 소셜 링크가 포함됩니다. 다음 섹션에서는 프로세스의 타임라인, 서비스 목록, 오버레이가 있는 사례 연구 및 추가 정보 링크가 있는 타임라인을 사용하는 정보 섹션을 보여줍니다. 블로그 페이지는 큰 블록에 마지막 세 개의 게시물을 표시하고 네 개의 열에 일반 블로그 목록이 표시됩니다. 사이트는 깔끔한 레이아웃과 색상을 잘 활용하고 있습니다.

5. 포르말리티

Formaliti는 정보와 CTA가 있는 전체 화면 이미지를 한쪽 오버레이에 표시합니다. 작은 섹션에는 CTA 및 포함된 비디오가 포함된 더 자세한 섹션과 이미지 및 정보가 포함된 섹션이 뒤따르는 짧은 설명이 제공됩니다. 혜택은 색상 브랜드 아이콘으로 표시되며 다른 섹션에는 각 비즈니스 부문이 혜택을 받는 플랜이 표시됩니다. 평가 섹션에는 이름이 포함된 이미지와 평가 및 사례 연구를 볼 수 있는 링크가 표시됩니다. CTA는 입자 배경 위에 배치됩니다. 바닥글은 브랜드 색상이 있는 링크를 표시합니다. 이 사이트는 색상과 여백을 잘 활용합니다.

6. 넷실

Netsil은 태그라인과 CTA가 있는 전체 화면 이미지를 사용합니다. 메뉴에는 CTA도 포함됩니다. 다음은 백서에 대한 다운로드 링크가 있는 정보 섹션, 서비스에 대한 안내문이 있는 섹션, 아이콘 및 CTA를 포함하여 작동 방식을 보여주는 섹션입니다. 블로그 섹션에는 추천 기사가 표시됩니다. 사용자 정의 바닥글에는 입자 배경 위에 링크와 가입 양식이 포함됩니다. 채팅 버튼이 화면에 남아 있습니다. 사이트는 브랜드 색상과 애니메이션을 잘 활용합니다.

7. 카시스토

Kasisto는 오버레이에 태그라인과 CTA가 있는 전체 화면 배경 이미지를 사용합니다. 다음 섹션에서는 오버레이에 정보, 로고 및 CTA가 있는 아이콘이 있는 배경을 사용합니다. 다음은 제품을 보여주고 기능을 나열하기 위한 오버레이가 있는 전체 너비 이미지, CTA와 함께 작업하는 제품의 애니메이션을 보여주는 섹션, 미디어의 인용문이 있는 섹션, 배경 위에 회사 설명 및 다음이 포함된 바닥글입니다. 문의 양식. 이 사이트는 색상과 이미지를 잘 활용합니다.

8. 상위 순위

RankAbove는 오버레이에 태그라인과 CTA가 있는 전체 너비 이미지를 사용합니다. 스크롤하면 아이콘과 CTA가 있는 광고 문구, 진정한 시차의 고객 웹 사이트 이미지 위에 오버레이에 링크가 있는 고객 로고가 있는 섹션, 원 카운터와 평면 디자인 그래픽을 사용하는 통계가 있는 섹션이 표시됩니다. 평가는 시차로 회사 이미지 위에 오버레이로 표시됩니다. 서비스에 대한 섹션은 원 이미지와 링크를 사용합니다. 큰 바닥글에는 링크와 문의 양식이 포함됩니다. 연락처 및 로그인 링크는 상단 메뉴에 있습니다. 이 사이트는 오버레이와 시차를 잘 활용합니다.

9. 이지페이

Ezypay는 오버레이에 정보와 CTA가 있는 전체 화면 배경 이미지를 사용합니다. 모달 창에서 YouTube 동영상을 재생하는 동영상 재생 버튼도 포함되어 있습니다. 여러 섹션에는 자세히 알아볼 수 있는 링크와 함께 제품 기능이 표시됩니다. 전체 너비 섹션에는 오버레이에 웨비나 CTA가 있는 배경 이미지가 포함됩니다. 문의는 전폭 문의 양식을 통해 이루어집니다. 바닥글에는 다양한 언어로 된 사이트에 대한 링크가 포함되어 있습니다. 가격 페이지에는 국가 선택기가 포함되어 있습니다. 이 사이트는 브랜드 색상을 잘 사용합니다.

10. 비시타

vcita에는 태그라인과 CTA가 있는 전체 화면 애니메이션 배경이 포함되어 있습니다. 메뉴에 CTA도 포함되어 있습니다. 스크롤하면 대체 레이아웃의 장점에 대한 글머리 기호와 아이콘이 있는 앱의 애니메이션 데모를 보여주는 여러 섹션이 표시됩니다. 다음은 연락처 정보, 사용 후기, 시스템이 통합된 플랫폼 로고, 가격표, 링크가 있는 바닥글이 포함된 전체 CTA입니다. 이 사이트는 애니메이션과 브랜드 색상을 잘 활용합니다.

11. 오픈리모트

OpenRemote는 오버레이에 태그라인 및 YouTube 비디오 링크가 있는 전체 화면 이미지를 표시합니다. 버튼을 클릭하면 동영상이 모달로 재생됩니다. 구분선이 포함된 로고 아래에 전각 메뉴가 포함되어 있습니다. 다음 섹션에서는 아이콘을 사용하여 프로세스의 단계를 보여줍니다. 다음은 서비스에 대한 안내문 섹션, 배경 이미지 위의 전체 너비 평가 슬라이더, 뉴스 피드 및 최신 트윗이 있는 섹션, 클라이언트 및 수상을 위한 슬라이더, 링크 및 검색이 있는 바닥글입니다. 이 사이트는 브랜드 색상을 잘 활용합니다.

마지막 생각들

Divi로 구축된 SAAS 웹사이트의 11가지 예는 자세한 제품 정보 및 이점, 가격표, 사례 연구, 임베디드 비디오, 채팅 시스템 등이 포함된 흥미로운 SAAS 웹사이트를 만드는 데 Divi를 사용하는 좋은 예입니다.

이러한 사이트는 레이아웃, 색상, 이미지, 배경, 비디오, 탐색 등에 대한 아이디어를 제공하는 데 적합합니다. SAAS 웹사이트는 제품 전시의 예로서 탁월하며 제품 사진 및 사례 연구의 예로서도 작동합니다. 이 웹사이트는 다음 SAAS 디자인에 영감을 줄 것입니다.

이 Divi SAAS 사이트에서 가장 좋아하는 요소는 무엇입니까 ? 아래 의견에 알려주십시오!

venimo/Shutterstock.com을 통한 추천 이미지