컬러는 소통을 돕는다

iOS 7에서, 컬러는 인터렉티비티를 표시하고, 생기를 주고, 시각적인 연속성을 제공하는 것을 돕는다. 빌트인 앱들은 맑고 깨끗한 컬러 패밀리를 사용하고 있는데, 어두운 배경이나 밝은 배경 위에서, 개별적으로도 근사하게 보이지만 모아놔도 멋지다.

여러개의 커스텀 컬러를 만든다면, 잘 어울리도록 하라. 예를들어, 파스텔 컬러가 당신 앱의 주요한 스타일이라면, 앱 전체에 걸쳐서 사용하는 파스텔 풍의 컬러 패밀리를 만들어야 할 것이다.

다른 컨텍스트에서는 컬러의 콘트라스트에 주의를 기울여라. 예를 들어, 네비게이션 바 배경과 바-버튼의 타이틀간의 콘트라스트가 충분하지 않다면, 사용자가 버튼을 발견하기 어려울 것이다. 첫 번째 원칙은 구별해야 하는 것들 사이에는 최소한 50%의 콘트라스트로 시작하는 것이다. 결과를 야외나 햇볕 좋은 날을 포함해, 여러 다른 조명 상태에서 확인하라.

장치에서 앱이 보여지는 것이 당신이 작업하기 위한 영역의 일부를 찾는데 도움이 될 수 있지만, 신뢰할 수 있는 결과를 내는 더 객관적인 접근을 대신할 수는 없다. 이 접근은 배경과 앱의 색깔의 휘도값 사이의 비율을 정하는 것을 포함한다. 비율을 정하기 위해, 온라인에 콘트라스트 비율 계산기를 사용하거나, 표준 WCAG 2.0에서 확립한 공식을 사용하여 스스로 계산해 볼 수 있다. 이상적인 콘트라스트 비율은 4.5:1이상이다.

커스텀 바 틴트를 이용할 때는 바의 투명함과 앱 콘텐트를 신경써라.브랜드에 있는 컬러 같은, 특정 컬러에 맞춘 바 틴트를 만들어야 한다면, 원하는 결과를 얻을 때까지 다양한 컬러 실험을 해야 할 것이다. 바의 외형은 iOS가 제공하는 투명함과 바 뒤에 있는 앱의 콘텐트의 외형에 영향을 받는다.

색맹을 염두에 두라. 색맹이 있는 사람의 대부분은 빨간색과 녹색을 구별하기 어려워한다. 빨간색과 녹색으로만 상태 변화나 값의 변동을 구별하는 곳이 없는지를 테스트하라 (몇몇 이미지 편집 프로그램은 색맹을 위한 검증 툴을 가지고 있다). 일반적으로, 요소의 인터렉티비티를 알리는 하나 이상의 방식을 이용하는 것이 좋다 (iOS 7에서 인터렉티비티 알리기에 대해서는, Interactive Elements Invite Touch)를 보라.

인터렉티비티와 상태를 표시하는 키 컬러를 선택하라. 빌트인 앱에서의 키 컬러는 Notes에서 노란색, Calendar에서 빨간색이다. 인터렉티비티와 상태를 표시하기 위해 키 컬러를 선택한다면, 앱 안에서 다른 컬러들이 그 컬러와 경쟁하지 않도록 한다.

인터렉티브한 요소와 넌인터렉티브한 요소에 같은 컬러를 사용하지 마라. 컬러는 UI요소가 인터렉티비티를 표시하는 하나의 방법이다. 인터렉티브한 요소와 넌인터렉티브한 요소가 같은 컬러를 사용한다면, 사용자들은 어디를 탭해야 할지 구별하기 어려울 것이다.

컬러는 소통한다. 하지만 항상 당신이 의도하는 대로는 아니다. 모든 사람이 컬러를 다르게 보며, 많은 문화는 컬러에 다른 의미를 부여한다. 다른 국가나 문화권에서 당신의 컬러 사용이 어떤 의미로 받아들여지는지에 대해 시간을 들여서 조사하라. 최대한, 당신의 앱에서의 컬러가 적당한 메세지를 전달할 수 있도록 하라.

대부분의 경우, 컬러로 사용자를 산만하게 하지 마라. 컬러가 당신 앱의 목적이 아니라면, 컬러를 이용해 미세한 향상을 이루도록 하는 게 잘 먹힌다.

텍스트는 항상 읽을 수 있어야 한다

