Designmodo(2021)의 Startup Framework에서 실행되는 사이트의 20가지 모범 사례

게시 됨: 2021-11-04

선택할 수 있는 다양한 웹 사이트 빌더가 있으므로 어떤 것이 귀하에게 적합한지 알기 어려울 수 있습니다. 때때로, 디자인이 당신이 찾고 있는 것과 일치하는지 확인하기 위해 그들과 함께 구축된 기존 사이트의 예를 살펴보는 것이 도움이 됩니다. 이를 염두에 두고 우리는 Designmodo의 Startup Framework에서 실행되는 사이트의 20가지 예 목록을 작성했습니다.

아래의 예는 Designmodo의 Startup Bootstrap 빌더가 무엇을 할 수 있는지에 대한 아이디어를 제공하고 디자인 영감을 제공하는 데 도움이 될 것입니다!

하지만 먼저 Startup Framework가 정확히 무엇인지 자세히 살펴보겠습니다.

스타트업 프레임워크란?

Startup은 Bootstrap 프런트 엔드 프레임워크를 기반으로 구축된 Designmodo의 브라우저 기반 테마 빌더입니다. 그것은 시장에서 가장 강력한 웹사이트 구축 도구 중 하나이며 새로운 스타트업이 웹사이트를 쉽게 만들고 빠르게 시작할 수 있도록 합니다.

Startup Framework를 사용하여 코딩 없이 전문적으로 디자인된 아름다운 웹사이트를 구축할 수 있습니다. 직관적인 드래그 앤 드롭 인터페이스와 300개 이상의 사전 설계된 블록/요소를 사용하여 프런트엔드에서 모든 페이지를 처음부터 완전히 구축할 수 있습니다.

선택할 수 있는 템플릿과 거의 끝없는 사용자 지정 옵션이 있으므로 웹사이트 디자인을 정확한 사양에 맞게 미세 조정할 수 있습니다.

끌어서 놓기 도구는 초보자에게 매우 친숙하고 내보내기가 빠르고 쉬우며 한 번의 클릭으로 전체 스타일을 변경할 수 있습니다. 구성 요소는 일관된 스타일과 Designmodo의 인기 있는 평면 UI를 사용합니다.

최고의 Designmodo 시작 프레임워크 웹 사이트 예

자, 이제 목록으로 이동해 보겠습니다. 다음은 Designmodo에서 Startup Framework로 구축한 사이트의 20가지 예입니다.

1. 지르추얼

Startup Framework로 구축된 웹사이트의 모범 사례 - Zisual

가상 비서 사이트 Zirtual을 살펴보고 시작하겠습니다. 그들은 시작 프레임워크를 사용하여 멀티미디어와 텍스트 사이의 균형이 잘 잡힌 깔끔하고 전문적인 웹사이트를 만들었습니다. 홈페이지는 명확한 섹션으로 구성되어 있습니다.

페이지에 빈 공간이 많고 어수선함을 최소화하여 거기에 있는 요소가 돋보입니다. 녹색 CTA 버튼은 페이지의 나머지 색상과 극명한 대조를 이루므로 놓칠 수 없고 CTR이 향상됩니다.

2. 픽셀섬

designmodo Startup 프레임워크 사이트 예시 - Pixelsum

다음은 Pixelsum입니다. 이것은 웹 디자인 에이전시의 웹 사이트이므로 잘 될 것이라는 것만 알 수 있습니다. 두 가지 Designmodo 제품인 Startup과 Slides를 사용하여 제작되었습니다. 여기 우리가 그것에 대해 가장 좋아하는 것이 있습니다.

첫째, 가독성을 돕고 웹사이트 방문자의 주의를 원하는 곳으로 유도하는 데 도움이 되는 충분한 여백이 있습니다. 페이지를 아래로 스크롤하면 이미지와 텍스트가 페이드 인되어 로드됩니다. 멋지게 보이고 페이지에 상호 작용 요소를 추가하는 것 외에도 페이지 로드 속도에도 도움이 됩니다.

