올인원 클라우드 HR시스템의 디자인

" 어떻게 해야 고객은 편리하다고 느낄지 저희는
끊임없이 고민하고 비교하면서 개선하고 있습니다. "

철학까지는 아니지만, 오이사공5240의 디자인에 대한 생각 🧐

필요한 정보를 한번에 보여주자 vs. 시원하게 보여주자.

간격도 넓게하고 정보를 줄이면 시원해보입니다.

반면에 여러 화면을 오가며 보아야 하고 스크롤이 많이 생기고, 페이지도 많아집니다.
처음 볼 때는 시원해 보이니 좋다고 느낄 수 있습니다. 한 두번은 괜찮지만 인사업무를 할 때는 너무 불편해집니다. 여러 화면을 왔다 갔다 해야 하니 정보를 종합적으로 볼 수도 없습니다.

⭕ 저희는 필요한 정보를 가능한 한번에 볼 수 있도록 구성했습니다.

  • slideImg
  • slideImg
  • slideImg

아이콘 버튼은 어디까지?

보내기/임시저장/내게쓰기 등 자주 사용하는 버튼에 대해서 네이버는 텍스트를 그대로 넣어서 버튼을 만듭니다. 반면에 구글은 아이콘 버튼을 사용합니다.

아이콘 버튼이 그럴 듯하지만 텍스트버튼이 더욱 편리할 수 있습니다. 아이콘은 이미지를 보고 이것이 그것이다를 연상해야 하고 때론 암기해야 합니다. 텍스트는 연상할 필요가 없습니다.

HR시스템은 화면에 정보를 많이 보여주어야 합니다. 인사업무를 위한 버튼도 많습니다. 그렇다보니 복잡하다는 느낌을 갖는 고객이 많습니다.

그래서 저희는 텍스트 버튼은 줄이고 자주 쓰는 버튼은 아이콘으로 만들자는 생각을 했습니다. 먼저 늘상 사용하는 조회/입력/복사/저장/업로드/다운로드는 아이콘으로 변경했습니다. 혹시 기억이 나지 않을 수 있으니까 툴팁으로 어떤 용도라는 것을 알게 했습니다.

그래도 인사업무용 버튼이 더 있습니다. 이 부분은  를 넣어서 더볼 수 있게 했습니다. 더보기 버튼은 네이버과 구글 공통이네요. 저희 고객도 이 버튼을 익숙하게 보시지 않을까 싶습니다.

더보기 버튼을 누르면 인사업무용 버튼이 옆으로 나옵니다. 정보를 가리면 안되니까 옆으로 나오게 했습니다. 더보기로 나오는 버튼은 텍스트 버튼입니다. 인사업무는 보편적인 내용이 아니어서 아이콘으로 표시하기 어렵고, 연상도 잘 안되므로 아이콘으로 하면 편리함보다 불편함이 커질 것으로 판단했습니다.

메뉴, 트리구조 말고 다른 방법없을까.

요즘 나오는 프로그램을 보면 메뉴를 중앙에 두거나 상단에 탭으로 처리하는 경우가 많아 지고 있습니다.

그런데 저희는 왼쪽에 트리구조로 둡니다. 저희 시스템의 메뉴는 900 여개입니다. 권한과 역할에 따라 보여주는 메뉴는 1,200 여개까지 됩니다. 이걸 중앙 본문에 둔다면 50페이지 정도가 나올 수 있습니다. 상단 탭으로 두는 것은 상상하기 어렵네요.

  • menu1
  • menu2

제공하는 메뉴와 기능이 매우 작을 때 시원한 메뉴구성을 보여줄 수 있습니다. 저희가 제공하는 메뉴트리는 뜻밖에 이런 장점이 있습니다.

  • 메뉴를 누르고 눌러서 찾아가는 수고를 하지 않아도 됩니다.
  • 실제로 이렇게 즉시 메뉴를 볼 수 있어서 좋다고 느끼는 고객도 많습니다.
  • 인사/조직/근태/급여/평가/교육/복리후생/채용 등에 대한 메뉴의 구조를 파악하기 쉽습니다.
  • HR시스템은 개인정보를 다루기 때문에 권한관리가 매우 중요한데요. 권한을 적용한 메뉴가 바로 적용됩니다.

사용하다 보면 메뉴트리 구조의 장점이 많습니다. 저희는 종합HR시스템입니다. 달랑 출퇴근 관리 등 그많은 인사업무 중 한두개만 제공하는 시스템과 다르다는 점을 말씀드리고 싶네요.