정보의 홍수 속에 사는 현대인 여러분, 안녕하십니까? 평소에 '웹 서핑' 많이들 하시죠?


저는 주로 출퇴근 길에 휴대폰을 열심히 들여다보는데요. 새로운 정보에 뒤처지기 싫은 마음에, 도움이 될 만한 것을 강박적으로 찾아보는 것 같습니다. 정보로부터 받은 감명은 그때 뿐이고 이내 잊어버립니다. 정작 읽었던 내용이 필요할 때 기억이 나지 않습니다. 봤다는 사실조차 잊어버리지요. 때로는 한 번 찾았던 것을 다시 검색하는 내 모습에 놀라기도 합니다.


우리는 수많은 정보 속에서, 보고도 원하는 정보를 찾지 못하고, 찾고도 원하는 정보를 이용하지 못한 채 매일 잊으며 살고 있습니다. 1분 1초 귀한 시간을 쪼개서 얻은 정보인데 기억 속에 묻어둘 순 없겠죠? 당장 사용하지는 않더라도 내가 찾아봤던 것들, 필요한 레퍼런스를 잘 정리해둬야겠다는 생각을 하게 되었습니다. 


왜 적어두었는지 기억나지 않는 노트 일부


옛날에는 책을 읽으면서 좋은 글귀를 노트에 적어두고 그 노트를 나중에 다시 보는 재미도 있었습니다. 요즘은 주로 웹에서 정보를 얻다 보니 읽을거리, 볼거리도 다양하고 그 양도 많아서 노트 한 쪽에 적어두기에는 한계가 있습니다. 웹에서 찾은 이미지와 문서, 링크 등 각종 레퍼런스를 그에 맞는 방식으로 관리해야겠다는 생각이 들어, 그 방법을 찾아보려고 합니다.



파일로 저장하기 


파일로 저장이 가능한 형태의 레퍼런스라면 문서나 이미지 파일로 보관하는 방법이 괜찮습니다.


좋은 자료는 발견하는 '즉시' 저장하는 것이 포인트입니다. 구글 드라이브나 드롭박스(Dropbox)와 같이 클라우드 서비스를 이용하면 다른 기기에서도 확인할 수 있습니다. 


다만 다소 번거롭고 저장 공간의 용량이 마음에 걸립니다. 이미지의 경우엔 파일로 저장하기 좋지만, 문제는 웹페이지입니다. 본문을 어딘가에 ‘복사+붙여넣기’ 할 수도 있지만, 글의 양이 너무 많으면 그것도 어렵습니다. 브라우저에서 Save Page As를 해보신 분들은 알겠지만 HTML 파일로 저장이 됩니다. 이건 아닌 것 같습니다..



브라우저의 북마크/읽기 목록 활용하기


북마크 기능은 1번에서 얘기한 웹사이트 링크 보관의 문제를 해결해주는 듯합니다. 요즘엔 PC와 모바일 브라우저가 연동되어 데스크톱에서 저장한 북마크를 모바일 브라우저에서도 확인할 수 있습니다. 파일 관리처럼 북마크의 저장 체계를 잘 정할 필요가 있습니다.


Safari 브라우저의 읽기 목록 추가하기


사파리 브라우저에서 제공하는 읽기 목록 기능도 비교적 최근 자료에 대해서는 유용하지만 과거의 자료를 떠올리기에는 한계가 있습니다.



자료수집용 블로그/SNS 계정 만들기


구글 ‘자료수집용' 검색 결과 중 일부


자료 수집용 블로그나 SNS 계정을 본 적이 있을 것입니다. 최근엔 블로그나 트위터, 페이스북에서 많은 정보를 얻다 보니, 바로 그 SNS 계정을 활용하는 것도 좋아 보입니다. 계정에 직접 자료를 올리거나 다른 사람들이 공유한 것을 좋아요/리트윗/공유하기를 하여 내 계정 페이지에서 쉽게 모아 볼 수 있습니다. 내 계정에 유용한 정보가 쌓이면 나의 팔로워도 늘어나 일거양득의 효과가 있습니다.


그러나 자료 수집이 서비스의 본래 목적이 아니기에, 내 타임라인에서 과거의 자료를 찾아보기가 쉽지 않아 아쉽습니다.



관련 서비스, 어플리케이션 이용하기