스크롤 없이 볼 수 있는 요소는 사용자가 아래로 스크롤할 때만 로드되기 때문에 초기 페이지 크기를 최소로 유지하면 페이지가 더 빨리 로드되어 SEO가 향상되고 사용자 경험이 향상됩니다.

삽화가 멋지게 디자인되어 브랜드 개성을 전달하는 데 도움이 되며, 전체 사이트는 데스크톱과 모바일 모두에서 멋지게 보입니다.

3. 에두리오

에두리오

다음은 학교 설문조사 플랫폼 Edurio의 Startup Framework에서 실행되는 사이트의 또 다른 좋은 예입니다. Pixelsum과 마찬가지로 페이지의 다양한 요소가 아래로 스크롤함에 따라 페이드 인되어 플랫폼에 대한 자세한 정보가 조금씩 나타납니다. 전폭 블록, 깔끔한 테두리, 녹색과 흰색의 배색으로 깔끔하고 전문적인 느낌을 줍니다.

4. 타임니

타임니

Timeneye는 팀의 생산성을 쉽게 모니터링할 수 있는 시간 추적 소프트웨어 제공업체입니다. 그들의 웹사이트는 Designmodo의 Startup Framework로 구축되었으며 그들의 제품을 훌륭하게 선보였습니다.

그들의 소프트웨어의 초대형 이미지는 홈페이지의 전경에 위치하며 화면을 지배하여 사용자의 주의를 빠르게 사로잡고 제품을 스포트라이트에 둡니다.

5. 레지

레지

Rezi는 AI 기반 ATS 이력서 빌더로 Startup Framework를 사용하여 웹 사이트를 시작했습니다. 그들은 '우리 회사를 위한 놀라운 부가 가치'라고 부르며 성공의 일부를 건축업자에게 돌렸습니다.

홈페이지는 제품의 작동을 보여주는 자동 재생 비디오가 상단에 표시되어 있으며, 우아한 가격표, 평가 및 스크롤 없이 볼 수 있는 그리드 레이아웃으로 구성된 멋진 템플릿 선택이 포함되어 있습니다.

웹 사이트는 완벽하게 반응하고 전환에 최적화되어 있으며 모든 장치에서 멋지게 보입니다. 그리고 가장 좋은 점은 Startup Framework 덕분에 제작자가 코딩 경험 없이도 빌드할 수 있다는 것입니다.

6. 450 GSM

450 GSM

인쇄 회사 450 GSM은 여기에서 Startup Framework를 훌륭하게 사용했습니다. 디자이너는 충분한 여백, 미니멀한 컬러 화면, 다각형 그래픽의 멋진 조합을 사용하여 브랜드에 완벽하게 어울리는 유쾌한 미학을 만들었습니다.

7. 이슈얼

이슈얼

Yisual은 모든 종류의 홍보 자료를 만드는 데 사용할 수 있는 강력한 편집 도구를 제공하는 네덜란드 웹사이트입니다. 홈페이지 상단의 전체 너비 이미지 슬라이더는 방문자에게 Yisual의 모든 이점을 하나씩 소개하기 위해 몇 초마다 다른 프로모션 메시지 사이를 자동으로 순환합니다.

평면 디자인이 멋지게 보이고 구조가 명확하고 가독성이 높으며 탐색이 원활합니다. 애니메이션 로고 위에 마우스를 가져갈 때 움직이는 방식도 멋진 터치입니다.

8. 디지털 팩터

DigitaleFactuur

다음은 Startup Framework를 사용하여 멋진 웹사이트를 만든 또 다른 네덜란드 회사입니다. 그들은 혁신적인 인보이스 발행 도구를 제공하며 방문 페이지에서 판매하는 일을 훌륭하게 해냈습니다.

홈페이지 상단은 가치 제안을 보여주는 제목과 방문자의 이메일 주소를 가져와 메일링 리스트에 올리도록 설계된 CTA/양식 필드로 가득 차 있습니다.

아래로 스크롤하면 가장 먼저 고객이 보고 싶어하는 모든 기능을 강조하는 주석이 달린 Digitale Factuur 송장의 거대한 이미지가 표시됩니다. 다음으로, 가장 중요한 기능이 모두 표시된 스마트폰 앱의 또 다른 거대한 주석 이미지입니다.

