Projetando em uma tela Retina: meus pensamentos sobre o Retina MacBook Pro

220, 5 pixels por polegada: 2.800 de largura e 1.800 de altura, totalizando mais de cinco milhões de pixels. Essa é a tela em que trabalho agora, em período integral. Isso gera muitas perguntas: a Apple tem algum negócio fazendo essa tela? Ajudará ou dificultará o setor? Você pode realmente fazer o trabalho de design nessa coisa se estiver projetando para telas sem retina?

Hoje vou contar tudo sobre a minha experiência com a máquina que ameaça mudar a maneira como você faz seu trabalho. Não vou segurar nada enquanto delirar sobre o que amo e reclamar sobre o que me deixa louco. Leia junto e veja se você concorda com minhas conclusões.

Explore o Envato Elements

Dang You Apple

Na última década, nós, designers, nos concentramos em como lidar com uma grande mudança de paradigma na forma de tamanhos de tela sempre variáveis. Esse desafio nos levou ao extremo, mas nos trouxe do outro lado melhores designers, capazes de obter feitos impressionantes de sites verdadeiramente flexíveis, com ótima aparência em qualquer tamanho de tela.

O Mediaqueri.es mostra um design responsivo da web que fica ótimo em qualquer lugar.

Embora tivéssemos nossa atenção focada em uma grande mudança de paradigma, outra nos ocorreu: a resolução. O momento por trás dessa mudança veio recentemente da Apple, com seus monitores de qualidade "retina", agora presentes no iPhone, iPod Touch, iPad e MacBook Pro, com o iMac e o MacBook Air sem dúvida a seguir algum tempo nos próximos dois anos. .

A Apple pode não ser o primeiro ou o único fabricante de eletrônicos a exibir telas de alta resolução, nem é quase sempre o primeiro a alguma coisa. No entanto, gostemos ou não, eles historicamente marcaram a adoção generalizada das principais mudanças tecnológicas (esta é a parte em que você pula tudo o que digo para que você possa reclamar sobre o quanto isso não é verdade nos comentários).

Assim como na revolução do tamanho da tela, isso oferece aos designers uma enorme mudança de paradigma que muda tudo. Esse obstáculo pode ser ainda mais difícil de superar do que o anterior e requer nossa atenção e especulação imediatas. Em março, publiquei uma discussão sobre esse mesmo tópico.

Desde então, comprei o Retina MacBook Pro, a máquina que quebrou a tela da retina de seu belo jardim murado com iOS e para o reino de algo que pessoas de todos os tipos de profissões usarão para trabalhar. Depois de semanas trabalhando na máquina em tempo integral, pensei que seria apropriado compartilhar minhas experiências com você.

As telas de retina devem existir?

“Quando vemos telas de alta densidade cada vez maiores, começo a questionar, por quê? Só porque nós podemos? - John Carey
Sombras de cinquenta pés

Ultimamente, li vários artigos de criativos que estão realmente bravos com a Apple por empurrar o setor por um caminho tão problemático. Como Ian Malcom castigando John Hammond por sua decisão precipitada de trazer dinossauros de volta dos mortos, esses críticos insistem que só porque a Apple pode fazer uma tela dessas, não significa que eles deveriam .

Um dia com a tela da retina me convenceu de que os críticos estão errados. É tão bonito. Eu mal aguento mais olhar para o meu MacBook antigo. Meus olhos se abriram e, de repente, a mesma tela com a qual eu nunca tive problemas, parecia completamente escura e lamacenta.

Deveríamos ter parado no videocassete?

A única maneira de realmente apreciar como é isso sem experimentar por si mesmo é encontrar uma televisão CRT antiga e conectá-la a um videocassete para que você possa assistir a um filme. Sério, vá tentar. Em segundos, você se perguntará como, no mundo, alguma vez conseguiu suportar uma experiência visual tão ruim. Dez minutos disso e você agradecerá aos deuses da tecnologia diariamente pelo todo-poderoso Blu-ray.

Foi doloroso mudar de fita VHS, mas olhando para trás agora, valeu a pena.