보다 전문적인(?) 방법을 찾아보았습니다. 자료의 수집과 공유를 위해 만들어진 관련 서비스들이 있습니다. 이 서비스를 이용하면, 내가 혹은 남이 공유한 웹 레퍼런스를 쉽게 얻고 저장하며, 또 다른 사람과 공유할 수 있습니다.


핀터레스트에서 생성한 보드. 업무와 무관하지만 개인 취향의 패션 화보를 모으기도 합니다.


이미 많이 알고계실 핀터레스트(Pinterest)는 웹에서 찾은 자료를 '보드'에 '핀'으로 담아 보관할 수 있는 서비스입니다. 디자인을 비롯하여 사진, 패션, 음식 등 다양한 카테고리의 자료가 많습니다. 진행하는 프로젝트나 평소 관심사에 맞게 보드를 만들어 아이디어를 모읍니다. 


내가 찾아본 것과 유사한 자료를 추천해주는 기능 덕분에, 일촌 파도타기처럼 끝없이 핀들을 둘러볼 수 있습니다. '그룹보드'를 만들어 다른 사람들을 초대하면 함께 보드에 핀을 추가할 수 있어서, 팀원들과 자료를 공유하는 데 유용합니다. 


에버노트에 링크 자료를 모으고 있는 순록 발자국


에버노트(Evernote)와 같은 노트 어플리케이션에 필요한 링크를 저장해 둘 수 있습니다. 여러 연관 자료를 하나의 노트에 모을 수 있고, 링크와 함께 나의 설명을 곁들여두면 '내가 왜 이것을 저장해두었나?' 하는 질문을 미리 방지할 수 있습니다. 노트마다 URL을 생성할 수 있어서 누군가와 공유하기도 좋습니다.


MacOS/iOS 포켓 앱 실행 화면


크롬 브라우저 확장 기능으로 간편하게 웹사이트를 보관합니다.


웹의 아티클이나 동영상 등의 콘텐츠를 수집할 수 있는 포켓(Pocket)이라는 서비스도 있습니다. 크롬 브라우저의 확장 기능을 이용하면, 보고 있는 웹사이트를 쉽게 포켓에 담을 수 있습니다. 저장하는 순간에 내용을 요약할 수 있는 단어로 태그 등록을 해두면, 필요한 순간에 태그로 빠르게 레퍼런스를 찾을 수 있어서 좋습니다. 트위터나 Feedly, Filpboard 등 수 많은 즐겨찾기 앱과 연동이 되기 때문에, 여러 채널을 통해 얻은 레퍼런스를 포켓 하나로 관리할 수 있습니다.


슬랙에 링크를 입력하면 사이트의 메타 정보가 요약되어 내용을 짐작할 수 있습니다.


업무 중에 늘 슬랙(Slack)을 사용하다 보니, 급한 대로 참고할만한 링크를 모아두는 개인 채널을 만들기도 합니다.



이 외에도 유용한 서비스가 많습니다. 다루는 레퍼런스의 유형이나 목적, 개인의 취향, 기준에 따라 적절한 서비스를 이용해 봅시다.


그 외 관련 서비스/툴


  • Designspiration : 디자인에 영감을 얻을만한 자료들이 있습니다. 핀터레스트와 비슷한 구성이며, 컬러 코드로 이미지 검색을 할 수 있습니다.

  • Site Inspire : 웹과 인터렉티브 디자인에 관한 자료를 다루며, 스타일과 주제별 키워드로 자료 탐색을 할 수 있습니다.

  • DRAGDIS : 비주얼 북마크 도구입니다. 웹사이트를 둘러보다가 드래그 앤 드롭으로 레퍼런스 수집을 할 수 있습니다. 브라우저 확장 도구를 제공합니다.

  • Gimme Bar : 북마크 도구로 트위터, 인스타그램과 연동되며 드롭박스에 북마크 목록을 백업할 수 있습니다.

  • Inboard :웹사이트 페이지 전체 캡쳐/저장이 가능하며, 이미지, 사진, 스크린샷 관리에 유용합니다. (Mac 용)

  • Raindrop : 포켓과 유사한 서비스로 웹과 앱의 기사, 사진, 비디오를 저장할 수 있습니다.



마치며


