포트폴리오 리뷰(Arc Diagram)
DataVisualization, Arc Diagram
18.05.18
유니스트(UNIST) 산업디자인과 14학 번들끼리 포트폴리오 리뷰를 하는 시간을 가지었다.
도승헌
관심분야 : UX, Data mining, Data Visualization
개인 포트폴리오 사이트 : http://seungheondoh.com/
1. Project overview
리뷰 프로젝트 :http://xiaoxuezhang.info/works/foodvis.html
이 프로젝트는 음식의 흐름에 대한 시각화 프로젝트이다. xiaoxuezhang 씨는 미국의 농부, 시민 그리고 음식 유통에 참여하는 기업 매니저들을 위한 10개 카테고리에 해당하는 음식과, 그리고 미국에 51개 주에 대한 데이터 시각화 프로젝트를 진행하였다.
Food is highly related to everyone. This visualization is designed to help explore the food flow within the USA. The potential users are farmers, citizens and food managers or officers.
I designed the project and participated in the front-end development.
2. Data set review
데이터셋의 링크를 걸어준 것은 객관성을 올려줘서 좋았다. 그리고 데이터셋의 feature가 무엇인지 알려주어서 좋았다. 옆에 괄호()에는 수치형 데이터인 경우 데이터 도메인(단위), 카테고리형 데이터에는 중복을 제거한 set의 개수를 써넣은 것 같았는데, 일관성이 없어서 아쉬웠다. 보면서 데이터셋의 성격에 따라서 나누면 더 좋지 않았을까 생각했다.
ex) 공간 관련 데이터 - origin State, Transportation Mode / 수치형 데이터 - Value, Ton-million / 카테고리 데이터 - Food
2. Persona
이해관계자의 페르소나를 만들어서, 그들의 데이터와 관련된 니즈를 서술해주었다. 일반적인 페르소나는 인구통계학적 데이터나, 그들의 시나리오를 서술하거나, 맥락에 대한 정보를 쓰는 경우가 많은데, 다 생략하고 그들의 니즈를 바탕으로 가설을 설정해 두었다. 외부인이 프로젝트를 이해하는데 딱 정당한 정보를 제공한 것 같았다. 하지만, Potential Question을 어떻게 도출해 냈는지, 만약 Potential을 증명하기 위해서 어떤 사용자 조사를 했는지 말해주면 더 좋았을 것 같다.
3. Visualization Attempts
데이터를 시각화시키기 위해 차트의 성격 간 비교를 해본 자료는 엄청나게 매력적이었다. 평가 요소는 차트마다 달랐는데 차트 간 평가요소 테이블을 결합해서, 비교했으면 더 좋을 것 같았다. 가로축은 차트들의 성격을 세로축은 평가기준으로 하여 테이블을 만들어서 비교했으면 차트 간의 장단점과 자신의 평가기준에 맞는 차트를 더 잘 보여줄 수 있지 않았을까 생각이 든다.
4. Design Challenges & Solution
필자의 지난 포트폴리오 리뷰를 보신 분이라면 눈치를 채셨겠지만, 필자는 시행착오를 너무 좋아한다. 아직 학생이라 프로젝트의 흐름을 보고 싶은 이유도 있겠지만, 프로젝트 진행 중에 수많은 의사결정이 있는데, 그 과정이 그 사람의 매력을 보는 요소라 생각한다. 팬시한 결과물만 본다면 누가 툴 잘 쓰나 대결이 되지 않을까. 그것은 디자인이라고 생각이 들지 않는다. 툴은 도구고 본질을 더 잘 보여주기 위한 수단이라고 생각하며, 본질을 변화시키는지는 의문이 든다.
이 프로젝트의 챌린지는 10개의 food categories들에 대해 어떻게 컬러 코딩을 할 것인가였다.
Xiaoxuezhang 씨는 의사결정의 기준 중 한 가지는 Color blindness들을 위해 HSB 객체 모델 중 HUE 값과 Brightness 값에 따라 색의 Accessbility를 올리는 것이었다. (RGB나 CMYK 말고도 HSB, LAB컬러 모델도 공부해보면 좋다). Accessibility 에 따른 컬러에 위계를 잡아두고, 중요한 요소에 대해서, 높은 Accessibility에 대한 값을 넣는 것이다.(강조하고 싶은 정보는 전체 정보에 비해 적어야 강조가 되는 것 같다.)
5. Design Application
위 Challenge가 디자인에 적용된 케이스를 보자. 배경이 흰색인 상황(Brightness 가 높고 Saturation이 없다.)에서 Accessibility가 낮은 어두운 파란색과 Hue 값이 없고 Brightness 가 높은 밝은 회색을 사용하여 기저가 되는 정보들을 맨 아래 위계에 배치하고,
그다음 강조하고 싶은 10개의 Food Catrgory에 대해서 Accessibility가 상대적으로 높은 color를 매핑하여 시각화를 시키고 있다.
10개의 Food Category가 아닌 하나의 주에 대한 시각화를 진행할 때는, 주황색을 통해 강조하는데, 연두색의 Luminsoity 값이 높기 때문에 흰색과 결합했을 때 눈의 피로도를 높이는 문제로 인해, 비교적 편안한 주황색을 하이라이팅 색으로 사용한 것 같았다.(이건 제 생각입니다. 아닐 수도 있어요)
너무 멋진 프로젝트였다. 프로젝트 중간중간 문제를 해결하는 방식, 포트폴리오에 노출된 정보의 량, 그리고 마지막 표현한 시각화에 대한 디테일 표현은 정말 배워가고 싶었다. 자신의 의도가 어떤 디자인요소와 함께 사용되었는가를 보여주는 정말 좋은 예시인 것 같다. 의미가 없거나 모른다면 디자인 요소를 함부로 사용하면 안 될 것 같다는 생각이 들었다.