Com a perspectiva que temos agora, olhando para trás, tanto os clientes quanto os produtores da indústria cinematográfica estão em melhor situação por terem deixado para trás a fita VHS como o principal método de reprodução e distribuição de vídeo. A revolução foi inconveniente para todos os envolvidos? Absolutamente.

Os criadores de conteúdo tiveram que aprender, adotar e até desenvolver novas maneiras de fazer as coisas. Os clientes tiveram que abandonar equipamentos antigos e um monte de conteúdo, fazer novas compras que pareciam redundantes com as anteriores, aprender novos jargões; foi uma bagunça. E isso só os levou ao estágio de DVD, muitos ainda estão no meio do salto para o Blu-ray ou talvez para uma solução puramente digital, como o iTunes e a Apple TV.

“Os avanços não se baseiam em incomodar ou não alguém. Especialmente quando a Apple está no banco do motorista.

A chegada da computação de alta resolução apresenta os mesmos problemas, tanto para consumidores quanto para criadores de conteúdo. Infelizmente, é assim que a indústria de tecnologia funciona. Avanços são feitos quando há um mercado para eles e o conhecimento tecnológico está presente para produzir um resultado de qualidade que os consumidores podem pagar. Eles não se baseiam em incomodar ou não alguém. Especialmente quando a Apple está no banco do motorista.

E isso é uma coisa boa. Claro, pode não parecer, mas lembre-se de que, uma vez, os monitores de computador possuíam apenas um punhado de cores e você pode apostar que havia pessoas no setor na época que insistiam em não ir mais longe. Tenho certeza que você está feliz que eles o fizeram, então pare de ser uma das pessoas que são arrastadas para o progresso e tente atacar os desafios de frente e contribuir com algo valioso para a conversa.

Como viver e trabalhar em um MacBook Pro Retina

"Eu sabia que haveria alguns problemas, e existem."

A existência ou não de telas de retina no mercado convencional é realmente uma discussão irrelevante. Eles fazem, e você tem duas opções: adaptar ou morrer. Como um ex-designer somente de impressão, eu enfrentei essa escolha, os desenvolvedores de Flash estão atualmente enfrentando essa opção, você também pode ingressar no clube.

Eu sou toda sobre adaptação, então eu peguei a rota dos adotantes iniciais e pulei neste trem antes de ter alguma idéia para onde estava indo. Deixei para trás o meu MacBook de 13 ″ de 2007 e comprei um novo e brilhante Retina MacBook Pro de 15 ″.

Eu sabia que haveria alguns problemas, e existem. Alguns daqueles com quem eu estava preocupado acabaram não sendo grande coisa, outros com os quais eu não contava se esconderam e me atormentaram de frustração.

Mil Chapéus

Em qualquer dia, uso vários chapéus metafóricos. Sou designer, escritor, fotógrafo, navegador, observador de filmes; O que você disser.

Por causa disso, posso oferecer uma visão de muitas experiências diferentes do ponto de vista da tela da retina. A única coisa que eu reconhecidamente não é um jogador. Eu cresci ligado a um controle da Nintendo e nunca tive interesse em jogos para PC, então você terá que perguntar em outro lugar se você está procurando informações sobre essa área.

Aqui estão algumas das principais categorias de uso diário e meus pensamentos sobre cada uma.

Uso geral do SO

Atualmente, estou executando o OS X Lion e parece 99% atualizado para gráficos de retina. De vez em quando eu pego o local de um botão que parece pixelizado, mas apenas em utilitários profundamente enterrados que poucos usam de qualquer maneira.

Na maioria das vezes, é aqui que a tela brilha. Tudo parece absolutamente deslumbrante. A Apple não apenas atualizou o sistema principal, mas a maioria de seus aplicativos, como o iMovie.

Aplicativos de terceiros

Essa área era preocupante quando comprei a máquina, mas acabou sendo um problema menos significativo do que eu pensava.

Muitos dos meus aplicativos favoritos, como o Sublime Text 2, pareceram difíceis no início, mas já receberam atualizações de retina que os tornam melhores do que nunca.

