안녕하세요. UX팀 디자이너 강진현입니다.
매거진 템플릿 BO-OK를 소개해 드리겠습니다.
사용하기 쉬운 매거진
아임웹에는 다양한 위젯과 기능들이 있습니다. 사이트의 목적에 따라 사용하는 위젯의 종류는 각자 다 다르겠지만 ‘최소한의 위젯 종류를 활용해서도 충분한 웹사이트를 만들 수 있지 않을까?’ 라는 생각에서 시작하게 되었습니다. 이번 템플릿은 텍스트 / 게시판 / 최신글 세 가지의 위젯으로만 템플릿을 구성하였습니다. 제어할 위젯 수가 적기 때문에 훨씬 쉽고, 효율적으로 제작이 가능합니다. BO-OK은 블로그 / 매거진으로 사용이 가능한 것은 물론 게시판 위젯 대신 쇼핑 위젯을 활용하여 감각적인 쇼핑몰로도 활용이 가능한 템플릿입니다.
내용이 가장 잘 보이는 템플릿
BO-OK은 매거진, 블로그 콘텐츠를 강조하기 위해 해당 영역을 가장 넓게 설정하였습니다. 콘텐츠 가독에 방해가 되지 않도록 색상은 최소한으로 사용하였습니다.(One Point Color)
컬러
- 이미지가 잘 보일 수 있도록 텍스트는 어두운 무채색 컬러사용 (#212121)
- 매거진의 개성넘치는 느낌을 살린 비비드한 색상을 사용 (#0000ff)
폰트
- (영문) 제목, 본문 폰트 : 깔끔한 느낌을 주기 위해 본문, 제목 폰트를 통일하여 폰트의 굵기를 통한 강조로 사용 (Lato)
- (한글) 제목, 본문 폰트 : 영문 폰트의 깔끔한 고딕느낌을 살려 스포카 한 산스 폰트를 선택
메인
- 게시판 위젯, 최신글 위젯을 활용하여 한 페이지에서 게시물과 인기글을 함께 확인할 수 있습니다.
- 섹션 설정의 사이드 영역 분할 기능과 메뉴리스트 위젯을 활용하여 상단을 대체하였습니다.
서브
- 게시판 위젯, 최신 글 위젯을 활용하여 인기글 또한 같이 확인 할 수 있는 레이아웃
- 컨택을 할수 있는 입력폼 위젯을 사용
모바일 편집
BO-OK는 모바일에서도 완성도 있는 웹사이트가 될 수 있도록 몇 가지 모바일 편집이 따로 이루어졌습니다.
상단
- PC에서 삭제한 상단을 모바일에서 사용을 위해 추가
그 외 서브 / 고정섹션
- PC 사이드 메뉴에 포함 되어있던 정보는 모바일 하단 고정섹션으로 변경되었습니다.
- 그 외 위젯 여백들이 모바일 편집에서 재조정 되었습니다.
마치며
매거진, 블로그 활용이 높은 BO-OK 템플릿으로 시작해보세요 :)
BO-OK 템플릿 살펴보기