웹에서 얻은 레퍼런스를 보관하는 몇 가지 방법을 알아보았습니다. 혹시 더 좋은 아이디어를 알고 계신 가요? 아무리 좋은 방법이라도 모아두고 다시 보지 않으면 기억에서 지워지는 것은 당연합니다. 평소에 작은 관심과 정성이면 주옥같은 정보를 내 것으로 만들 수 있습니다. 좋은 것을 다른 이들과 나누면 더 좋겠죠! 공들여 찾은 자료와 더는 스치듯 안녕하지 않고, 그때그때 정리하여 적시에 꺼내보는 기쁨을 맛봅시다.



by 비숑 발자국


Posted by slowalk

 슬로워크의 웹 개발실에서는 웹과 관련한 다양한 서비스를 제공하고 있습니다. 많은 프로젝트를 수행하고 있기 때문에 효율적으로 업무를 관리하고 협업하는 것이 업무에 있어서 가장 중요한 요소이자 끊임없이 해결해 나가야 하는 숙제이기도 합니다. 

 효율적인 업무 관리와 협업을 통해 좀 더 나은 서비스를 제공하기 위해 웹 개발실에서는 다양한 서비스를 이용하고 있습니다. 이번 블로그에서는 저희가 사용하는 서비스를 소개해드리고자 합니다. 







프로젝트 관리



1. Moxtra(www.moxtra.com)


 Moxtra는 팀 내 의사소통과 협업을 도와주는 메신저 및 업무 관리 서비스입니다. 



이미지 출처 www.moxtra.com



 기본적으로 팀원 간 의사소통을 위해 Slack을 쓰고 있지만, 프로젝트 단위의 할 일을 관리하는 데에는 부족함이 있었습니다. Podio라는 업무 관리 서비스도 사용해보았지만, 상대적으로 복잡한 UI로 인해 많은 사람이 이른 시일 안에 익히는 데에 어려움이 있었습니다. 


 이에 반해 Moxtra는 간단하고 효과적으로 프로젝트를 관리할 수 있습니다. 프로젝트 단위의 '바인더'를 만들어 그 안에서 'to-do'리스트를 만들고 각각의 할 일을 개별적으로 관리할 수 있습니다. 또 누구든지 상대방에게 할 일을 할당할 수 있어서 슬로워크의 수평적인 업무 구조와도 잘 맞아떨어집니다. 





 또 자신의 컴퓨터 화면까지 공유가 가능한 '화상 회의' 기능이 있어 원격 근무자가 있어도 회의를 원활하게 진행할 수 있고, '화이트보드'기능이 있어서 음성이나 자신의 메모를 전달할 수 있어, 의견을 더욱 효과적으로 공유할 수 있습니다. 






2. Trello(trello.com)


 Trello는 이슈를 관리하는 데 있어 효과적인 서비스입니다. '목록'과 '카드'를 기본 인터페이스로 하여 카드를 목록으로 옮기며 이슈의 흐름을 확인할 수 있는 것이 가장 큰 장점입니다. 포스트잇을 붙였다 떼는 것처럼 손쉽게 카드를 관리할 수 있습니다.  





 단순하게 할 일을 점검하는 경우에서보다는, 프로젝트상의 문제나 팀 내 프로세스상의 문제를 정리하고 해결할 때 많이 사용합니다. Trello 역시 다른 사람을 카드에 할당할 수 있고, 카드 개별적으로 체크리스트를 만들거나 댓글을 달 수도 있습니다. Moxtra에 밀려 사용 빈도가 예전보다는 많이 줄었지만, 그래도 개인적으로는 애착을 가지고 있는 서비스입니다.






3. Workflowy(workflowy.com)


 팀 내 공유 목적이 아닌, 개인적으로 프로젝트를 관리하는데 구성원들의 가장 많은 지지를 받은 리스트 관리 서비스입니다. 여러 단계에 걸쳐 항목을 계층적으로 만들 수 있습니다. 



이미지 출처 workflowy.com



 Moxtra가 웹이나 모바일에서 상대적으로 무겁지만, Workflowy는 텍스트를 기반으로 하여 가볍게 할 일을 정리할 수 있습니다. 물론 다른 사람과 할 일을 공유하거나 함께 관리할 수도 있습니다. 또한 '#' 또는 '@' 태그를 붙이거나 노트를 첨부하여 할 일을 손쉽게 모아보거나 효율적으로 관리할 수도 있습니다. 



이미지 출처 workflowy.com