É verdade que a maioria dos aplicativos ainda não foi atualizada, mas apesar de ser um viciado em aplicativos, não existem muitos aplicativos que eu uso diariamente. Com a exclusão do CS6, que discutiremos mais adiante, o único aplicativo que eu uso todos os dias que realmente me incomoda é o Twitter para Mac.

Este aplicativo realmente mostra a maldade de gráficos que não são da retina em uma tela de retina. Curiosamente, texto editável ao vivo e editável como o que ocorre na janela "novo tweet" parece bom, mas todo o seu fluxo é hediondo, do texto aos avatares.

Navegação na Web

“São as pequenas imagens que parecem ruins. O pequeno logotipo JPG no topo do site, a captura de tela da interface ... ”

A navegação na Web realmente me assustou. Eu sabia muito bem que a web é um mundo de baixa resolução e apontar uma tela de retina de 15 polegadas para ela é como tirar uma lupa para uma foto com baixo DPI.

Para minha surpresa, nos preparamos para essa revolução notavelmente bem, mesmo que completamente por acidente. Em nossa obsessão em economizar largura de banda criando gráficos da Web sem imagens, na verdade estávamos construindo uma Web infinitamente escalável.

Atualmente, a maioria das interfaces de usuário é criada com bons e antigos HTML, CSS e JavaScript. Jogar uma tela de retina nesses gráficos só os faz parecer melhores! Para o registro, certamente não se pode dizer o mesmo dos sites em Flash.

O verdadeiro problema, é claro, está nas imagens. Curiosamente, a maior parte da minha navegação na web passa sem uma única carranca, e eu sou um louco por resolução.

As fotografias profissionais tendem a ter uma ótima aparência. Navegue até o Flickr ou 500px e você encontrará a experiência mais agradável do que nunca, talvez ainda mais.

São as pequenas imagens que parecem ruins. O minúsculo logotipo JPG na parte superior do site, a captura de tela da interface, eles realmente não têm muita informação para trabalhar com duplicação de pixels e, portanto, parecem bastante deploráveis.

Filmes e programas de TV

O Retina MacBook Pro descartou sua unidade óptica como o MacBook Air, então obviamente eu não tive nenhuma experiência com DVDs, mas na maioria dos casos, os vídeos são como imagens. A aparência ótima fica melhor e a aparência ruim fica pior.

Os filmes em HD baixados digitalmente brilham na tela enquanto a transmissão ao vivo do Netflix / Hulu parece visivelmente irregular. Felizmente, a distância em que normalmente assisto a um programa está muito mais longe do que onde trabalho, portanto, quaisquer problemas de resolução geralmente não são tão perceptíveis.

Fotografia

Como eu fotografo com uma Canon 5D Mk II, minhas fotos são boas e grandes. Eles ficam ótimos na tela da retina e não tive problemas com o zoom e a edição de detalhes. O único problema real é que o software (Photoshop e Lightroom) ainda não foi embelezado pela retina, mesmo no CS6.

Escrita

Do ponto de vista da escrita pura, a tela da retina é surpreendentemente boa. Tipografia a 220 pixels por polegada é uma coisa bonita. Pego o Writeroom, alterno para o modo de tela cheia e bloqueio o mundo.

Depois de algumas horas, é fácil esquecer como é bom o tipo. No entanto, segundos depois de exibir um documento de texto em uma tela de baixa resolução, tudo o que vejo são pixels. Pixels sujos e feios.

O tipo também não parece bom no comprimento do braço. Eu posso colocar meu rosto o mais próximo da tela que meus olhos podem aguentar e o tipo ainda parece grudento.

A tipografia é lindamente nítida na tela da retina.

Photoshop, Design e Imagens

Agora vem a parte que você realmente quer ouvir: como é o Photoshop? Você pode desenhar nessa coisa?

Os designers do iOS devem achar útil

Começarei dizendo que não sou designer de iOS. Esses caras foram forçados a projetar gráficos de retina em telas sem retina até agora e imagino que estejam ansiosos para fazer a troca.

