코로나19가 발생하기 전처럼 마음 놓고 일상을 즐길 수 있는 날이 점점 다가오고 있네요. 페스티벌 개최 소식이 속속 들려오면서, 지금의 날씨처럼 마음 또한 들뜨는 것 같습니다.

행사를 안내하는 페이지가 필요할 때, 이 템플릿을 사용해 보세요. 템플릿 이름은 'Jazz Festival'입니다.

페이지는 나눴지만, 하나로 보여주겠어!

아임웹 디자인모드는 매우 손쉽고 강력해서 제작이 완료된 후에도 계획이 변경되면 바로 재구성이 가능합니다. 만약 각각의 메뉴로 나뉘어 있는 페이지를 한 페이지로 보여주어야 하는 상황이 온다면, 공통 디자인 설정 내 ‘원페이지 구성' 옵션을 사용해 볼 수 있습니다. 옵션을 체크하면 구성된 메뉴 순서대로 한 페이지에 보입니다. 그리고 각 메뉴는 ‘앵커(anchor)’ 역할로 변경됩니다. 메뉴를 누르면 해당 위치로 자연스럽게 스크롤 되어요.

랜딩 페이지?

템플릿 'Jazz Festival'은 랜딩 페이지의 성격을 가지고 있습니다. 랜딩 페이지는 검색 엔진, 광고 등을 경유하여 접속하는 이용자가 최초로 보게 되는 웹페이지입니다. (위키백과) 그러면 랜딩 페이지와 홈페이지는 무엇이 다를까요? 사용자의 액션을 어떻게 유도하느냐에 큰 차이가 있습니다. 홈페이지와 다르게 랜딩 페이지는 특정 액션만을 유도하도록 페이지가 구성됩니다. 예를 들면, 새로운 모바일 앱이 출시되었을 때 ‘앱 다운로드’라는 하나의 액션만을 위해 페이지 여정이 구성되는 거죠.

예: aaply.app

 

갤러리와 모달의 만남

모달(Modal)을 사용하면 세부 정보는 더 보여주되 페이지를 이탈하지 않도록 유도합니다. 연결 방법도 매우 간단해요. “모달 페이지를 생성한다, 그리고 모달을 연결한다.” 랜딩 페이지인 'Jazz Festival'은 아티스트의 상세 정보를 모달로 등장하도록 템플릿화 시켰습니다.

이미지는 트랜디하게

온라인에서 gif의 사용은 오래전부터 이어져왔습니다. 위트 있게 내용을 전달하기에 적합하기도 하며 파일의 용량도 가벼워 유용하게 쓰이고 있습니다. 본 템플릿에는 최근에 포착된 이미지 표현 방식을 적용해 보았습니다. 바로 이미지에 움직이는 노이즈를 추가하여 아날로그 느낌을 전달하는 방식입니다. 앞으로 사이트를 제작하실 때 유용하게 쓰일 수 있을 것 같습니다.

이런 분들이 사용하면 좋습니다.

• 일시적인 이벤트, 행사 등을 안내하는 페이지가 필요하신 분
• 이미지나 사진 등을 과감하게 사용하고 싶으신 분
• 한 페이지 안에 스토리를 담아서 구성하고 싶으신 분

컬러

페스티벌의 과감하고 시크한 매력을 느끼도록 '블랙 앤 화이트' 컬러로 페이지가 제작되었습니다.

폰트

영문폰트 : Helvetica | 국문폰트 : 본 고딕 (Noto Sans)

그럼, 템플릿을 한 번 보러 가보실까요?

템플릿 보러가기

by UX 대석