Espaço de cores e iOS
Trabalhando com diferentes espaços de cores em um ambiente iOS
Uma das etapas cruciais no desenvolvimento de um app é sua interface e consequentemente a escolha de cores. Conhecer espaços de cores e o que eles são podem auxiliar o desenvolvedor na escolha de sua paleta de cores, de modo a evitar problemas de inconsistência de reprodução de cores em diferentes displays.
Espaços de cores consistem em grupos limitados de cores capazes de descrever diferentes tonalidades. As telas dos dispositivos atuais, sejam OLED ou LCD, fazem uso de espaço de cores para determinar quais cores são possíveis de representar na tela.
O assunto de espaço de cores é muito amplo e complexo, envolve muito conhecimento de colorimetria e dos mecanismos de uma tela. Este artigo serve de introdução a espaço de cores e seu funcionamento básico no iOS.
Um espaço de cores muito comum é o sRGB que como a maioria deles utiliza o sistema aditivo de cores RGB. O sRGB é um espaço de cor utilizado pela maioria de telas e softwares no mercado. Outro espaço de cores que vem cada vez mais aparecendo nas telas atualmente é o Display P3, que começou a ser suportado nos dispositivos Apple a partir do iPhone 7. Algo que ambos estes espaços de cores tem em comum é que podem ser representados usando o modelo CIELAB, um espaço de cores criado com o intuito de se aproximar ao máximo do espaço de cores visíveis ao ser humano. Foi defino pelo CIE (Commission Internationale de l’Eclairage) uma organização não-governamental focada em desenvolver padrões e difundir conhecimento relacionado a todo os campos ligados à luz, incluindo cores.
iOS e Sketch
No ecossistema Apple, a maioria dos displays são capazes de mostrar cores de ambos espaços de cores, sRGB e Display P3, mas por default o Xcode e iOS utilizam sRGB. Desse modo ao criar apps que terão como plataforma principal o iOS usa-se o espaço de cores sRGB para atingir um maior numero de dispositivos. Caso opte por usar o Display P3 deve manter em mente que algumas cores não irão aparecer em displays capazes apenas de sRGB. É possível modificar o espaço de cores utilizado no Xcode na hora de escolher uma cor, seguindo a imagem a abaixo.
Dentro desse mesmo ecossistema muitos desenvolvedores utilizam o Sketch para a criação de seus designs e mock-ups, por isso é importante saber com quais espaços de cores este software trabalha. O Sketch possui duas opções de espaço de cores: sRGB e DCI-P3. Entretanto, o perfil default utiliza o espaço de cores do sistema MacOS de modo a se adaptar melhor ao arquivo sendo trabalhado. Para saber mais sobre o Sketch e espaço de cores, como também como alterar eles acesse o este link.
Visualizando melhor espaço de cores
O assunto de espaço de cores é daqueles que muitos conhecem de sua existência e até possuem uma breve noção de como funcionam porém é difícil de exemplificar sem a utilização de comparação entre displays e espaço de cores. O video abaixo realizado pelo YouTuber MKBHD demonstra de maneira sucinta a diferença do sRGB e do Display P3.
No video ele mostra a diferença entre o sRGB e o Display P3 na representação de vermelho no smartphone Google Pixel 2 e como de um software para outro as cores podem mudar simplesmente pela opção de espaço de cores. Caso tenha interesse em realizar o teste com seus dispositivos acesse o link.
Por último, se você possui um Mac e ainda está com dificuldades para compreender as diferenças entre espaços de cores recomendo explorar o aplicativo ColorSync Utility do Mac. Este software vem junto ao sistema operacional e possui um comparador de color spaces utilizando modelos 3D.
Caso tenha interesse em aprender mais sobre o assunto de espaço de cores e colorimetria visite o site do CIE e também este artigo.
Em resumo:
- Espaço de cores são grupos de cores especificas que telas conseguem reproduzir.
- Quando o produto final é para telas utilize algum espaço de cores RGB em vez de CMYK. CMYK é utilizado em trabalhos impressos!
- O iOS te auxilia na conversão entre sRGB e Display P3, porém para atingir um maior número de dispositivos crie seus designs em sRGB.
- Não se esqueça de verificar qual espaço de cores o software utiliza para melhor trabalhar cores com ele.
- Na dúvida, vá de sRGB.
