본문 바로가기

디엠지미디어/디엠지소식

디엠지 티스토리 탄생 비화


오늘은 이 자리를 빌어 디엠지미디어 공식 티스토리 탄생 비화를 얘기해 볼까 합니다. 


▲ 2016년 12월 02일 진행 된 워크샵 인증샷


    티스토리 제작 건의가 들어온 것은 작년 12월 워크샵에서 입니다. 디엠지만의 콘텐츠를 담을 수 있는 웹페이지 같은 게 있었으면 좋겠다! 라는 의견 이었습니다. 홈페이지보다는 조금 더 포털에서 접근성도 좋고 자유롭게 직원 누구든 게시글을 관리할 수 있게 하자는 취지에서 티스토리 블로그를 채택하게 되었습니다. 


▲ 네이버 블로그 스킨 디자인


    처음 티스토리 제작 제안이 들어왔을 때만 해도 '그래봐야 블로근데 별 거 있겠어' 싶었습니다. 네이버 블로그를 많이 디자인세팅 해보았기 때문에 이정도야 식은 죽 먹기 일 거라 생각했던 거죠. 우매했습니다, 그렇습니다. 티스토리 스킨은 알고보니 태그와의 전쟁이었습니다. 박스모델링에 CSS를 사용해서 직접 디자인 하는 시스템 이더군요.


    네이버 블로그처럼 형식적인 포멧이 존재하는 것도 아닐 뿐더러, 디자인과 퍼블리싱만 한다고 해서 구현되는 것도 아닌 미묘한 형태였던 것입니다! (문득 XE와 전쟁하던 시절을 떠올리게 했다) 티스토리 블로그 스킨 만들기 어렵다고 익히 들어오긴 했지만 이정도 였을 줄이야. 호호..


▲ 코딩으로 구현 할 디자인을 미리 그려보는 중


    만들어져 있는 스킨을 써볼까 해서 초기에는 티스토리에서 기본제공하는 반응형 스킨을 사용 했었습니다. 하지만 너무나도 블로그 스러운 인터페에스 탓에 언성이 자자하여 (주륵...) 결국 다른사람들이 쓰고있는 티스토리 스킨을 여럿 참고하여 새로 디자인 하였습니다. 크흑, 제안으로 들어온 셈플들이 각기 너무나도 다른 모델링 형태를 취하고 있는데다, 거의 쿼리를 심어 이루어진 페이지라 갈피를 못 잡고 방황하다가 ... (눈물) 은근슬쩍 가장 심플한 형태를 선택하게 되었습니다. 모바일은 알아서 포멧이 바뀌기에 미디어 스크린까지 설정하지 않아도 될 것 같아 그냥 두었습니다. (편리하다!)


▲ 디엠지미디어와 하우징올의 상징 징돌이


    디엠지미디어와 하우징올을 상징하는 메인 컬러는 본디 레드와 그레이 조합입니다. 그런데 색상이 디자인에 적용하기에는 너무나도 강려크 해버려서, 논의 끝에 티스토리 메인 색상은 민트색으로 결정되었습니다. 

▲ 티스토리 전체적인 모습


   그리하여 완성 된 디엠지 티스토리! 네비게이션 세부 목록이 너무 많아서 이걸 어찌해야되나 고민하다가 제이쿼리로 처리했습니다. (역시 만능술사 쿼리) 게시글 리스트 프로그램 손보려고 다른 쿼리 같이 넣었는데 어째서인지 네비가 제대로 망가져서 추후 한 번 더 세팅을 해야했지요... 후후.. 알다가도 모를 티스토리...후후.. 앞으로 좀 더 연구를 해봐야 될 것 같아요. 메인화면 통일감을 위해 티스토리 헤더용 디폴트 이미지 양식도 추가로 만들어졌답니다!


디엠지미디어 바로가기 링크용 캐릭터들. 


     바로가기 1호기 반응이 좋아 2호기와 3호기도 생겼습니다. 같이 모아두니 군무로 디스코를 추고 있는 것 같군요! (여럿이 클릭을 강요하는 것 같아 한편으론 무섭기도하다) 캐릭터 표정 만큼이나 즐거운 디엠지미디어가 되길!