색상 이야기

디자이너로서 색에 대한 고민은 항상 어려운 부분이라고 생각합니다. 하지만 시대가 바뀌어 색에 대한 좋은 샘플을 찾는 것이 어렵지 않고, 조화로운 색 조합을 만드는 색상 툴을 사용하면서 색 사용에 대한 스트레스가 적어졌습니다. 그런데, 오피지지 서비스를 하면서 색에 대한 조화로움과는 또 다른 고민이 생겼는데 그건 바로 게임, 문화, 익숙함에서 오는 색에 대한 인지였습니다. 색 사용이 어렵다고 느낀 가장 큰 중심에는 아래의 3가지가 있었습니다.

Colors on League of Legends

  1. 게임 팀: 블루팀과 레드팀
  2. 승리: 블루 계열, 패배: 레드 계열
  3. 지표 상승 표현: 블루계열, 하락표현: 레드계열

1, 2, 3을 간단하게 표현하면 예제 A 처럼 보일 수 있습니다.

예제 A

게임팀에 블루팀과 레드팀 있는게 뭐가 문제가 될까라고 생각할 수 있지만 1번과 2번을 연계시켜보겠습니다. 만약 블루팀이 패배했다고 가정하면  예제 B처럼 나올 수 있습니다.

예제 B

예제 B를 보면 승패의 색이 팀의 색과 반대로 매치되었을 때의 혼란스러운 느낌은 생각보다 크게 작용합니다. 모든 것이 명확하게 정의되어 표현되었지만 뭔가 한눈에 정보 전달이 되지 않습니다. 한쪽의 텍스트를 없애면 어떨까요? 만약 텍스트가 없다면 사용자는 형태와 색의 의미를 제대로 이해할 수 있을까요?

예제 C

예제 C는 형태가 뭔지 몰라 더 혼란스럽습니다. 그렇다면 예제 D는 어떤가요? 

예제 D

예제 D도 정보 가독성이 아주 좋다고는 얘기하기 어렵지만 시각적인 형태를 최소화하면서 중요한 정보를 전달(승패>팀구분)하는데 집중하고 한눈에 사용자가 원하는 정보를 빠르게 전달하려는 목적에서 정리된 형태라고 볼 수 있습니다. –> 승패 색상에 관련한 자세한 이야기는 OP.GG 사이트 내 컬러 이슈를 읽어보세요.

나라별 색상 인지

팀 이름에 색 이름이 들어가기 때문에 블루팀과 레드팀을 색으로 표현하는 건 어려운 일이 아닙니다. 그리고 이견이 있기 어려운 부분이고요. 그렇다면 승리는 블루계열, 패배는 레드 계열이라 정의하는 건 자연스럽다고 느껴지나요? 참고로 롤 클라이언트에서 승패는 아래와 같이 노출됩니다.

롤을 플레이하는 사람이라면 무의식적으로 승리를 블루계열로 패배를 레드로 보는 것이 어색하지 않습니다.
실제로 북미의 색에 대한 리서치를 해보면 아래와 같이 색을 분류할 수 있다고 합니다.

출처: Communicating color efficiently – red & green

표에서는 Green이라고 쓰여 있는데 블루계열이라 확장시켜도 무리가 없다는 걸 롤 클라이언트의 승리와 패배 색으로 알 수 있습니다. 그러나 위에 표를 보시면 High/Positive가 블루 계열, Low/Negative가 레드 계열로 표시된 걸 보실 수 있습니다.  그렇다면 우리는 여기에 동의할 수 있을까요? 제 머리 속에 가장 먼저 떠오른 건 바로 주식의 등락이였습니다.

한국 증시 from Naver

보이시나요? 상승에 표시되는 레드와 하락으로 표시되는 블루가요. 그렇습니다. 나라마다 아니면 연령대마다 (주식을 하지 않는 사람이라면) 상승과 하락으로 인지되는 색은 충분히 다를 수 있습니다.

미국 증시 from Google Finance

재미있는 건 위의 표에서 보듯이 미국의 증시 색상은 우리와 반대로 표시되고 있습니다. 이 사실을 알게 된 후… 궁금해졌습니다. 과연 어느 나라가 상승을 레드계열로 표시하고 있을지가요.
아래의 표로 각 나라별 주식 등락을 정리해 보았습니다.

나라별 주식 등락

우리나라를 비롯한 일본, 중국, 타이완의 주식 등락이 같은 색을 사용하고 있었습니다. 그럼에도 불구하고 오피지지는 상승/하락을 표시할 때 북미의 규칙을 따르고 있습니다. 이 부분은 제가 입사하기 전부터 적용되었던 디자인이라 정확한 이유를 알 수는 없지만 오피지지가 국내는 물론 글로벌하게 널리 사용되는 서비스이기 때문이 아닌가란 추측을 해 봅니다.

상승과 하락

오피지지에서 상승과 하락이 사용된 부분은 1. 챔피언 분석/매치업의 데이터 등락 표시 2. 챔피언 분석/팁에서 추천 비추천  3. 커뮤니티에서 추천/비추천에서 사용되었습니다. 하지만 그 표시에 대한 의미 해석은 조금 달라서 위에서 언급한 것처럼 매치업의 데이터 등락표시는 북미 기준인 상승이 블루계열, 하락이 레드 계열로 표시되고 있습니다.

