벤치마킹과 영감을 주는 사이트 일반 유저들은 사실 찾아 볼 일이 많지 않은 사이트죠. 이번은 웹기획자나 웹디자이너가 많이 찾아보는 사이트들을 모아두었습니다. 실제 실무에서도 많이보고 스터디하는 예비 디자이너 분들도 많이 참고하는 영감을 주면서 동시에 요즘 웹의 트렌드를 익혀갈 수 있는 사이트들 입니다. 매일 같이 볼 필요는 없지만 습관적으로 찾아보는게 좋죠! #1 디비컷 국내에선 가장 유명한 곳이라고 할 수 있습니다.(요즘은 어떤지 모르겠지만..) 보통 국내 사이트의 현황을 보기위해 많이 보는 곳이면서 동시에 커뮤니티도 활성이 그나마 되어 있는 편이라 궁금증이 생길때 물어보면 답변도 해줍니다. 그러나 큰 기대는 하지 말기를... 저도 심심할때(?)면 가보는 곳이죠. 간혹 커뮤니티에 콜로세움이 서긴 하는데..

마우스커서를 변경해보자지금 이 티스토리의 마우스 커서를 보면 "어? 내 시스템 마우스 커서거 아니네?" 라고 할 것이다. 이 마우스 커서는 이 블로그에서만 작동되는 것이고 과한 커서만 아니라면 유저에게 새로운 경험을 하게 해줄 수 있다. 그리고 사이트의 퀄리티도 올릴수 있다. 그것도 아주 간단하게 할 수 있다.우선 다양한 마우스커서를 제공하는 사이트를 방문해 보도록 하자.커서포유 바로가기사이트에 가면 왼쪽에 다양한 카테고리가 있다. 너무 많기 때문에 즐거운 고민을 하며 골라보도록 하자. 참고로 필자는 카테고리 Cursors/Pointers 에서 2번탭에 가면 있는 마우스 커스를 사용해봤다. 나중에 질리게 되면 다른 마우스를 사용할 수도 있다.이제 하단으로 조금 더 내려가다보면 스크린샷과 같이 CSS 코드..

티스토리 꾸미기 - 컨텐츠 페이드 인 지금 현재 블로그를 보면 클릭해서 들어가는 컨텐츠들이 페이드 되어 보여질 것이다. 컨텐츠를 페이드 시키게 되면 다시한번 사용자에게 컨텐츠에게 재 집중시키게 할 수 있는 좋은 방법이라 생각이 든다. 너무 조금만 느리게 설정이 되도 바로 지루함과 답답함을 느끼게 되지만 0.3~0.5초 정도의 페이드라면 충분히 사용자를 편하게 해줄수 있는 좋은 기법이다. 왠지 어려울것 같지만 생각보다 굉장히 간단한 방법으로 할 수 있다. 한번 알아보도록 하자. 복사할 CSS 코드 - 반응형 #1스킨용 #dkContent { animation: fadein 1s; -moz-animation: fadein 1s; /* Firefox */ -webkit-animation: fadein 1s; ..

다음 애드핏은 역사속으로… 하지만 카카오 애드핏으로 변경! 다음에서는 운영하던 애드핏이 카카오로 이전되었네요. 운영을 제외하고 특별히 달라진건 없네요 :) 카카오 애드핏이란? 카카오 애드핏은 PC/모바일 버전 사이트에서 노출되는 수익성 배너 플랫폼이다. 보통 티스토리 블로거를 운영하는 분들이 구글 애드센스에서 광고승인을 받기전 거쳐가는 플랫폼이라고 본다. 필자는 꼭 그럴 생각은 없지만 왠지 분위기 상으로는 필자도 그렇게 해야만 할것 같은 분위기 인것은 사실이다. 아무래도 PC버전 광고가 안된다는 점이 가장 큰 문제점이 아닌가 싶다. 어쩌면 티스토리 보다 앱에 띄우는 광고 용으로 적합할 수 있다. 이번 블로깅에는 티스토리 모바일 버전에 애드핏을 적용하는 블로깅을 해보도록 하겠다. 애드핏 플랫폼을 이용하기 ..

백색소음이란? (White Noise) 알만한 사람들은 다 알만한 집중력을 올려준다고 알려져 있는 소리다.(카페에서 들려오는 소리라던가 빗소리라던가 자연의 소리라던가) 일할 때 집중력이 좀 필요하다 싶으면 틀어 놓으면 좋다고 생각한다. 사람마다 백색 소음이 도움이 되기도 아니기도 하기 때문에 개인차이를 보이는 것도 특징이다. 개인적으로는 도움이 되는데 마음이 안정이 되면서도 단기간 집중력이 높이 올려준다고 생각한다.플라시보 효과라고 생각하는 사람도 있겠지만 그렇게라도 기분이 좋다면 자연스럽게 집중력도 올라갈 것이라 생각이 든다. 적어도 화이트 노이즈가 걸리적 거리지 않는다면 자주는 아니더라도 가끔 들으면 능률이 오름을 느낄 수 있을 것이다. 그렇다면 화이트노이즈에 관련된 사이트를 소개해보도록 하겠다. 필..

컬러를 조합, 선택하자! 우리는 디자인을 할때 가장 중요한 것을 무엇이라 생각하는가 하면 역시 컬러가 아닐까 싶다. 어떤 선택을 하느냐에 따라 분위기 말하고자 하는 디자인이 달라질뿐더러 퀄리티 마저 좌지우지 시킬 수 있는 것이 컬러다. 그렇다면 결국 컬러를 잘 선택, 조합해야 한다는 것인데 간단하게 그 문제를 해결해줄 사이트들이 있다. 바로 Adobe Color CC가 있다. 우리가 기본적으로 디자인의 분위기를 잡을 포인트 컬러를 잡게 되면 그 컬러와 유사색 또는 보색 등을 추려서 선택해준다. 이것만으로도 우리는 꽤 컬러 선택의 어려움을 이겨냄과 동시에 시간을 번다고 할 수 있다. Adobe Color CC 바로가기 색상규칙을 통해 원하는 색을 얻을 수 있다. 사이트를 방문하게 되면 왼쪽 색상규칙과 하단..

크롬에서 확장프로그램을 설치하자. 일반 유저들은 그렇게 찾아 볼 일은 없지만 IT 관련 직종의 사람들은 반드시 필요한 모드죠. 크롬에서 기본적으로 가지고 있는 기능이 있긴 합니다. 그러나 이것은 반응형 사이트에서만 적용되고 실제 모바일에서만 작동하는 사이트를 확인할 수가 없죠. 서론은 여기까지 하고 아무튼 크롬 확장기능을 설치해야 합니다. (아마 크롬으로 만든 브라우저들[엣지,웨일]도 사용 가능할겁니다!) 크롬 웹스토어 링크를 클릭했다면 자동으로 검색이 되어 있을겁니다.(친절) 혹시라도 안되어 있다면 스토어 검색어로 user agent swticher를 입력하고 User-Agent Switcher for Chrome을 설치하면 끝. 이제 설치가 끝났다면 크롬 우측 상단에 추가된 "가면쓴문서 아이콘"을 클..