무엇보다, 텍스트는 읽을 수 있어야 한다. 사용자가 당신 앱의 단어를 읽을 수 없다면, 타이포그라피가 얼마나 아름다운지는 상관이 없다. iOS 7 앱에서 다이나믹 타입을 도입하면 당신은 다음을 얻을 수 있다:

• 모든 서체 크기에 대해 자간과 높이에 대한 자동 조정

• Body, Footnote, or Headline과 같은 의미적으로 구분되는 텍스트 블럭에 대한 다른 텍스트 스타일 정의 기능

• 사용자가 설정한 텍스트 사이즈에 맞게 반응하는 텍스트 (엑세서빌리티-손쉬운 사용 텍스트 크기 포함)

다이나믹 타입을 도입하기 위해서 당신이 해야 할 일들이 좀 있다. 텍스트 스타일 사용법을 공부하고 당신의 앱이 사용자가 텍스트 사이즈 세팅을 변경하면 통지를 받도록 해야 한다. “Text Styles” in Text Programming Guide for iOS 을 보라.

텍스트 사이즈 변경에 대응할 때는 우선순위를 정하라. 모든 콘텐트가 사용자에게 중요하진 않다. 사용자가 더 큰 텍스트 사이즈를 선택하는것은, 그들이 읽고 싶어하는 콘텐트를 보다 잘 읽기 위해서이다; 화면위의 모든 단어들이 더 커지길 원하는 게 아니다.

예를 들어, 사용자들이 큰 엑세서빌리티 텍스트 크기를 선택한다면, Mail 앱은 제목과 메세지 본문을 더 큰 크기로 표시하겠지만 덜 중요한 텍스트-날짜와 보낸사람 같은-들은 작은 사이즈로 남겨 둘 것이다.

가능하다면, 사용자가 다른 텍스트 사이즈를 선택하면 레이아웃을 조정하라. 예를 들어, 사용자가 작은 텍스트 크기를 선택하면 본문을 한 컬럼 레이아웃에서 두 컬럼 레이아웃으로 바꾸어야 할 수도 있다. 다른 텍스트 크기에 레이아웃을 맞추기로 결정했다면, 모든 가능한 사이즈에 대해 레이아웃을 변경하는 것보다, 사이즈의 서브셋 - small, medium, large등 - 에 대해 선택하는 것이 좋다.

커스텀 폰트의 모든 스타일이 서로 다른 사이즈에서 읽을 수 있도록 확인하라. 이렇게 하는 한 가지 방법은 다른 텍스트 사이즈들에 대해 iOS가 표시하는 폰트 스타일 방식을 에뮬레이트 하는 것이다, 예를 들어 :

• 사용자가 extra-small 텍스트 사이즈를 선택한다하더라도, 텍스트는 22포인트 이하가 되면 안된다. 비교를 위해 얘기하자면, 디폴트 텍스트-사이즈 설정에서, large 사이즈의 본문 스타일은 34 포인트의 폰트 사이즈를 사용한다.

• 일반적으로, 폰트 사이즈와 리딩(leading)값은 텍스트-사이즈 설정 당 2포인씩 다르다. 여기에 대한 예외는 두가지 캡션 스타일이다. 이건 extra-small, small 그리고 medium설정에 대해 동일한 폰트 사이즈, 리딩, 그리고 트래킹을 사용한다.

• 세종류의작은사이즈에서,트래킹값은상대적으로크다;세종류큰사이즈에서 트래킹 값은 상대적으로 좁다.

• 헤드라인과 본문 스타일은 동일한 폰트 크기를 가진다. 본문 스타일과 구별할 수 있는 방법은, 헤드라인 스타일은 보다 무겁다.

• 네비게이션 컨트롤러의 텍스트는 large 설정에서 본문 스타일과 같은 크기를 가진다(정확히는 17포인트).

• 텍스트는 항상 reguler또는 medium 무게를 가진다; light나 bold는 사용하지 않는다.

일반적으로, 앱 전체에 걸쳐 하나의 폰트를 사용하라. 몇 종류의 폰트를 섞어쓰는 것은 당신의 앱을 산만하고 날림으로 보이게 한다. 그러므로, 하나의 폰트와 몇 개의 스타일과 사이즈를 사용하라. UIFont 의 텍스트 스타일 API를 이용해 헤드라인이나 본문 등 의미적 사용처에 따라 다른 텍스트를 정의한다.

권장함

권장하지 않음