'사용자 경험'에 해당되는 글 2건

  1. 2008.12.31 11 Expert Tips for Enhancing The User Login Process
  2. 2008.08.18 Ajax 개발 시 HTML Design

사용자 로그인 과정을 향상시키기 위한 11가지 전문가 팁


로그인 프로세스에 대한 그리고 회원정보를 받아들이는 프로세스에 대한 연구와 노력을 언제 어디서든지 지금까지도 노력해오고 있는 것 같습니다.

국 내외 수많은 포털 사이트들의 가입절차를 보면 2000년 즈음에 보아왔던 가입절차에 비해서 매우 간소화 되고 로그인을 위한, 개인정보 확인에 대한 절차가 매우 간소화되고 전문화 되었습니다. 

그리고 계속 발전해 나가고 있습니다.  각 나라의 문화의 차이, 사용자들의 행동양식, 시대적 흐름, 기술의 진보에 맞춰 변해가고 있습니다.


Gary Barber 씨는 SitePoint를 통해서 사용자 로그인 프로세스 향상을 위한 전문가적인 11가지 팁을 발표하였습니다.  천천히 읽어 보았지만 시기 적절하게 상당히 좋은 내용인 듯 합니다.

로그인의 부분 기능적, 기술적으로는 매우 작고 간단한 부분이라 생각하여 사용자에게 부족한 경험을 제공되면 그것을 사용하는 사용자들은 사이트의 사용을 꺼리게 되고 잘못된 사용자 경험으로 반복된 일을 계속 해야만 한다거나 헛된 일을 자꾸 하게 되고 사이트는 결국 문을 닫아야 할지도 모릅니다.

로그인 인터렉션은 표면적으로는 매우 간단하지만 사용자 입장에서 봤을 때에는 최종적인 디자인에 있어 고려해야 할 요소는 매우 많습니다.   크게 아래와 같습니다.


보안
이전 사용자 경험
사이트의 전반적인 절차
내부 비즈니스 프로세스
페이지 인터페이스 디자인
사용자의 플랫폼 고려


요약하자면

1. 사용자 명을 위해서 이메일 주소를 사용해라.
2. 안전을 위해서 긴 암호를 사용하도록 해라.
3. 일부 Ajax를 추가해 폼 유효성 체크
4. 로그인 지속 시간을 지정하도록 해라.
5. 텍스트 필드는 가까운 곳에 함께 유지시켜라.
6. 로그인 링크는 상단에 유지시켜라.
7. 로그인 링크는 라벨로 표시해라.
8. 사용자 명 과 비밀번호 찾기 링크는 로그인 실패 시에 표시해라.
9. 도움이 되는 에러 메세지를 표시해라.
10. 사용자 인증을 위한 문항의 사용해라.
11. 페이지의 용량을 작게 유지해라

12. 오픈 아이디는 시간이 지남에 따라 로그인을 위한 주류가 될 수 있지만 현재는 주제 밖의 내용인 것 같다.



원글 : http://www.sitepoint.com/blogs/2008/12/23/11-ways-to-enhance-your-web-application/

신고
Posted by Rhio.kim
사용자 삽입 이미지

<< 일반적인 디자인 패턴 >>

이 그림을 보고 과연 어떤 팁일까?
이해하지 못하시는 분들도 이해하시더라도 보잘것 없어 보일 수도 있겠습니다.
하지만 좀더 깊게 생각해보면 다양한 이점이 숨어있습니다.

위의 그림을 구현하는 것은 매우 간단해 보입니다.
하나의 영역에 로그인 화면과 로그아웃 화면에 함께 표출 되도록 디자인을 하고 display 값을 통해서 로그인 상태, 로그아웃 상태를 볼 수 있음을 의미합니다.

만약 서버 사이드 개발자라면 이런 경우 if문을 통해서 사용자가 로그인한 경우라면 로그인 된 상태의 HTML 소스를 표시하고 그렇지 않는 경우 로그인 할 수 있는 화면 소스를 표시할 것입니다.

그리고 디자이너라면 로그인 된 HTML 파일, 로그인 되지 않는 HTML 파일로 각각 디자인을 처리하는 경우가 많을 것입니다. (꼭 그렇지 않는 경우도 있습니다.)

이런 방식은 Web1.0 방식의 전형적인 방식으로 Ajax 개발 시에는 좀더 웹 표준을 준수하고 사용자의 경험을 존중해줄 수 있는 HTML Design 설계를 해야할 것입니다. 

그에 있어 위의 그림은 기본적인 화면 설계 방법중에 하나일 것입니다.


요약해보면 크게 아래와 같은 이점이 있습니다.

첫째
디자이너와 개발자 모두 하나의 페이지에서 다양한 액션을 프로토타입핑 손쉽게 해볼 수 있습니다.


둘째
하나의 페이지에서 일어나는 액션과 사용자 경험에 대한 것을 모두 담고 있기 때문에 관리할 페이지가 줄어듭니다.  (예를 들어 여러 페이지에 적용되어있던 css가 변경되어질 경우가 불 필요한 작업량이 줄어든다.)


셋째
Ajax/Rich UI 개발자들에게는 엘리먼트의 CSS class name 통해서 원하는 처리를 손쉽게 할 수 있다.



디자이너에게도 Ajax/Rich UI 개발을 위한 기술적인 이해와 사용자 경험(User Experience)에 대한 요구 사항을 디자인 단계에서 부터 적용시켜야 한다는 것입니다.


사용자 삽입 이미지

<< 사용자 경험과 Ajax/Rich UI를 위한 디자인 패턴 >>


로그인 UI에 관한 부분을 위에서 설명한 부분을 추가해 다시 한번 그려 보았습니다.

네모단 박스는 모두 div이고 로그인 실패 알림 영역과 인디케이터 부분까지 표시를 한다는 것
기획자와 디자이너, 퍼블리셔, 디벨로퍼까지 모든 부분에서 사용자 경험(user experience)에 대한 부분에 관심을 갖고 기획하고 디자인을 하고 퍼블리싱을 하고 개발을 해야하지 않을까 생각해봅니다.

각 분야에서 자기만의 업무 분야도 중요하지만... 하나의 본질은 웹 서비스를 사용하는 사용자에게 장애없이 원한할한 서비스로서 만족감을 느끼게 하기 위함이니 늘 서로가 고민해야할 부분인것 같습니다.


신고
Posted by Rhio.kim