'글로벌 인터랙션' 프로젝트 진행을 위한 디자인 제안 과정
01. 와이어 프레임 종류 추가
11주차에 들어, 가장 먼저 한 것은 완성된 와이어 프레임을 기반으로 몇가지 다른 상황의 페이지를 제작해보는 것이었다. 특별히 어려움이 있는 작업은 아니었으므로, '상황'을 가정하고 (특히 다수간 일정 생성에 관한 부분에 중점을 두었다..) 새로 제작할 페이지를 위 포스트잇 내용과 같이 정리한 뒤, 팀원끼리 도맡아 작업한 후 통일성 있게 취합하여 기존 와이어 프레임 도식에 추가했다. 이후로는 전체적으로 앱의 디자인에 관련된 부분에 대해서 더 중점적으로 다루었다.
02. 디자인 레퍼런스 조사
디자인을 하기에 앞서, 앱이 갖고 나아가고 싶은 이미지, 컬러, 방향성에 대해 팀원끼리 논의를 해보기 위하여, 각자가 해당 어플에 갖고 있는 디자인 이미지에 대한 레퍼런스를 조사해 모았다. 이를 한 사람씩 어느 부분이 마음에 들며, 디자인에서 이런 부분을 어떻게 차용했으면 좋겠는지 논의한 후, 투표를 진행해 레퍼런스 이미지를 아래 사진과 같이 추렸다.
레퍼런스의 전체적 이미지 뿐만 아니라, 다소 사소한 부분까지 포함하여 투표했기 때문에 한 눈에 모아놓고 보았을 때는 통일성을 느끼기 쉽지 않았다. 따라서 여기서 이야기 나눈 바를 바탕으로 각자 메인화면을 이용해 디자인 시안을 만들어 오기로 결정했다.
03. 디자인 시안 제작
아래의 총 5장이 팀원 5명이 각자 제작해온 디자인 시안이다. 이를 발표하며 자신이 어떤 부분에서 신경을 썼는지, 어떤 부분을 주목해줬으면 좋겠는지 설명하였고, 설명을 마친 후 모두가 좋았던 부부분에 체크하여 투표를 진행했다.
04. 메인화면 디자인 최종 결정
하단의 사진이 투표를 받았던 디자인 요소들을 모아놓은 화면이다. 이들을 바탕으로 컬러, 폰트 시스템을 정하고, 좋은 점을 취합하여 메인화면 디자인을 최종 결정하기로 했다.
아래가 바로 최종 메인화면 디자인과 컬러 시스템이다.
05. 타 와이어 프레임에 디자인 적용
메인화면의 디자인 스타일이 확실히 정해졌으니, 이후로는 와이어 프레임 페이지에 해당 디자인 스타일을 적용해보는 작업을 진행했다. 과정까지 모두 나타낸 전 화면을 전부 바꾼 것은 아니고, 대표가 되는 기본 화면들을 따와 손보았다. 아래는 디자인 스타일이 적용된 페이지의 이미지들이다. 기능의 섹션 별로 나누어 작업했다.