이러한 종류의 시각적 이미지는 방문자가 텍스트의 벽을 통해 읽을 필요 없이 회사와 제품에 대해 더 많은 것을 쉽게 찾을 수 있도록 합니다. 대신, 그들은 아름답게 배치된 이미지를 보고 알아야 할 모든 것을 찾을 수 있습니다.

9. 유니버설 미디어

유니버설 미디어

Universal Media의 이 웹사이트 디자인은 매우 흥미롭습니다. 그들은 페이지를 여러 섹션으로 분리하는 혁신적인 페이지 레이아웃을 사용했습니다. 방문자는 부드럽게 아래로 스크롤하는 대신 페이지를 한 블록씩 이동합니다. 스크롤을 시도하면 자동으로 사용자를 다음 섹션으로 크게 한 단계 아래로 이동합니다.

시차 스크롤 배경 이미지와 멋진 전체 너비 디자인은 이 목록에서 가장 창의적으로 보이는 페이지 중 하나입니다.

10. 기프트오프

기프트오프

USP: 매우 생생한 사이트입니다. 페이지를 아래로 스크롤하면 애니메이션이 눈 앞에 펼쳐집니다. 예 카운터

GiftOff의 Startup 기반 웹사이트는 재미있고 상호작용적이며 창의적입니다. 애니메이션 고객 카운터와 같은 미묘한 그라디언트와 멋진 애니메이션 요소를 사용하여 보다 역동적이고 상호 작용적인 느낌을 줍니다. 빈 공간이 많아 어수선한 느낌이 없고 전체적인 구조가 훌륭합니다. 완벽하게 반응하며 모바일 및 태블릿 장치에서 데스크톱에서와 마찬가지로 멋지게 보입니다.

11. 비테

비테

Vyte는 Startup Framework로 구축된 랜딩 페이지의 훌륭한 예입니다. 그들은 사이트를 사용하여 스마트한 올인원 일정 앱을 선보이고 판매합니다.

웹 사이트는 흰색 배경과 간단한 일러스트레이션과 함께 주요 기능을 강조하기 위한 소량의 텍스트로 단순하고 깨끗합니다. 메시지를 간결하게 전달하고 요점을 직설적으로 전달합니다.

12. 포티AU

40AU

Startup Framework를 통해 FortyAU의 디자인 팀은 이 멋진 웹사이트를 구축하여 브랜드를 마케팅할 수 있었습니다. 페이지 상단의 동적 헤더 텍스트는 FortyAU 개발자 팀이 구축할 수 있는 모든 것을 고객에게 알려주기 위해 다양한 단어를 순환합니다.

그들은 주로 흑백 색상 팔레트를 사용하고 CTA 버튼 및 주요 기능과 같은 가장 중요한 요소에 브랜드의 노란색 음영을 튀겨 웹 사이트 사용자의 시선을 끌고 원하는 곳으로 주의를 집중시킵니다.

13. 푸드라이너

푸드라이너

Foodliner는 벨로루시에서 운영되는 중요한 식품 공급업체입니다. 그들의 웹 사이트는 Startup Framework로 구축되었으며 군침이 도는 식품의 큰 이미지가 슬라이드 회전식으로 표시되어 있습니다. 보기만해도 배고파요!

웹사이트 디자이너는 사진과 간단한 캔버스를 멋지게 조합하여 멋진 웹사이트를 만들었습니다. 어수선하거나 지저분한 느낌이 없고 여백을 넉넉하게 사용하여 가독성이 좋습니다.

14. 자코모 골리넬리

문화 인류학자이자 웹 디자이너인 Giacomo Golinelli의 또 다른 훌륭한 웹사이트가 있습니다. 그의 개인 웹사이트는 깔끔한 색상 조합과 깔끔한 ​​직선 레이아웃으로 멋지게 보입니다.

다른 웹사이트 스트립 위로 마우스를 가져가면 배경이 사라지고 텍스트 색상이 흰색에서 검은색으로 바뀝니다. 이것은 매우 반응적이고 상호 작용하는 느낌을 주며 가독성에도 도움이 됩니다.

