안좋은 버튼 레이아웃의 전형적인 예 이건 다음 블로그의 모바일 페이지인데, 매번 댓글을 작성할때마다 껄끄럽다. 취소 버튼과 등록 버튼이 가까이에 붙어있기 때문이다. 등록 버튼을 누를때마다 취소 버튼에 손이 닿지 않을까 긴장하게 만드는 좋지 않은 레이아웃이다. 취소 버튼은 왼쪽 귀퉁이에 붙여놓고, 등록 버튼은 시각의 흐름에 .. UI&사용성 이야기/UI 디테일 2011.08.06
애플 아이패드 음소거 버튼 UX 삽질의 역사 아이패드 다들 써보셨죠? 오늘은 아이패드의 버튼과 관련된 사용성 문제와 그에 따른 애플측의 반응에 대해 이야기 해볼까 합니다. 자.. 우선 애플의 버튼 고집에 대해서 이야기해보죠. 먼저 아이팟터치.. 아이팟터치는 아이폰에서 통화 기능만 제거하고 얇고 싸게 나온 제품입니다. 아이팟 라인업중.. UI&사용성 이야기/UI 디테일 2011.01.14
유튜브의 부실한 화면 설계 최근 올린 아이폰 새 광고 동영상 건으로 소스 복사를 위해 유튜브에 방문했는데, 여러가지 UI 덩어리가 이상하게 배치된걸 확인할 수 있었습니다. 한번 까보죠. 워어. 화면 크네요. 동영상을 넓게 감상할 수 있게 만든 레이아웃입니다. 여기서 주목할 부분은 동영상 컨트롤러의 버튼입니다. 동영상 버.. UI&사용성 이야기/UI 디테일 2010.04.04
혼동을 부르는 중의적인 버튼 텍스트 위는 Adobe Photoshop 플러그인의 하나인 Camera Raw의 업데이트 화면입니다. 늘상 볼 수 있는 설치 전 프로그램 닫아달라는 메시지인데, 여기서 문제는 '종료'라는 버튼입니다. 종료라는것이 중의적인 의미가 담겨있습니다. 설치 프로그램을 종료하느냐, 아니면 문제의 포토샵을 종료하느냐. 당연히 설치 프.. UI&사용성 이야기/UI 디테일 2009.12.16
버튼을 만들 때 지켜야 할 세가지 원칙 좀 지난 페이지지만 저번에 스크린샷 찍어놨던걸 올려본다. 위 그림을 클릭해서 새 창으로 띄워서 확인해보라. 테스트 환경은 파이어폭스3에서 연다음 파이어버그로 소스 조회를 해봤다. (약도보기) 부분에 마우스를 올리면 응당 피드백이 있어야하는데, 내부 소스를 잘못 넣어둔 탓에 피드백이 없다... UI&사용성 이야기/UI 디테일 2009.06.19
사용성 문제 사례 - 올림푸스 코리아 홈페이지 회원가입란 올림푸스 코리아에서 이번에 '유명 드라마 포스터 작가 황영철을 만나다'라는 이벤트를 하길래 솔깃해서 참가 신청을 하려고 했다. 올림푸스 유저와 일반 유저를 따로 받는다는데, 일반 유저는 회원 가입을 해야한다고 한다. 나는 올림푸스 카메라가 없기 때문에 올림푸스 코리아 홈페이지에 회원가입.. UI&사용성 이야기/UI 디테일 2009.03.20
센스있는 버튼 배치 vs 센스없는 버튼 배치 "어려운건 나쁘다"라는 저번 포스팅에서 다음 블로그의 수정 버튼 위치에 대해 지적했는데, 어제 네이버 블로그쪽 살펴보다가 작지만 큰 차이를 하나 발견했다. 위는 다음블로그, 아래는 네이버블로그의 글쓰기 화면이다. 다음 블로그의 등록/취소 버튼 위치와 네이버 블로그의 확인/작성취고 버튼 위.. UI&사용성 이야기/UI 디테일 2008.10.14