190224 티스토리 스킨 제작 일지

190224 티스토리 스킨 제작 일지

이제 이 스킨도 얼추 끝나지 않았나 싶습니다. 헤더 모양을 보시면 아시겠지만, 인덱스 페이지에서 최상단에 고정된 슬라이더가 아닙니다. 예전엔 슬라이더를 단 하나밖에 사용할 수 없었는데, 여러 개의 슬라이더를 사용할 수 있도록 스크립트와 css를 손봤습니다. 또한, 표시된 3가지 요소의 위치를 적절히 수정하여, 충돌하는 일이 없도록 하였습니다. 상술한 내용 외에도 자잘한 변화가 꽤 있었고, 이제 슬라이더는 완성했지 않나 싶습니다. 페이지 최상단에 고정된 슬라이더를 최근 글에서 트와이스의 Dance the Night Away의 뮤직비디오로 변경했습니다. 원랜 Yes or Yes를 사용할 예정이었으나... 화면 비율이 이 모양이라, 16:9의 화면에 맞추려고 하니 화질이 말도 안 나오게 깨져서...그냥 DTN..
190221 티스토리 스킨 #5 제작일지

190221 티스토리 스킨 #5 제작일지

헤더 카테고리 예전엔 하위 카테고리가 있는 카테고리와 하위 카테고리가 없는 카테고리의 너비가 달랐는데, 너비가 똑같아지도록 수정했습니다. 하위 카테고리가 있는 카테고리는 5개의 글을 불러오고 하위 카테고리가 없는 카테고리는 6개의 글을 불러옵니다. 헤더 헤더 카테고리가 중앙정렬되도록 변경했습니다. 슬라이더 모양만 똑같이 유지하고 스크립트는 아예 뜯어고쳤습니다. 예전엔 슬라이더 안에 들어있는 항목을 모두 1열 횡대로 배치하고 컨테이너의 left 값을 수정하며 슬라이더의 항목이 하나씩 표시되도록 했는데, 이번엔 슬라이더 항목의 class를 수정하는 방식으로 변경했습니다. 둘 중 어느 게 더 보기 좋은지는 아직 시험 중입니다. 예전 스크립트보다 용량은 1/3 정도로 줄였습니다.
190220 티스토리 스킨 #5 제작일지

190220 티스토리 스킨 #5 제작일지

꽤 오랫동안 작성하지 않아 긴가민가한 게 많은데, 뭐 제대로 생각나지 않는 건 크게 중요한 게 아니라 그런 거겠거니 하고 넘어가렵니다. 저번 제작일지에 새로운 이름을 붙이겠다고 얘기하곤 아직 생각난 게 없네요; 글 목록 화면 글 목록 화면에서 글 목록 뒤에 있던 흰색 배경을 지워봤습니다. 아직 어떤 게 더 나은지 정확하게 모르겠네요. 404 페이지 사진 하나 뜨던 404페이지를 새롭게 바꿨습니다.사진은 불러오는데 시간이 걸리기도 해서 그냥 사진 없이 구성했습니다. 예전엔 '5초 후 메인 페이지로 돌아갑니다.'란 문구로 고정되어 있었는데, 이젠 초가 줄어드는 게 표시됩니다. background-image 수정 이렇게 썸네일이 배경으로 들어가는 요소들 우측에 검은 선이 조그맣게 남아있던 오류를 억지로 수정했..
190124 티스토리 스킨 #5 제작일지

190124 티스토리 스킨 #5 제작일지

한 게 꽤 됐던 것 같은데, 다른 스킨 작업하다 보니 깔-끔하게 잊었습니다... 이제 marshall-ku.tistory.com/1234 등으로 접속하면 .tistory가 사라진 경로로 자동으로 이동합니다.굳이 필요는 있을까 싶습니다..;; 이거 듣다 갑자기 생각나서 로딩 창에 다시 바람개비를 넣어 봤습니다. 예전에 있던 svg는 로딩 창이 너무 빠르게 사라져서 애니메이션이 표시조차 안 되고 사라지곤 했는데, 바람개비는 일단 바람개비 모양이라도 나오니 만족합니다 ㅋㅋㅋ추가로, 로딩 창이 사라지는 타이밍이 언제가 좋을지 계속 생각 중입니다. 지금도 계속 조금씩 변하고 있습니다. 테마 관련 작업을 시작했습니다.가장 먼저 어두운 테마를 완성했습니다. 나머지는 언제 다 할는지 걱정입니다. 어두운 테마 작업을 끝..
190121 티스토리 스킨 #5 제작일지 - 커버 업데이트

190121 티스토리 스킨 #5 제작일지 - 커버 업데이트