Eu tenho o problema oposto: projetar gráficos que não sejam retina em uma tela retina. Você pode não esperar que seja uma dor, mas, para ser sincero, realmente é.

Isso ocorre porque você perde todo o conceito de resolução quando está na faixa de ppi mais baixa. Posso ignorar pequenas imagens irregulares quando estou navegando, mas quando estou na cadeira do criador, meu cérebro examina todos os pixels.

O trabalho artístico dobrado pixel suga

"Para ter uma idéia adequada de se a obra de arte está ou não em pé de igualdade, eu preciso dar uma olhada na minha tela antiga."

Na tela da retina, tudo o que eu crio ou importo no Photoshop em uma resolução padrão da Web parece uma porcaria. Mesmo que eu crie algo em vetor, a menos que esteja disposto a exportá-lo como SVG, e na maioria das vezes isso ainda não é uma opção, ainda será possível obter saída para um minúsculo JPG ou PNG com uma aparência super pixelizada, porque minha tela tenta dobrar sua resolução.

Isso apresenta muitos problemas complicados, tanto quando estou trabalhando com minha própria arte quanto na de outras pessoas. Para meu próprio trabalho artístico, devo construí-lo em baixa resolução? Fazer isso prejudica minha capacidade de julgar sua clareza. Ou devo construí-lo em alta resolução e reduzi-lo para fora? Não tenho certeza se você notou, mas o Photoshop pode realmente destruir as obras de arte de varredura ao dimensionar.

Também é um problema quando estou usando obras de arte de outra pessoa. Se você é um designer, provavelmente recebe obras de arte de terceiros com baixa qualidade e pixelizadas. Consequentemente, você optará por exigir um melhor trabalho artístico para ignorá-lo.

Para mim, isso é muito mais difícil, porque à primeira vista, sempre ficará ruim na tela da retina, a menos que seja enorme. Para ter uma idéia adequada de se a obra de arte está ou não em pé de igualdade, preciso examiná-la na minha tela antiga.

Screenshots

"De repente, as capturas de tela que eu tiro são o dobro do tamanho que eu pretendia!"

Dado o fato de eu blogar para viver, acho seguro dizer que tiro mais capturas de tela do que as pessoas comuns. Estou sempre trabalhando com capturas de tela de uma interface de aplicativo ou site e incluindo-as em postagens.

A tela da retina me atingiu com uma bola curva malvada aqui. De repente, as capturas de tela que tiro são o dobro do tamanho que eu pretendia! Quando redimensionadas, as capturas de tela da interface do usuário, com seus gráficos de varredura e texto minúsculo, parecem realmente desagradáveis ​​em qualquer tela, então eu sempre tento usá-las a 100% quando possível.

Com a tela retina, o que costumava ser uma captura de tela com 510 pixels de largura (o tamanho da imagem padrão do Design Shack) agora tem 1.020 pixels de largura. Se eu ignorar completamente os usuários da retina e fingir que eles não existem, a lógica diz que eu deveria exibir imagens com 510px de largura, o que significa que eu tenho que redimensioná-las manualmente no Photoshop e tolerar o fato de que elas parecem apenas atropelado por um caminhão, principalmente quando se trata de texto rasterizado.

Lembre-se, é claro que eles me parecem piores do que a maioria dos usuários porque, você adivinhou, estou em uma tela de retina.

Mude sua resolução estúpido

Apresentei meu dilema de captura de tela a algumas pessoas diferentes e todas disseram a mesma coisa: basta alterar sua resolução! Parece uma solução perfeitamente viável, mas acontece que não é tão simples assim.

O Retina MacBook Pro vem com cinco configurações diferentes de resolução. Eis o que acontece se eu escolher duas resoluções diferentes, tirar uma captura de tela da mesma janela exata e colá-las uma ao lado da outra no Photoshop.

Como você pode ver, eles saem exatamente do mesmo tamanho. Alterar a resolução nas Preferências do sistema afeta o tamanho geral da captura de tela total, mas na maioria das vezes os elementos na captura de tela permanecem inalterados.

