월간 템플릿 키트 #2: 아름다운 피트니스 웹사이트 구축

게시 됨: 2019-09-03

지난 달, 우리는 Elementor 템플릿 키트의 월간 시리즈의 첫 번째 버전을 출시했습니다. 우리 커뮤니티의 반응은 놀라웠습니다. 많은 사용자가 릴리스에 대해 크게 향상되었고 더 많은 것을 원했습니다.

Introducing-Elementor

이번 달에 우리는 몸매를 가꾸고 전문 체육관 전용 전체 웹사이트 키트를 출시하기로 결정했습니다. 단백질 쉐이크를 잡고 이두근을 구부리고 철분을 펌프질하십시오! 이 키트는 당신을 버프받을 것입니다.

이 키트는 모든 Elementor Pro 사용자에게 100% 무료이며 다음이 포함됩니다.

  • 7 콘텐츠 페이지
  • 머리글 및 바닥글 템플릿
  • 팝업 템플릿
  • 404 템플릿
  • 단일 및 아카이브 템플릿
  • ~ 60 CC0 이미지를 무료로 사용할 수 있습니다.
  • 9 오리지널 아이콘
  • 2개의 잘 설계된 문의 양식
  • 다양한 애니메이션 및 모션 효과

이 키트를 사용하는 이유

Why-Use-This-Kit

이전 키트와 마찬가지로 이 템플릿 키트를 완성하는 과정에서 어떤 모서리도 자르지 않았습니다. 단순히 눈으로 보는 것 이상을 위해 제작되었습니다. 다음은 템플릿의 바다에서 Elementor의 키트를 돋보이게 하는 이점입니다.

  • 전문적인 디자인 – 모든 페이지, 섹션 및 위젯은 모범 사례를 염두에 두고 사용 및 편집되었습니다.
  • 다양한 요소 – 키트에는 다양한 Elementor 기능이 포함되어 있습니다. 여기에는 팝업, 혼합 모드, 시차 스크롤, 내비게이터 등이 포함됩니다.
  • 이미지 최적화 – 모든 이미지 크기가 최적화되었습니다.
  • 명명된 섹션 – 네비게이터에서 각 레이어의 이름을 지정하므로 페이지의 모든 요소를 ​​쉽게 찾아 선택할 수 있으며 어떤 역할을 하는지 알 수 있습니다.
  • 100% 모바일 응답성 – 모든 자산은 모바일 응답성을 염두에 두고 제작되었습니다.

체육관 템플릿 키트: 대담하고 활기찬 디자인

월간 템플릿 키트를 통해 사용자에게 광범위한 디자인을 제공하고자 합니다. 그래서 기존 디지털 에이전시 키트와 상당히 다른 체육관 템플릿 키트를 출시하기로 결정했습니다.

이전 키트는 미니멀하고 단순했지만 이번 키트는 대담하고 생생한 색상과 눈에 띄는 요소가 포함되어 있습니다. 우리는 운동과 스포츠에 대해 이야기하고 있기 때문에 템플릿의 많은 요소에 움직임을 통합했습니다. 또한 스포츠와 레크리에이션이 시각적 범주에 속하기 때문에 많은 이미지를 포함했습니다.

밝은 파란색과 노란색 네온 컬러가 대담한 디자인에 기여합니다. 또한 운동 선수가 전 세계 체육관에서 자주 착용하는 색상과 일치합니다.
타이포그래피도 우리 디자인에 적합하며 'Racing Sans One'이 특징입니다.
과감하고 생생한 키트 디자인으로 인해 다른 분야에 맞춤화하기 어려울 수 있습니다. 그러나 코칭, 요가 및 기타 활동 관련 영역과 같은 주제에 매우 적합할 수 있습니다.

자산을 살펴보고 어떤 내용이 포함되어 있는지 살펴보겠습니다.

체육관 홈페이지 템플릿: 멋진 시차 효과

Home-page

홈페이지에서 처음 보는 영웅 섹션을 좋아해야 합니다. 셔츠를 벗고 버프 운동을 하는 매니아의 이미지도 무시할 수 없어 방문자의 시선을 단숨에 사로잡는다. 메시지는 '당신이 될 수 있는 최선을 다하라'와 같은 동기를 부여하는 힘이 있는 문장으로 같은 아이디어에 맞습니다.