15. 옥토리

옥토리

인플루언서 마케팅 플랫폼인 Octoly의 이 웹사이트는 방문자가 행동을 취하도록 설득하는 것이 원래 해야 할 일을 정확히 수행합니다. 홈페이지는 멋지게 보이는 멋지고 창의적인 기능으로 가득 차 있습니다.

상단에서 사용자는 "나는 영향력 있는 사람입니다" 또는 "나는 브랜드입니다"라는 두 가지 버튼 중에서 선택할 수 있습니다. 이렇게 하면 고객을 즉시 두 가지 유형의 고객으로 분류하고 필요한 정보가 있는 홈페이지로 바로 안내합니다.

접힌 부분 바로 아래의 그리드는 방문자의 관심을 Octoly가 도움을 준 브랜드/인플루언서 콜라보레이션 수와 같은 몇 가지 중요한 수치로 유도하기 위해 애니메이션 카운터를 사용하여 사회적 증거 역할을 합니다. 기능 및 이점, 사례 연구, 사용 후기 등 잠재 고객이 보고 싶어하는 모든 것이 있습니다.

16. 허브스태프

허브스태프

다음은 Hubstaff의 Designmodo Startup Framework 사이트의 또 다른 훌륭한 예입니다. 대부분의 홈페이지에 2열 구조를 사용합니다. 한 면은 텍스트용이고 다른 면은 이미지/비디오 요소용입니다.

페이지 상단에서 비디오 플레이어가 자동 재생되어 작동 중인 시간 추적 소프트웨어의 장면을 사용자에게 제공합니다. 그 옆에 있는 재생 버튼은 사용자가 클릭하여 자세히 알아보도록 합니다. 클릭하면 전체 화면 팝업에 동영상 플레이어가 나타나 전체 동영상을 재생합니다.

밝은 파란색과 흰색 음영을 아낌없이 사용하여 깔끔하고 전문적인 색상 팔레트와 매우 역동적인 느낌을 주는 애니메이션 페이지 요소가 많이 있습니다.

17. SHN

SHN

SHN 웹사이트는 주요 기능을 스포트라이트에 두는 단순하고 단순한 레이아웃을 사용합니다. 디자인은 명확하고 깨끗하며 눈길을 끌며 콘텐츠에 중점을 둡니다.

18. 아파트

아파트

Apartable은 Startup Framework로 사이트를 구축한 부동산 중개업체입니다. 예상대로 페이지는 곧바로 추적을 시작하고 고객이 해당 지역의 아파트를 찾기 위해 도시나 우편번호를 입력하도록 초대하는 검색 표시줄이 지배합니다. 페이지에는 스크롤 없이 볼 수 있는 부분의 주요 이점을 강조하는 3개의 열 외에는 거의 없습니다.

19. 예지에르스키

폴란드 창 제조업체 Jezierski는 이 멋진 웹사이트에서 자신의 창을 아름답게 선보입니다. 페이지 상단의 이미지 캐러셀은 주요 이점을 강조하는 텍스트와 함께 오버레이된 실제 창의 예를 보여줍니다.

20. 부스러기

부스러기

마지막으로, Startup from Crumbs로 구축한 웹사이트의 마지막 예가 있습니다. 심플하다, 깔끔하다, 우아하다. 그리고 가장 중요한 것은 군침이 도는 음식 이미지로 가득합니다. 무슨 말이 더 있겠습니까?

마지막 생각들

Designmodo의 Startup Framework에서 실행되는 사이트의 20가지 예가 있습니다. 이 예제에서 창의적인 영감을 얻고 자신의 웹사이트에 대한 아이디어를 모을 수 있기를 바랍니다.

여기 있는 동안 다른 웹 사이트 빌더로 구축된 사이트의 더 많은 예를 보려면 다른 게시물을 확인하십시오.

여기에서 Webflow로 구축된 사이트 목록 또는 여기에서 Weebly로 시작하는 것이 좋습니다.

즐기다!