본문 바로가기

전체 글134

소셜미디어 공유버튼 적절히 넣기 1000명 중 2명만 모바일 서비스에서 자체 제공하는 공유 버튼을 사용한다. 그러니 화면도 좁은 폰에 공유 버튼을 넣지 마라. (공유하는 사용자는 브라우저의 공유 기능을 쓰거나 URL을 직접 복사한다) 공유 버튼을 넣으려면; 1. 소셜미디어를 통해 접속한 경우에만 공유 버튼을 표시하라. 2. 그 외의 경우는 넣지 마라. 3. Pc용 사이트에는 언제나 눈에 잘 띄게 넣어라. 4. 버튼 레이블은 명사가 아니라 동사를 써라. https://bigmedium.com/ideas/no-mobile-share-buttons.html 2017. 6. 7.
웹에이전시에서의 퍼블리셔 빈꿈 님의 "웹 퍼블리셔의 역할 - 프론트 앤드 개발자와 차이점"에 덧붙여서. 내가 대학 졸업 후 웹사이트를 만드는 회사에 취직을 한 것이 2000년 1월이다. 당시 웹에이전시에서는 html 코딩만을 별도로 하는 코더를 두고 있는 곳이 없지는 않았으나 드물었던 걸로 기억한다. 그럼 누가 디자인 결과물인 PSD 파일을 Html 문서로 변환했나? 대개는 디자인팀의 신입 디자이너들이 이 역할을 했다. 웹에이전시의 초창기 시니어 디자이너들은 출판, 편집 혹은 멀티미디어(CD롬 등) 디자이너 출신들이 많았다. 당연하겠지? 우리나라 기업 혹은 개인들이 본격적으로 웹사이트라는 걸 만들기 시작한 게 1995년쯤이고, 이전에는 당연히 그걸 직업으로 하는 디자이너가 없었다. 초창기 기업의 웹사이트라는 것이 대개 브로셔 수.. 2015. 12. 10.
회원 탈퇴 오류가 정책인 인터파크 4년 전에 아래 글을 썼다. 질문 내용도 읽지 않는 인터파크 고객센터, 어이 없다 콘서트를 예약하려다가 자리 선택을 할 수 없는 오류가 나서 예약을 못하고 화가 머리 끝까지 나서 탈퇴를 하려고 했었다. 그런데 회원탈퇴마저 오류가 계속 나는 바람에 결국 고객센터에 문의. 그랬더니 이름, 주민번호 등을 보내달라길래, '그래 내가 기어코 탈퇴하고 만다'했다가는 잊어버렸다. 흐흐흐. 무려 4년이 지나, 요즘 한창 받는 휴면계정 전환 메일을 인터파크에서 보냈길래 다시 탈퇴하러 갔다. 4년 전의 일은 까맣게 잊은채. 그러나 여전히 회원탈퇴는 불가능하다. 반복되는 오류. 이 때까지도 4년 전의 일은 여전히 기억못하는 상태. 그래서 다시 고객센터 'SOS메일'(이야 서비스 이름 봐바)에 탈퇴가 안된다고 보냈다. 답변을.. 2015. 8. 3.
XSmall UI에 대한 의견 6~7개 정도의 팟캐스트를 정기적으로 듣는데, 그 중 단 하나의 에피소드도 놓치지 않고 듣는 팟캐스트는 XSFM의 '그것은 알기 싫다(이하 그알싫)'가 유일하다. 2년 가까이 딴지라디오에서 방송을 진행하다가, 얼마 전 갑자기 독립했다. 내부에서는 오랜 기간 논의했을 수도 있지만, 그 사정을 모르는 청취자 입장에선 '갑자기'가 맞다. 어느날 방송에서 '그동안 그것은 알기 싫다를 사랑해주신 여러분 감사합니다' 같은 말이 훅 나왔으니. 방송 접는 줄 알고 얼마나 놀랬던지. 바로 이 그알싫에서 광고에 나오는 상품을 판매하는 쇼핑몰을 준비중이라는 얘기를 하더니 드디어 며칠 전에 오픈했다. 오픈 직후 방문만 했다가 일단 후퇴. (낮에 잠시 들어간거라) 그러다 오늘 퇴근길 지하철에서 방송을 듣다가, 오프닝 도중, 그.. 2014. 12. 11.
아이콘, 그 한 끗 차이의 중요성 페이스북에선가 연결된 링크를 따라 갔다가 아이콘 하나를 봤다. 화면의 글자 크기를 조절할 수 있는 아이콘인데, 보는 순간 잠시 'F? 이게 뭐지?' 했다가 아이콘 세 개를 순서대로 모두 본 뒤에야 의미를 깨달았다. 위 스크린샷에서 제목 아래 F 세 개가 바로 그 아이콘이다. 아마도 Font에서 F를 따왔겠지, 하고 짐작은 하지만 왜 하필 그랬을까? 그냥 '가' 혹은 굳이 영어로 써야겠다면 'A'가 쉽게 알아보지 않았을까? 2014. 3. 29.
시각장애인의 인터넷 사용에 관한 8가지 미신 프론트엔드 개발자가 일주일간 눈을 가린채 시각장애인이 인터넷을 쓰는 방법대로 써본 결과 알아낸, 시각장애인의 인터넷 사용에 관한 8가지 미신. 원문은 "8 Myths About How Blind People Use the Internet" 미신 1. 스크린리더는 링크 타이틀 텍스트를 읽는다 실제론 전혀 읽지 않더라고. HTML전문가인 제프리 젤드맨(Jeffrey Zeldman)에게 link title text를 써야하는 이유가 있냐고 물었더니 "아뇨! 쓰지마세요(No! Do not use)"라고 답변했다. 미신 2. 시각장애인은 텍스트 전용 브라우저를 사용한다.스크린리더는 웹브라우저를 위한 제품이 아니라 컴퓨터에 설치된 모든 어플리케이션에 대응하며, 따라서 시각장애인도 비장애인이 사용하는 것과 동일한 브.. 2013. 2. 7.
웹사이트 사용성 테스트를 개선할 수 있는 몇 가지 포인트 Smashing Magazine에 좋은 컬럼이 있어서 번역. 작년에 이 회사 직원들 사진과 소개글을 본 적이 있는데, 멤버들의 이력이 정말 다국적. 가령 프랑스에서 태어나 예멘에서 자라서 미국에서 학교를 다니고, 뭐 이런 식. 원문은 "Improving your website usability tests" 사용성 테스트 개선하기 내가 사용성 테스트를 시작하던 때에 했던 한 테스트에서 마우스를 쓸 줄 모르는 사랑스러운 할머님을 만난 적이 있다. 할머니는 커서를 다독이는 말을 하면서, 마우스를 계속 공중에 들어올려 화면을 가리켰다. 테스트를 끝내고도 아무것도 건진 것이 없긴 했지만, 그 할머니는 나를 손녀에게 소개시켜줄 "사랑스러운 소년"이라 생각했다. 참가자를 모집하는 명확한 기준을 세우는 것이 중요하다는.. 2013. 1. 13.
멋진 스케치를 하는 방법 스케치의 중요성에 대한 글을 번역하고보니 예전에 팀 내에 공유했던 글이 떠올랐다. 아이디어를 구체화할 때 스케치를 하는 이유와 하는 방법에 대해 적은 글이네요. 몇 가지 메시지만 요약하자면, 1. 스케치와 드로잉은 다르다. 스케치는 아이디어를 효과적으로 다른 사람에게 전달하기 위한 수단이다.2. 연한 색 마커로 기본 바탕을 그리고, 그 위에 짙은 색 마커나 펜으로 세부사항을 덧붙여나가라.3. 긴 선을 그릴 때는 팔꿈치를 사용하지 말고 어깨 전체를 움직여서 선을 그어라. 출발 부분과 끝 부분에 점을 찍고 두 개를 이으면 직선을 긋는데 도움이 된다.4. 팝업이나 레이어 창은 포스트잇을 이용해서 표현하라. (메시지보다 포스트잇이 크면 잘라내라)5. 한 부분을 여러 방법으로 스케치하거나, 특정 부분만 추가하려고.. 2013. 1. 8.
화면설계(Wireframe)이전에 스케치를 먼저 하는 것이 중요한 이유 이 글은 UX Movement가 선정한 2012년 UX 컬럼 Best 5 중 "Why it's important to sketch before you wireframe"을 한글로 번역한 것입니다. 왜 화면설계 이전에 스케치를 먼저 하는 것이 중요한가. 웹사이트 혹은 어플리케이션에 대한 아이디어를 떠올려본 적이 있는가? 아이디어를 생각해내는 것은 쉽지만, 정작 어려운 부분은 그 아이디어가 어떻게 사용자 인터페이스로 자리잡을지를 이해하는 것이다. 바로 이 지점에 스케치가 유용하다. 스케치는 창의성과 건설과 연관있는 많은 직업에서 이뤄진다. 심지어 레오나르도 다빈치도 그의 발명품을 만들기 전에 스케치를 했다. 당신이 얼마나 똑똑하든지 간에 머리 속에 있는 단순한 아이디어를 정리하지 않고 바로 구현하는 것은 불.. 2013. 1. 8.

티스토리툴바