스크롤하면 이미지가 운동기의 실제 움직임을 시뮬레이션하는 방식으로 움직입니다.

움직임 테마를 계속하는 미묘한 애니메이션의 사용과 같이 페이지의 나머지 부분에 걸쳐 많은 주목할만한 요소가 있습니다. 카드와 같은 이미지가 다른 페이지 앞에 배치되고 페이지의 다른 영역을 나누는 구분선이 있습니다.

소개 및 트레이너 페이지: 체육관 승무원에 대한 스포트라이트

gym-about-trainer

체육관의 정보 페이지에서 훨씬 더 많은 정보를 얻을 수 있습니다. 이 페이지는 위젯과 배경 전체에 퍼져 있는 몇 가지 단어와 많은 이미지를 사용하여 체육관에 대한 이야기를 전합니다.

모든 적절한 체육관은 가장 소중한 자산인 트레이너를 강조해야 합니다. 이 템플릿에서는 TRX 트레이너인 Maria Morales를 강조했습니다. 페이지는 진행률 표시줄을 사용하여 Maria의 기술을 설명하고 하단에 다른 클릭 유도문안을 포함합니다.

수업 및 피트니스 페이지: 정보를 표시하는 창의적인 방법

Classes

당신은 보디빌더 또는 CrossFit 사람 이상입니까? 이 페이지에서 수업, 목록 또는 게시물에 사용할 수 있는 멋진 레이아웃을 찾을 수 있습니다. 하단의 추천 회전 목마는 체육관의 효율성에 대한 사회적 증거 역할을 합니다.

이 페이지는 피트니스 수업을 위한 것이지만 방문자가 쉽게 소화하고 읽을 수 있는 방식으로 콘텐츠가 풍부한 페이지를 구축하는 방법에 대한 훌륭한 예가 될 수 있습니다. 다른 배경색을 사용하여 각 섹션을 명확하게 구분하고 아이콘 목록, 진행률 표시줄, 아코디언 및 열 콘텐츠를 영리하게 사용하면 이 페이지가 멋지게 보입니다. 페이지에는 방문자가 스크롤할 때 따라가서 가입하도록 유도하는 고정 사이드바도 포함되어 있습니다.

가격, 뉴스 및 연락처 페이지: 키트 페이지 완성

Blog+Post+contact+pricing

이 페이지에서는 연습과 스크롤 효과 간의 일치를 반복했습니다. 이것은 역도 효과를 만드는 데 도움이 됩니다. 매일 체육관 업데이트를 받아야 하는 스포츠 광팬을 위해 피트니스에 관한 모든 최신 기사를 시각적으로 표시하는 뉴스 페이지를 만들었습니다.

새로운 가입자의 지속적인 흐름 없이는 어떤 체육관도 살아남을 수 없습니다. 이것이 우리의 연락처 페이지에 영업 시간, 연락처 양식, 주소 및 기타 연락처 정보가 포함된 이유입니다.

몸을 돌보기 전에 내부를 돌보십시오(나쁜 말장난 죄송합니다).

404 페이지: 이미지는 '0' 역할을 합니다.

이 페이지는 404 페이지를 구성하는 '4'와 '4' 사이에 창의적으로 배치된 이미지 캐러셀을 창의적으로 사용하는 것을 특징으로 합니다.

머리글 및 바닥글: 네온 색상을 놓칠 수 없습니다.

Header+Footer

체육관의 헤더는 끈적끈적한 헤더이며 전체 키트의 동일한 디자인을 따릅니다. 바닥글의 경우 USP, 연락처 세부 정보, 문의 양식 및 소셜 미디어 링크가 포함된 긴 디자인을 사용했습니다.

팝업: 멋진 애니메이션 상자

헤더의 Join Us 링크를 클릭하면 팝업이 나타납니다. 이 키트를 위해 우리는 일반적으로 박스형 팝업에서 벗어나 체육관의 특별 여름 세일을 위해 더 흥미로운 레이아웃을 만들었습니다.

키트를 얻는 방법

잘 디자인된 사이트는 잘 디자인된 몸에 영감을 줍니다! Elementor Pro가 있는 경우 이 최첨단 키트를 즐기기 위해 해야 할 일은 Elementor로 이동하여 템플릿 라이브러리를 열고 'Gym'을 검색하는 것입니다.

다음에 보고 싶은 템플릿은 무엇입니까? 아래 의견에 알려주십시오.