4. Todoist(todoist.com)


 심플한 Workflowy 대신 좀 더 다양한 기능을 지원하는 Todoist를 사용하기도 합니다. 저는 두 가지를 서비스를 다 사용하고 있는데 상대적으로 Todoist가 날짜, 댓글, 알림, 능률 그래프 등을 지원하기 때문에 할 일을 완료하는 재미가 있습니다.  







 단순해 보일 수도 있는 이러한 일정관리 서비스는, 여러 프로젝트를 한 번에 수행하다 보면 겪게 되는 뇌의 혼란(?)을 막아주고 우선순위를 설정하여 빠르고 효율적으로 업무를 수행할 수 있도록 도와줍니다. 






협업



1. Power Mockup(www.powermockup.com)





 주로 프로젝트의 기획 단계에서 사용하는 와이어프레임 서비스입니다. 파워포인트 내에 설치되기 때문에 PPT 형태로 손쉽게 문서를 작성할 수 있습니다. 다양한 종류의 웹사이트를 기획하다 보면 겹치는 요소가 많습니다. 이것들을 일일이 만들 필요 없이 'shapes'에서 끌어다 쓰면 편리합니다. 온라인에서 무료 이미지나 요소들을 자유롭게 내려받아 쓸 수 있는 것도 장점입니다. 또한 다른 와이어프레임 서비스들보다 설명을 첨부하여 상세한 문서를 만들기 쉽습니다.






2. Bitbucket(bitbucket.org) with Slack

 


이미지 출처 bitbucket.org



 프로젝트의 코드관리를 위해 얼마 전까지 'Yobi'라는 서비스를 이용했는데 프로젝트가 종료되어 안타까운 마음이 컸습니다. 새로 Bitbucket을 사용하게 되었고 효율성을 높이기 위해 Slack과의 연결하여 사용하고 있습니다.   





  Bitbucket은 비공개 저장소를 무제한으로 만들 수 있다는 장점이 있어서 개인적으로도 또 업무적으로도 손쉽게 사용할 수 있습니다. Slack과의 연결을 통해 함께 일하는 동료에게 코드 배포와 관리에 관한 메시지를 자동으로 보낼 수 있습니다. (Slack과 연결할 수 있는 다른 App보러가기)   


  • 가격 : 무료 (사용자 5인 초과 시 유료)

  • 다운로드 : 웹에서만 가능





3. Pocket(getpocket.com)


 디자인 레퍼런스를 모으거나 읽어보았으면 하는 내용을 스크랩하기 위해 사용하는 서비스입니다. Pocket 서비스 내에서 메시지를 보내거나 다른 SNS 서비스로 공유할 수 있어서 팀 구성원들끼리 쉽게 링크를 공유하고 정보를 주고받을 수 있습니다.  





 모바일에서도 편하게 사용할 수 있습니다. 주말에 야외로 이동하면서 틈틈이 링크를 보내는 경우가 많아서, 팀 내에서 주말에 알림에 제일 많이 오는 서비스 1위입니다.









사용하진 않지만 추천하는 서비스들 



1. Groove(www.groovehq.com)



이미지 출처 www.groovehq.com



 고객의 문의와 요청을 통합적으로 관리할 수 있는 '헬프데스크 서비스'입니다. 서비스를 제공하면서 중요한 것은 사용자의 요구를 충족시키고 궁금증을 해결해주는 것이 아닐까요. Groove는 통합적으로 고객의 반응과 요청을 관리할 수 있다는 점에서 서비스 제공자가 놓치면 안 될 서비스입니다.


  • 가격 : 이메일 전용 무료 (기업용 유료)

  • 다운로드 : 웹에서만 가능





2. Usability Hub(usabilityhub.com


 내가 디자인한 웹사이트의 사용성이 좋은지, 또는 어떤 요소를 배치해야 사용자들이 액션을 취하는지 등을 알고 싶을 때 사용하면 좋은 서비스입니다. 

 


이미지 출처 usabilityhub.com


 

이미지 출처 usabilityhub.com



 5초 제한 테스트, A/B 테스트, 클릭 테스트 등의 다섯 가지의 사용성 테스트를 통해 사용자의 통계를 받아낼 수 있습니다.


  • 가격 : 무료 (타겟팅, 팀 계정, 인구 통계 자료 수집 등 고급 기능 유료)

  • 다운로드 : 웹에서만 가능



 여러분은 어떤 서비스를 사용하고 계신가요? 업무 환경과 자신의 성향에 맞는 다양한 서비스를 활용해보시길 바랍니다.


출처 : Medium 


by 수달 발자국





Posted by slowalk