UI 디자인은 사용자 인터페이스(User Interface)를 말한다.
즉, 프로그램을 이용해서 컴퓨터에 내용을 입력하고 명령을 내릴 때 사용자가 눈과 손이 쉽게 움직일 수 있도록 메뉴나 버튼을 배치하는작업이다.

 

홈페이지 제작 시 간혹 이러한 관리자페이지를 디자인해야하는 경우가 있다.
보통 관리자페이지는 웹기획자가 관리자기능 기획 후 스토리보드로 화면설계하여 들어가는데
한 두명의 관리자만 보는 간단한 페이지야 디자인없이 담당 프로그래머가 화면설계만 보고 바로 시스템이 연동되도록 코딩할수도 있지만
거대 쇼핑몰의 SCM같이 복잡하고 사용자들이 많은 경우는 기능이 많이 들어가는 만큼 필연적으로 UI디자인을 하고 웹사이트의 컨셉에 맞춰 전체적인 색깔과 버튼, 아이콘까지도 전부 제작해야한다.

 

가장 좋은 UI디자인은 역시 사용자의 입장에서 사용이 편리한 디자인이 아닐까 싶다.

미(美)를 위한 시각적인 요소보다 이 위치쯤에 당연히 버튼이 있어야 할거라고 생각되는 부분에 버튼을 위치시키는것. 

그러기 위해서는 본인이 제작할 사이트와 유사한 홈페이지를 직접적으로 사용해보면서 편리한점과 불편한점을 실제로 경험해 보는것이 가장 큰 도움이 된다.

 

 

작년에 지마켓과 옥션이 통합되면서 리뉴얼된 ESM plus는 초반에 상단부분이 노란색으로 배치되어 흡사 이마트몰의 분위기가 났으나 본인들도 제작하면서 뭔가를 느꼈는지 몇일 후 바로 변경되어 재밌었던 기억이 있다.

 

 

현재 ESM plus 메인페이지 (지마켓.옥션 판매자 관리페이지)

 

 

판매자들이 가장 많이 사용하게 되는 상품관리 페이지의 UI디자인.

기존 지마켓만을 관리할수있었던 GSM이 옥션의 기능을 추가하면서 사용자 편의를 위해 최대한 노력한 흔적이 보인다. 실재 사용해본 결과 상품등록이나 수정페이지를 3단계로 나누어 넘어가는것만 빼면 기존보다 꽤 편리한 부분이 많다. 현재 중간중간 업데이트도 끊임없이 이루어 지고 있고...

 

 

11번가 SCM메인 페이지

 

 

11번가 상품관리 페이지

 

 

인터파크 SCM메인 페이지

 

 

인터파크 상품관리 페이지

 

 

 

필자가 오픈마켓 및 종합몰까지 거의 10개 사이트를 넘게 사용해본 결과 한 사이트만 제대로 다룰 줄 알면 나머지 사이트는 사용방법이 거의 비슷하기 때문에 처음해보는 작업도 전혀 무리가 없다.

이는 기획자들이 사용자들의 편의를 위해 기존 사이트에서 크게 벗어나지 않는 인터페이스를 제작하기 때문인데 나만의 사이트를 만든답시고 디자인만을 우선시하여 이러한 것들을 무시한다면 결코 좋은 UI디자인이라 볼 수 없는 것이다.

 

그렇지만 웹디자이너로서 매우 큰 회사에 들어가지 않는이상 위와같이 복잡한 관리자 페이지를 만들 경험은 쉽지않다.

보통 개인 쇼핑몰이나 단순한 홈페이지의 회원관리정도의 페이지를 아래와 같이 디자인할때가 많은데 그때 사용되는 버튼이나 유용한 미니 아이콘들을 모아봤다.

 

 

 

포토샵,일러스트,엑셀,파워포인트,한글 등의 미니아이콘들과 수정,삭제,추가,보기,체크박스등의 버튼들인데 간단한 관리자페이지에서는 디자인에 크게 구애받지 않으므로 유용하게 사용할 수 있을 것이다.

 

 

 

관리자페이지.zip

 

 

 

 

 

 
 
 
 
Posted by Y&S