오피지지 매치업 평균/지난 패치 대비 등락 표시

반면 챔피언 분석 팁과 커뮤니티의 추천은 레드 계열, 비추천은 블루 계열로 되어 있습니다.  이것은 한국의 지표 상승/하락의 기준 색상이 반영된  건 아니고 비추천이 좋지 않다라는 의미보다는 나와는 의견이 다르다는 인식으로 표현되면 좋겠다는 생각(다르게 말하면 비추천이 나쁜게 아니다)이 적극적으로 반영된 형태입니다. 좋은 의미인 추천에 레드계열을 어떻게 보면 부정적인 비추천에 블루 계열을 사용해 좋지 않은 이미지를 상쇄시켜 보자가 그 의도였습니다. 

오피지지 커뮤니티 추천과 비추천 색상

…. 그러나 지금 생각해 보면 나무만 보고 숲을 보지 못한게 아닌가란 생각도 듭니다. 현재의  커뮤니티 추천/비추천은 일반적인 추천/비추천 형태에 색만 다른 거라 사용자가 뭐지? 색이 다르네라고 이해할 수 밖에 없는게 자연스러운 것 같습니다. 추천/비추천 UI 가 나와 생각이 같다/나와는 생각이 다르다 UI로 표현될 때는 색 뿐만 아니라 형태도 같이 반영됐어야 했다는 생각을 해봅니다. 

국내외 전적 서비스의 전적 색상 사용

색상에 관련된 리서치의 시작은 국내외 롤 전적/챔피언 서비스를 비교 사용해 오면서 시작되었습니다. 오피지지가 인지도도 높고 널리 사용되기는 하지만 많은 경쟁 서비스들이 있기 때문에 리서치를 게을리 할 수 없는 이유도 있구요.

1. www.lolking.net

북미 최대 롤 전적 사이트의 승패 표시

2. www.leagueofgraphs.com

상승 초록, 하락 빨강색을 사용

3. www.matchup.gg

상승 초록, 하락(50% 미만) 빨강색을 사용하는 챔피언 매치업 분석 서비스

3. www.lolprofile.net

오피지지와 흡사한 디자인에 명도를 낮춘 색상을 사용하는 롤프로파일

4. www.loldoc.me

국내 롤 분석 서비스 GGTics, 승: 블루계열, 패: 레드계열

5. www.mobalytics.gg

승리: 블루계열, 패배: 레드 계열을 쓰고 있는 모발리틱스

 

색상관련한 전적을 리서치하면서 가장 인상 깊었던 사이트는 바로 lol.esportsmatrix.com이였는데 중국어 설정일 때와 영문 설정일때 지표 상승/하락 색상을 국가에 맞게 바꿔서 보여주었습니다. (아래 참조)

상단이 영문 설정일 때, 하단은 중국어 설정일 때

실제로 롤 전적 사이트에서 색상을 바꿔서 적용해주는 사이트가 있을까?라고 생각했었는데 적용사례가 있어서 조금 놀랐습니다.  중국은 붉은 색이 좋은 의미로 많이 쓰인다고 들었는데 그 말이 맞는 것 같습니다.

마치며…

색상에 대한 글을 써야지 하는 생각은 국내외 전적 서비스를 리서치 하면서 시작되었습니다. 처음에는

  1. 생각보다 전적 서비스가 많다
  2. 서로 베낀다
  3. 잘 만들기는 어렵다 (모든게 그렇겠지만…)

이렇게 생각했었는데 신기하게도 모든 전적 서비스에서 색상에 관련한 부분에 있어서만은 비슷한 통일성이 있었습니다.  (위의 국내외 전적서비스의 전적 색상 사용 참조) 예를 들면, 강조할 때 킬이나 중요 숫자에는 레드 계열, 승리는 블루 계열 사용으로 상식적이고 색상이 주는 이미지와 어느 정도 맞아 떨어졌습니다. 그런데 지표 상승을 표현하는 부분에 있어서만은 주식 등락 표현때문인지 사람마다 적절하다고 느끼는 색상의 차이가 있었습니다.  그게 신기하리만치 강해서 색상의 문화적 측면이 인지에 대해 미치는 어느 정도일까란 궁금증이 들었습니다.

오피지지에서 색상을 쓰다보면 이 색이 긍정적인 색인지 부정적인 색인지에 대한 생각을 많이 하게 됩니다. 이게 맞는 건가? 색을 조화롭게 써야겠다라는 생각보다는 이 색이 여기에 맞게 쓰인 건가? 빨강색을 예로 들면,

  1. 강조할 때 쓰인다
  2. Death 지수에 쓰이고
  3. 킬 관여율에도 쓰인다

하지만 Death의 경우는 숫자가 높을 수록 좋은게 아닌데 빨강색이다. 킬 관여율은 높을 수록 좋은 건데 빨강색으로 쓴다. 전형적인 강조형태이고 킬, 데스 이런 단어가 피를 연상시켜서 빨강색이 어울린다는 생각도 듭니다. 색상은 어떤 context에 쓰이느냐에 따라 의미가 다르게 해석될 수 있습니다.  숫자가 높아서 좋으니까, 강조해야하니까 빨강, 하지만 동시에 패배의 색으로도 쓰인다는게 아이러니인것 같다는 생각을 해 봅니다.

답글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.