소상공인 빅데이터 센터 프로젝트를 개발 하고 있습니다. 해당 프로젝트의 기획 및 프론트엔드 개발 범위, 기간등은 다음과 같습니다.
- 기획 기간 : 약 2.5주
- 프로토타입 개발 페이지 수 : PC + Mobile 기준 약 150개 페이지
- 프로토타입 제공 방식 : HTML5, CSS3, JavaScript, Assets(Image, Icon, etc ..)
- 프론트엔드 개발 기간 : 약 4주 예상
- 프론트엔드 개발 범위 : 각 화면 별 페이지 퍼블리싱 및 자바스크립트 구현
벤치마크 : DataUSA
메인 페이지의 레이아웃 및 스타일을 DataUSA를 벤치마킹하여 디자인을 요청받은것이 초기 컨셉이였습니다.
어떻게 하면 데이터 차트를 제공하는 사이트를 직관적이고 이해하기 쉽게 만들 수 있을까?
Look & Feel : 현대와 전통
DataUSA의 한국판 버전인 소상공인 빅데이터 센터를 만드는것에 있어서 한국적인 스타일로 기획하면 좋을것 같다고 생각했습니다, 해외 저작권 무료 사이트에서 가장 트렌디한 이미지들을 선택해 페이지의 느낌에 맞는 이미지로 사용했습니다.
UX : 부드럽고 말랑말랑하게
각 기능들을 페이지로 나누어 많은 페이지 로드를 하는것 보다 팝업이나 버튼들을 통해 페이지 이동을 줄여 특정 인터페이스내 기능을 축소하여 제공하는게 사용자 경험에 있어 효과적이라고 생각합니다.
UI : 단순하고 쉽게
불필요한 디자인(이미지나 아이콘등.. )의 인터페이스들을 최소화 하고 화려한 색의 요소들은 한정하여, 사이트의 디자인이 아닌 컨텐츠에 집중할 수 있으며 동시에 세련된 디자인을 제공하는 인터페이스들을 기획했습니다
또한 모달 팝업등을 통하여 관리 및 설정 기능들을 최소한의 페이지 내로 기획을 하면 사용자 경험이 높아진다고 생각합니다. 짧고 효율적인 작업 동선 기획을 위해 초기 설계에 있어 고민하였습니다.
필요한 기능들을 그룹화 하고 사용자 액션(클릭, 페이지 로드등)들을 최소화하여 보다 단순하고 직관적인 UI를 설계했습니다.
프로토타입 : 사용자 경험과 생산성을 중심으로
Adobe XD 같은 프로토타입 제작툴을 사용하면 생산성이 높아지는것 같습니다. 빠르게 디자인을 설계하고 간단한 애니매이션을 적용하여 실제 결과물에 대해 예측할 수 있습니다.
IA : 구글 스프레드시트로 공유
소상공인 빅데이터 센터를 진행하며 각 페이지 별 기획 및 기능 정리들을 위해 구글 스프레드시트를 사용하였습니다. IA를 작성하여 각각의 세분화된 기능에 대한 명세 및 기능 추가, 수정, 삭제등 유연하게 기획을 관리할 수 있어 프로젝트의 개발 기간을 줄여주며 클라이언트와의 유연한 협업을 할 수 있습니다.
현 프로젝트에 있어 중요한건 상대방이 원하는 수준의 결과물을 이해하고 개발하는것 같습니다, 해당 수준을 이해하면 프로토타입 개발이나 추가적인 기능 추가 혹은 수정에 대해 문제없이 진행될 수 있는것 같습니다
이 프로젝트를 정리하는 차원에서 블로그에 기록합니다.최종 결과물은 지금과 다르게 나오겠지만, 현재 진행중인 과정을 작성하므로써 스스로 부족한 부분을 보강하며 이후 더 나은 결과물을 만들 수 있도록 준비하려고 합니다.