Para o registro, eis o quanto dessa janela eu posso caber em um documento de 510 pixels de tamanho máximo:

Se você apenas amaldiçoou, sua reação foi perfeita.

Trabalhando em uma tela nítida e brilhante

"Passar metade do dia pulando entre uma tela retina e não retina literalmente me fez sentir enjoado!"

No meu antigo MacBook, eu normalmente trabalhava com brilho total. Eu li toneladas de coisas sobre a duração da bateria, fadiga ocular e outros enfeites, mas nunca gostei da aparência, a menos que o brilho fosse acionado.

Nesta nova tela, o brilho total é absolutamente brilhante demais para a maioria dos cenários de iluminação. Tela de retina? Mais como tela de queima de retina. Isso é ótimo, porém, prefiro ter uma tela muito clara e que precise ser desligada.

Curiosamente, notei algumas dores de cabeça ocasionais desde a troca. A tela é tão brilhante e nítida que você acha que é mais fácil para os olhos, mas pode haver um ponto em que ela vai longe demais e causa mais cansaço visual do que economiza. Enquanto eu mantiver o brilho sob controle, não acho que esse seja um problema importante a longo prazo.

A nitidez da tela era realmente apenas um problema no primeiro dia, quando eu estava transferindo tudo da máquina antiga para a nova. Passar metade do dia pulando entre uma tela retina e não retina literalmente me fez sentir enjoado!

Dores de crescimento

“Com a nova tecnologia, surgem novos desafios e os primeiros usuários, como eu, são os que pagam o preço”

Então, aí está, minha lista completa de elogios e reclamações sobre o meu novo Retina MacBook Pro. Intencionalmente, este artigo está focado nos desafios de trabalhar em uma tela de retina mais do que nos benefícios. Se estou sendo completamente honesto, os benefícios me impressionam e não me arrependo nem um pouco da minha compra. Eu absolutamente amo este computador e não hesitarei em dizer que é o melhor que já usei.

Todas as lutas que listei acima são apenas dores crescentes. Com a nova tecnologia, surgem novos desafios e os primeiros adotantes como eu são os que pagam o preço (em sentido figurado e literal) em troca de possuir brinquedos novos e brilhantes que ninguém mais possui.

Anos depois, quando todos os novos computadores atingem 220ppi e têm unidades de estado sólido como componentes padrão, o preço dessa tecnologia será muito mais acessível e as penalidades por usá-la quase inexistentes.

Comparação de resolução de tela de computador de The Verge

Quase todas as reclamações listadas acima se resumem ao fato de eu possuir um computador com uma tela de resolução mais alta do que as pessoas para as quais estou projetando. Quando estivermos todos na mesma página, tudo será dramaticamente simplificado.

No entanto, direi que possuir um dispositivo com uma tela de qualidade da retina pode aumentar seu senso de urgência para o problema de imagem que agora enfrentamos na web. Você deseja que os usuários da retina tenham imagens bonitas, mas vale a pena o tempo de carregamento atingido por usuários que não são da retina? Felizmente, estão surgindo algumas soluções realmente impressionantes, como o Retina.js, que facilitarão esse problema.

Ainda assim, um futuro próximo em que precisamos criar e enviar o dobro das imagens com as quais costumávamos não é exatamente algo para se animar, é?

O que você acha?

Felizmente, esse enorme discurso não era uma pilha completa de bobagens. Minha intenção era ajudar os designers que estão se perguntando se devem ou não comprar uma retina Mac a tomar uma decisão informada. No momento, muitas fontes estão listando apenas o bom ou o ruim e eu queria compartilhar todos os meus pensamentos e permitir que você decida por si mesmo se um Mac retina é ou não adequado para você.

Nessa nota, o que você acha? Se você ainda não comprou um computador com uma tela com qualidade de retina, acha que o fará em breve? Por que ou por que não? Se você tem, o que você acha disso? Você recomendaria a outras pessoas?