명도를 이용해 컬러 스케일 제작하기
명도대비율만으로도 균등한 값의 컬러 스케일을 추출할 수 있을까?
지금까지 진행한 실험의 목적은 적절한 명도대비율을 가지고 색상값과 상관없이 일관된 명도를 가진 컬러 스케일을 추출하는 것이다. 목적을 달성하기 위해 배경지식으로 명도대비율의 개념과 다양한 컬러 모델, 그리고 각 모델별로 명도를 구하는 공식까지 깊이 파고들었다.
이제 우리는 명도대비율로부터 상대 휘도값을 도출할 수 있으며, 해당 값을 이용해 CIELAB의 L*(명도) 값을 계산할 수 있다. CIELAB은 다른 모델들에 비해 색 공간에서 같은 거리만큼 떨어진 색채가 인간의 눈에 같은 크기만큼의 색 차이로 인지되는 것을 목표로 한다. 균일한 색 체계를 가진 만큼 이 L*값을 이용해 컬러 스케일을 만들면 일관된 명도를 가진 각기 다른 색상의 컬러 스케일을 제작할 수 있을 것이다.
임의의 색상값으로 컬러 스케일 만들기
WCAG의 기준을 충족하는 명도대비율을 대입한 그레이 스케일을 열 단계로 만들었다. 여기서 상대 휘도값을 도출했으며, 이를 다시 CIElab의 L*값으로 변환했다.
명도대비율(Contrast Ratio)을 구하는 공식을 역계산해 상대 휘도값(Relative Luminance)을, 그리고 이를 다시 CIElab의 L*(밝기) 값으로 변환했다.이제 이 L*값을 집어넣을 임의의 색상을 지정할 것이다. CIELab에서 a는 빨강과 초록의 축을 나타낸다. a가 음수이면 초록 쪽으로, 양수이면 빨강/보라 쪽으로 치우친다. b는 노랑과 파랑의 축을 나타낸다. b가 음수이면 파랑, 양수이면 노랑을 나타낸다. 이 값들을 임의로 지정한 다음, 완성된 Lab값을 HEX값으로 변환해 컬러 스케일의 변화를 확인해 보겠다.
초록색 스케일과 노란색 스케일은 50과 100 값에 거의 차이가 없을 뿐, 나머지 200에서 900 사이 명도값은 그레이스케일과 오차범위 내로 비슷했다. 하지만 파란색으로 갈수록 값의 오차가 발생하기 시작했고, 빨간색에서는 밝은 값과 어두운 값의 변화 폭이 줄어들었다. 왜 이런 일이 발생할까?
이는 명도값과 관계없이 a*값과 b*값이 0의 값으로 수렴할수록 채도가 떨어지는 현상과 관련이 있다. a와 b의 범위는 -128에서 127까지이며, 0에 가까울수록 중립적인 색상을 띠게 된다. 그래서 흰색은 lab*값으로 (100,0,0)이 나오게 되고, 검은색은 (0,0,0)이 나오게 되는 것이다. 따라서 10단계로 구성된 컬러 스케일에서 명도의 중간 지점인 다섯 번째와 여섯 번째 컬러를 기준으로 위아래 단계의 컬러는 0으로 점차 수렴하게끔 값을 조절해줘야 한다.
결론
일정 범위까지는 일관된 컬러 스케일을 구현할 수 있었으나, CIElab 모델만으로는 일관된 명도 대비의 컬러 스케일을 완전히 대체하는 데 한계가 있었다. 값을 세밀하게 조정하는 과정은 여전히 필수적이다. 구글이 어떻게 CIElab과 CAM16의 모델을 이용하여 발전된 HCT 컬러 모델을 구현했는지에 대한 자료가 부족해 확인이 어려웠다.
CAM16이나 OKlab과 같이 인간의 시각 정보를 더 정밀하게 반영하는 새로운 모델들이 계속 개발되고 공개되고 있다. 이러한 모델들이 좀 더 상용화되면 디자이너도 명도대비율만으로도 충분히 훌륭한 컬러 스케일을 추출할 수 있는 날이 올 것이다.
