[스킨 소개] 희로인11 스킨 #1 - 종이책 2022.03.17 18:31:47

희로인11이 첫번째로 판매하고자 하는 스킨은 "희로인11 스킨 #1 - 종이책" 입니다. 

 

종이책을 읽을 때 느낄 수 있는 질감, 특유의 정취를 담고자 노력했습니다. 책을 읽다가 얼굴에 덮고 잠시 눈을 붙일 때 은은히 풍겨오는 그 종이 냄새, 좋지 않나요?

 

희로인11 스킨 #1-종이책은 일상과 여행에서 느낄 수 있는 소소한 행복을 표현하고자 하는 분들께 추천하는 스킨입니다. 

 

이 스킨을 사용하시는 분들은 글을 작성하실 때 너무 다양한 색상을 사용하지 않길 권해드립니다. 많아도 두 개 정도의 색상만을 사용했을 때 이 아날로그 종이책 감성이 유지 될 것입니다. 그 감성을 유지한다는 것에 포인트를 두고 하나씩 글을 작성해가시다보면 아주 예쁜 책이 한 권 완성될 것입니다. 

 

아래 상세 페이지들에 대한 스크린샷을 남겨놓았으니 어떤 식으로 디자인되었는지 구경해보세요. 이미지를 클릭하시면 확대된 버전으로 살펴보실 수 있습니다.

 

 

1. 사이드바 + 글 영역

2단 형식으로 구성되어 있으며 상하좌우에 회색 여백을 주어, 방문자가 독립된 공간에서 차분히 책을 읽는 느낌을 가질 수 있게 했습니다.  

 

 

2. 글목록 + 글

글목록은 썸네일 이미지를 담은 카드 형식으로 나타냈습니다. 글자 카드가 제멋대로 흩어져 있는 효과를 주기 위해서 썸네일 이미지의 사이즈를 일부러 통일시키지 않았습니다. 

 

 

 

3. 방명록/댓글

레트로한 디자인으로 방명록 및 댓글 입력창을 꾸며 방문자가 안부를 남기고 싶은 생각이 들도록 디자인했습니다. 진심으로 안부를 남기고 싶은 이웃들을 "희로인11 스킨 #1 - 종이책"과 함께 만들어가셨으면 좋겠네요.

 

방명록 화면

 

댓글 화면

 

5. 태그 모음

글을 작성하면서 어떤 태그들을 사용했는지 한 눈에 확인할 수 있습니다. 

 

 

6. 모바일 화면 글 영역/사이드바

모바일 화면에서는 사이드에 있는 화살표 클릭을 통해 사이드바와 글 영역을 넘나들 수 있습니다.

 

 

 

 

7. 보호글 암호입력 화면

티스토리에서 보호글은 관리자가 공유해준 비밀번호를 입력해야지 볼 수 있습니다. 잠금을 해제해보고 싶은 생각이 들지 않나요? 

 

 

8. 펜 모양 마우스 커서

저는 개인적으로 책에 줄을 긋고 메모하면서 읽는 것을 좋아합니다. 그래서 종이책과 잘어울리는 펜 모양의 마우스 커서를 제작해서 넣었습니다. 

 

 

9. 본문 글자 크기 조절 기능

웹페이지 우측 상단을 보시면 본문의 글자 크기를 조절할 수 있는 기능이 있습니다. 마이너스, 플러스 버튼 보이시죠?^^ 블로그에 방문한 사람들은 자신에게 맞는 폰트 크기로 글을 읽을 수 있습니다.

 

 

 

희로인11 스킨 #1 - 종이책, 잘 둘러보셨나요?

 

스킨 구매를 원하시는 분은 희로인11 스킨 구입 안내 글을 참고하세요. 감사합니다. 

 

 

릴리즈노트

v1.0.3

- 2022-04-03 릴리즈

- 본문 영역 글자 크기 조절 버튼 추가

- 애드센스 광고 추가했을 때 컨테이너에 지정했던 높이가 풀리는 현상 해결

- 글 본문 영역과 댓글 폰트 수정

- 기타 UI 개선

 

v1.0.4

- 2022-04-08 릴리즈

- 글 목록 masonry 방식으로 정렬

 

v1.0.5

- 2022-04-10 릴리즈

- 본문 영역 글자 크기 조절 버튼 위치 브라우저 사이즈 변경에도 적절한 위치를 유지하도록 수정

 

v1.0.6

- 2022-04-14 릴리즈

- 영문일 때 간혹 줄바꿈이 제대로 안되는 현상 해결

 

 

(이 글은 2022-05-21에 마지막으로 수정되었습니다.)

-
+