총무앱 - 디자인

솔직히 말해 대학생 시절에는 디자인을 무시했었다. 그때의 난 디자이너들이 공학자들이 힘들게 만들어 둔 기술위에 숟가락을 올리는 일을 한다고 생각했다. 핸드폰이나 티비의 디자인 정도는 나같은 일반인들도 손쉽게 할 수 있을 것 같은데 디자이너들은 쓸데없이 굴리는 영어 발음과 패션 스타일로 폼 잡는다고 생각했다. 공대생들에게 가야할 노고가 디자이너들에게 뺏긴 것 같아 못마땅한 기분도 들었다.

하지만 이 편견은 회사에 들어와서 일차적으로 깨졌다. 내가 만든 피피티는 디자이너들의 손을 하루만 거치면 놀랍게 변해 있었다. 내가 대강 만들어둔 그림을 아름답게 바꿀 뿐만 아니라 발표에서 내가 강조하려고 했던 단어와 문장들을 정확히 캐치해 보는 가장 강렬하게 인상을 줄 수 있는 곳에 배치해뒀다. 피피티뿐만 아니라 제품을 보는 관점도 달랐다. 내가 만든 기능들을 디자이너들은 사용자가 어려움을 겪지 않고 사용 할 수 있도록 변형해주었다. 이 과정은 전혀 숟가락을 올리는 일이 아니었다. 오히려 디자이너가 없었으면 공들여 만든 기술이 모두 허공이 될 판이었다.

그리고 이 앱을 직접 만들면서 이제 뼈저리게 알게됐다. 아마 디자인 하는 작업이 개발하는 작업보다 1.5배는 더 오래 소요됐을것이다. 사용자가 편하게 앱을 사용 할 수 있도록 디자인 하는 것은 생각보다 매우매우 어려운 일이었다. 개발은 궁금한 점을 검색해보면 모두 나오는데 디자인은 인터넷에 '어떻게 편리하게 사용 할 수 있을까'라고 물어볼 수도 없고 아무런 기초 지식이 없는 상태라 그런지 참 답답했다. 거의 모든 순간들이 고민의 연속이었다. 어떤 아이콘을 사용해야 할지 그리 어떻게 배치해야할지, 어떤 텍스트가 손쉽게 사용자가 이해 할 수 있을지 그리고 어떤 레이아웃이 안정감이 있을지를 놓고 한참을 고민했다. 아마 회사에서 짧은 짬이 날때는 모두 볼펜으로 낙서해가며 작업을 했던 것 같다. 뿐만아니라 다른 애플리케이션은 어떻게 디자인 되어 있는지 참고도 해보고 주변 사람들에게 피드백도 받았다. 만족스럽지는 않지만 그래도 봐줄 만한 정도는 된 것 같다.

전체적인 디자인 플로우는 이렇다.

1. 앱 실행시 짧게 보여주는 스크린. 카카오톡이나 네이버 실행할 때 애플리케이션 마크가 나오는걸 생각하면 된다. 있으면 좀더 fancy해보이지 않을까 해서 만들어 넣어봤다. 가운데 있는 아이콘은(조커 얼굴에 계산기랑 돈다발이 있는) iconflows라는 에디터를 이용해서 만든거다. 시중에 무료로 배포된 아이콘을 사용해서 만들려고 했는데 아이콘에 윤기가 없는 느낌이라 직접 5000원 결제하고 에디터를 이용해서 만들었다. 나름 귀여운 아이콘인것 같다 ㅎㅎ

2. 모임 목록 부분. 총무인 사람이 자신이 관리하고 있는 모임들의 목록을 관리하는 인터페이스다. 오른쪽 아래 버튼을 이용해 간단히 추가 할 수 있다. 만들고 나니 카카오톡 친구 목록 인터페이스랑 비슷하다. 사용자들에게 가장 친숙한 인터페이스인것 같다.

      

3. 파티별 결제내역/대리결제자/정산하기 디자인. 이부분은 이 애플리케이션의 가장 핵심인 부분이라 사용자가 별다른 어려움을 겪지 않고 사용할 수 있도록 많은 고심을 들였던 부분이다. 특히 여기서 정산하기 탭을 만들 때 어려움이 많았다. 하나의 화면에 결제 내역 반올림 하는 인터페이스와 정산 기능 그리고 은행 계좌를 설정하는 것을 모두 표현해야 했는데, 사용자에게 정보를 많이 주려고하니 텍스트가 많아져 애플리케이션이 아마추어 같아졌고 또 정보를 전혀 안주자니 사용하기 불편해지는 것 같았다. 아래 그림은 가장 초기버전이다.

크게 결제내역 조정 레이아웃, 정산내역 레이아웃, 입금계좌 레이아웃 세개로 나눠져 있는데 경계선이 없으니 안정감이 없었고 텍스트가 지나치게 많아서 지저분한 느낌이었다. 그리고 위의 화살표는 반올림 조정 버튼이었는데 따로 설명이 없다면 전혀 이미지가 반올림을 표현하지 못하고 있었다. 일단 각 레리아웃별로 경계선을 넣었다. 텍스트를 최대한 없애기위해 정산해보기와 계좌의 텍스트는 없애버리고 Dialog로 보여주는 것으로 바꿨다. 그리고 반올림 버튼은 0의자리, 1의자리, 10의자리별 이미지를 다르게해서 각자리별 반올림을 표현했다. 이것도 만족스럽진 않지만 그래도 이전보다는 직관적인 느낌이다.

    

정산 결과와 입금계좌 설정하는 다이얼로그. 텍스트를 다이얼로그로 빼버렸다. 다이얼로그까지 이쁘게 만들고 싶은데 이건 어떻게 해야할지 감이 안온다. 일단 먼저 앱스토어에 출시하고 업데이트를 해볼 생각이다.