출처 : UX Movement | www.uxmovement.com

원문보기 : https://uxmovement.com/wireframes/how-to-communicate-visual-hierarchy-on-wireframes/​

와이어프레임에서 시각적 계층을 전달하는 방법 

How to Communicate Visual Hierarchy on Wireframes 

색상 사용은 디자인에서 시각적 계층 구조를 전달하는 가장 좋은 방법 중 하나입니다. 하지만 와이어 프레임에서는 최악의 상황 중 하나입니다. 많은 디자이너들은 계층 구조를 전달하기 위해 와이어 프레임에서 색상을 사용해야한다고 생각합니다. 

시각적 무게를 표시하기 위해 색상을 사용하는 경우 최종 디자인의 선명도가 떨어질 수 있습니다.

계층적 선명도를 흐리게하는 색상

다른 모든 것은 흑백이므로 와이어 프레임에서 색상이 지정된 요소의 중요도를 쉽게 확인할 수 있습니다. 그러나 와이어 프레임을 모형으로 변환 할 때 해당 요소의 선명도가 같은지 알 수있는 방법이 없습니다.

실물 크기의 모형에는 다른 색상이 포함되어 있기 때문입니다. 와이어 프레임의 색상 요소가 더 이상 명확하게 나타나지 않습니다. 다른 페이지 요소에도 색상이 있으면 시각적 가중치가 줄어 듭니다.

​

색상 사용의 또 다른 위험은 많은 디자이너가 시각적 계층을 표시하는 기본 방법으로 색상에 의존한다는 것입니다. 

와이어 프레임에서 요소를 색상으로 쉽게 표시 할 수 있습니다. 그러나 시각적 계층이 없으면 얼마나 명확합니까?

디자이너가 다른 계층 적 속성을 무시할 때 색상은 명확성을 위해 버팀목이됩니다. 디자인 부족을 보완하기 위해 색상을 사용하지 마십시오. 

디자인에는 명확한 계층 구조가 없어야합니다.

많은 사이트에 색맹 사용자가 있기 때문에 색을 사용하는 것이 항상 효과적인 것은 아닙니다. 

모든 사용자가 요소의 무게를 명확하게하려면 디자인에 다른 속성이 포함되어야합니다.​ 

....

더보기 : https://uxmovement.com/wireframes/how-to-communicate-visual-hierarchy-on-wireframes/​​