커버 업데이트에 맞춰, 홈 화면을 꾸밀 수 있도록 업데이트했습니다.종일 슬라이더 스크립트만 잡고 있었네요. 슬라이더입니다.기본적으로 화면 최상단에 고정되며, 스크롤하면 아래 내용이 슬라이더 위를 덮으며 올라옵니다. 이거 작업이 당연하지만 제일 오래 걸렸네요; 간단하게 썸네일을 중심으로 보여주는 글 목록입니다. Masonry를 사용한 글 목록입니다. 기본적으로 글 목록의 것과 크게 다를 건 없지만, border-radius가 없고, box-shadow가 없습니다. 단순한 글 목록입니다. 썸네일을 배경에 넣는 글 목록입니다. 갤러리 형태의 글 목록입니다. 왼쪽이 마우스를 올린 모습, 오른쪽이 마우스를 올리지 않은 모습입니다. 스킨 제작 초창기에 만들어뒀던 건데, 사용하지 않아 삭제하려다 각주 처리해뒀는데 마..
190119 티스토리 스킨 #5 제작 일지

190119 티스토리 스킨 #5 제작 일지

서울에 일주일가량 다녀오느라 좀 많이 늦었네요 ㅠㅠ이제 좀 지루해지는 단계입니다. 눈에 보이는 변경은 별로 없지만, 세세한 틈 하나하나 채워 나가는... Video Sticker video-sticker에 자그마한 변화가 있습니다.이제 스킨 옵션에서 해당 옵션을 껐다 켤 수 있게 변경하고, 비디오가 하나가 있을 땐 무조건 작동하도록 했습니다. 물론 해당 옵션을 끄고 싶은 글이 있을 수 있으니, 이 글에서 확인하실 수 있듯 특정 글에만 끌 수도 있도록 해뒀습니다. 댓글 입력란 디자인 댓글에 이모티콘 / 이미지 / 비디오 를 쉽게 첨부할 수 있도록 해뒀습니다. 예전엔 이모티콘이 댓글 입력창 위에 표시됐지만, 이젠 이미지 / 비디오와 함께 아래에 표시됩니다. 이모티콘 버튼을 누르면 레이어가 뜨고, 이모티콘을 ..
[wip] Summer Nights 2.0

[wip] Summer Nights 2.0

일단 기존의 틀을 크게 벗어나지 않는 선에서 새로이 제작 중입니다.필요 없는 것은 버리고, 필요한 것들은 새로 추가하며 만들어가는 중인데, 쉽지 않네요 ㅠㅠ 로딩 창 / 프로필 레이어의 배경 등에 남아있던 트와이스의 상징들을 제거해 범용성을 높였습니다. 일단 스킨 옵션들을 다양하게 추가해서, 예전처럼 복잡하게 매뉴얼을 보고 따라 하지 않아도 되도록 수정하고 있습니다. 홈 화면의 모습입니다. 전체적으로 예전과 크게 변함은 없지만, 조금 더 둥글둥글하게 만들어 봤습니다. 예전과 다르게 방명록 / 태그 목록 등에서도 배너에 간단한 문구를 삽입할 수 있습니다. 배너에 카테고리 / 제목 등을 표시하는 부분의 디자인을 살짝 변경했습니다. 오래된 댓글의 디자인을 새로이 개편했습니다. 예전의 디자인은 모바일 환경에서 ..
190102 수정 및 제작 일지

190102 수정 및 제작 일지

새로운 스킨을 제작 중인데, 오랜만에 하려니 영 쉽지 않네요;; 수정 일지부터 시작하겠습니다. 배너에 yes or yes 영상을 넣었습니다. 어두운 모드가 조금 더 어두운 모드답게 보이도록 했습니다.배경에 그라데이션 대신 검은색이 들어갑니다. 댓글에 오류가 있는 걸 발견하고, 수정했습니다. 예전엔 댓글이 많을 때 생기는 '이전 댓글 더보기'란 버튼을 클릭하면 마지막 댓글 안에 댓글들이 우르르 불러와 지고, 댓글을 수정하면 페이지를 새로 고침 하기 전까지 말풍선 안에 새로운 말풍선이 생겼는데, 이제 그 오류가 더는 발생하지 않습니다.또한, 사이드바에서 최근 댓글을 클릭해서 댓글을 보러 가면 노란색으로 깜빡이는 대신 말풍선의 배경을 바꿔서 해당 댓글을 표시해줍니다. Summer Nights는 2.0버전 제작..
181223 크리스마스를 맞아 가볍게 수정

181223 크리스마스를 맞아 가볍게 수정

제대도 했으니 이제 대규모 수정과 새로운 스킨의 제작을 준비 중입니다.그에 앞서, 짤막한 수정을 몇 개 해봤습니다. 인덱스 페이지 이미지 화질 개선싸지방에서 작업하다 보니 사진의 화질을 제대로 확인 못 했습니다.깜짝 놀랄 만큼 화질이 낮아서 이미지 모조리 교체했습니다. About Twice! 페이지 최신화 먼저, 오랫동안 방치되던 About Twice! 페이지를 최신화했습니다.Dance the Night Away의 이미지에서 올해 제일 잘한 일의 이미지로 교체됐습니다. Merry Christmas! 블로그에 눈이 내립니다!
1 2 3 4 5 6 ··· 9
블로그 이사갔습니다 (클릭)