Retina 화면에서 디자인 : Retina MacBook Pro에 대한 나의 생각
인치당 220.5 픽셀 : 폭 2, 800, 높이 1, 800은 총 5 백만 개가 넘는 픽셀입니다. 이것이 제가 지금 작업하고있는 화면입니다. 애플은 이런 스크린을 만드는 사업이 있습니까? 업계를 돕거나 방해합니까? 레티 나가 아닌 화면을 디자인하는 경우 실제로 디자인 작업을 할 수 있습니까?
오늘 저는 업무 수행 방식을 바꾸겠다고 위협하는 기계에 대한 나의 경험에 대해 모두 말씀 드리겠습니다. 나는 내가 좋아하는 것에 대해 열망하고 나를 미치게하는 것에 대해 격분 할 때 아무것도지지 않을 것이다. 함께 읽고 내 결론에 동의하는지 확인하십시오.
Envato Elements 살펴보기
Dang You Apple
지난 10 년 동안 우리 디자이너들은 다양한 화면 크기의 형태로 주요 패러다임 전환을 다루는 방법에 중점을 두었습니다. 이 도전은 우리를 재치로 이끌어 냈지만 어느 쪽의 화면에서도 멋지게 보이는 진정으로 유연한 웹 사이트의 인상적인 위업을 달성 할 수있는 더 나은 디자이너를 이끌어 냈습니다.
Mediaqueri.es는 어디에서나 멋지게 보이는 반응 형 웹 디자인을 보여줍니다.
우리는 하나의 주요 패러다임 전환에 초점을 맞추었지만 다른 하나는 우리에게 몰입했습니다. 이러한 변화의 모멘텀은 최근 Apple, iMac 및 MacBook Air와 함께 iPhone, iPod Touch, iPad 및 MacBook Pro에 현재 출시 된“레티 나”품질 디스플레이와 함께 내년 또는 2 년 내로 어느 정도 시간을 따를 것입니다. .
애플은 고해상도 디스플레이를 출시 한 최초이자 유일한 전자 제품 제조업체가 아니거나 거의 모든 것을 처음으로 제공하지는 않습니다. 그러나 과거와는 달리 주요 기술 변화의 광범위한 채택에 대한 마크를 설정했습니다 (이것은 내가 말한 다른 모든 것을 건너 뛰는 부분이므로 주석에서 이것이 사실이 아닌 정도에 대해 알 수 있습니다).
화면 크기 혁명과 마찬가지로 디자이너는 모든 것을 변화시키는 거대한 패러다임 전환을 디자이너에게 제공합니다. 이 장애물은 마지막 것보다 극복하기가 훨씬 어려울 수 있으며 즉각적인 관심과 추측이 필요합니다. 3 월에이 주제에 관한 토론을 게시했습니다.
그 이후로 Retina MacBook Pro를 구입했습니다. Retina MacBook은 멋진 작은 iOS 벽 정원에서 모든 종류의 직업을 가진 사람들이 사용할 수있는 영역으로 망막 디스플레이를 깨뜨 렸습니다. 풀 타임으로 기계 작업을 한 후 몇 주 동안 내 경험을 공유하는 것이 적절하다고 생각했습니다.
Retina Screens도 존재해야합니까?
“고밀도 스크린이 점점 커짐에 따라 왜 질문을 시작합니까? 우리가 할 수 있다고 해서요?” – 존 캐리50 발 그림자
요즘 업계에 그런 성가신 길을 밀어 넣은 것에 대해 실제로 화가 났을 때 크리에이티브들로부터 몇 가지 기사를 읽었습니다. 이언 말콤 (Ian Malcom)이 존 해먼드 (John Hammond)를 죽인 공룡을 데려 오기로 한 급한 결정으로 거세한 것처럼이 비평가들은 애플 이 그런 스크린을 만들 수 있다고해서 반드시 그렇게 해야 한다는 의미는 아니라고 주장 한다 .
어느 날 망막 스크린으로 비평가들이 잘못되었다고 확신했다. 너무 아름답습니다. 구 MacBook을 더 이상 보려고 간신히 서있을 수 있습니다. 내 눈을 뜨고 갑자기 어둡고 진흙 투성이로 보이는 문제가 없었던 화면이 갑자기 나타났습니다.
VCR에서 멈춰야합니까?
이 현상을 직접 경험하지 않고 실제로 감상 할 수있는 유일한 방법은 오래된 CRT 텔레비전을 찾아 VCR에 연결하여 영화를 볼 수있는 것입니다. 진심으로 시도해보십시오. 몇 초 안에 당신은 세상에서 어떻게 그런 나쁜 시각적 경험을 견뎌냈는지 궁금해 할 것입니다. 이것의 10 분과 당신은 전능 한 Blu-ray를 위해 기술 신에게 매일 감사 할 것이다.
VHS 테이프에서 전환하기가 어려웠지만 지금 되돌아 보면 그만한 가치가있었습니다.
우리가 지금 되돌아 보면, 영화 산업의 고객과 제작자는 비디오 재생 및 배포의 기본 방법으로 VHS 테이프를 남겨 두는 것이 더 좋습니다. 혁명은 모든 사람에게 불편한가? 물론.
콘텐츠 제작자는 새로운 방식으로 일을 배우고, 채택하고, 개발해야했습니다. 고객은 오래된 장비와 많은 양의 콘텐츠를 버리고 이전 장비와 중복 된 것처럼 보이는 새로운 구매를하고 새로운 전문 용어를 배워야했습니다. 엉망이었습니다. 그리고 그것은 DVD 무대에만 올라갔습니다. 많은 사람들이 여전히 Blu-ray 나 iTunes 및 Apple TV와 같은 순수한 디지털 솔루션으로 뛰어 드는 중입니다.
“사전은 다른 사람에게 불편을 줄 것인지의 여부에 근거하지 않습니다. 특히 애플이 운전석에있을 때”고해상도 컴퓨팅의 등장으로 소비자와 컨텐츠 제작자 모두에게 동일한 문제가 발생합니다. 불행히도, 그것은 기술 산업이 작동하는 방식입니다. 시장이 생겨나 고 기술이 소비자가 감당할 수있는 품질의 결과를 산출하는 방법을 알고있을 때 발전합니다. 그들은 누군가를 불편하게 할 것인지 아닌지에 근거하지 않습니다. 특히 애플이 운전석에있을 때.
그리고 그것은 좋은 것입니다. 물론, 그것은 같지 않을 수도 있지만, 옛날에는 컴퓨터 모니터가 소수의 색상만을 가지고 있었기 때문에 업계에 사람들이 더 이상 가지 않겠다고 주장했을 때 내기 할 수 있음을 명심하십시오. 나는 그들이 당신을 기쁘게 생각합니다, 그래서 차고 비명을 질질 끌고있는 사람들 중 하나가되는 것을 중지하고 대신 도전을 공격하고 대화에 가치있는 무언가를 제공하려고합니다.
Retina MacBook Pro 생활 및 작업
"문제가있을 거라는 것을 알고 있었어요."주류 시장에 망막 스크린이 존재할지 여부는 실제로 관련이없는 논의입니다. 그들은, 그리고 당신은 두 가지 선택 : 적응 또는 죽을. 전 인쇄 전용 디자이너로서 저는이 선택에 직면했습니다. Flash 개발자는 현재이 선택에 직면하고 있습니다.
나는 적응에 관한 모든 것입니다. 그래서 나는 얼리 어답터 경로를 타고이 기차를 타고 어디로 가고 있는지 전혀 알지 못했습니다. 나는 2007 년 13 인치 MacBook을 남겨두고 반짝이는 새로운 15 인치 Retina MacBook Pro를 구입했습니다.
나는 어떤 문제가있을 것이라는 것을 알고 있었다. 내가 걱정했던 사람들 중 일부는 큰 문제가 아닌 것으로 밝혀졌고, 내가 의지하지 않은 다른 사람들은 나를 좌절에 빠뜨렸다.
천개의 모자
어느 날, 나는 여러 은유 적 인 모자를 착용합니다. 저는 디자이너, 작가, 사진 작가, 웹 브라우저, 영화 감독입니다. 원하는대로 말만 해.
이로 인해 나는 망막 디스플레이 관점에서 다양한 경험에 대한 통찰력을 제공 할 수 있습니다. 내가 인정하지 않는 한 가지는 게이머입니다. 나는 Nintendo 컨트롤러에 연결되어 자랐고 PC 게임에 관심이 없었기 때문에 다른 곳에서 그 영역에 대한 통찰력을 찾고 있는지 물어봐야합니다.
여기에 매일 사용하는 몇 가지 주요 범주와 각각에 대한 나의 생각이 있습니다.
일반적인 OS 사용
현재 OS X Lion을 실행 중이며 레티 나 그래픽에 대해 99 %가 업데이트 된 것으로 보입니다. 때때로 나는 픽셀 화 된 것처럼 보이는 버튼의 사이트를 포착하지만 어쨌든 거의 사용하지 않는 깊이 묻힌 유틸리티에서만 사용합니다.
대부분의 경우, 디스플레이가 빛나는 곳입니다. 모든 것이 절대적으로 놀랍습니다. Apple은 핵심 시스템뿐만 아니라 iMovie와 같은 대부분의 앱을 업데이트했습니다.
타사 앱
이 부분은 기계를 구입할 때 걱정거리 였지만 생각보다 덜 중요한 문제로 판명되었습니다.
Sublime Text 2와 같은 내가 좋아하는 많은 앱은 처음에는 거칠게 보였지만 이전보다 더 나은 레티 나 업데이트를 이미 받았습니다.
물론 대부분의 앱은 아직 업데이트되지 않았지만 앱 중독자 임에도 불구하고 매일 사용하는 앱이 많지 않습니다. 나중에 설명 할 CS6을 제외하면 매일 버그를 일으키는 유일한 앱은 Mac 용 Twitter입니다.
이 응용 프로그램은 실제로 망막 디스플레이에 비 망막 그래픽의 고집을 보여줍니다. 흥미롭게도“새로운 트윗”창에서 나타나는 것과 같이 생생하고 편집 가능한 라이브 텍스트는 괜찮아 보이지만 텍스트에서 아바타에 이르기까지 전체 스트림은 끔찍합니다.
웹 브라우징
“나쁘게 보이는 작은 이미지입니다. 웹 사이트 상단의 작은 JPG 로고, 인터페이스 스크린 샷…”웹 브라우징은 정말 두려웠습니다. 나는 웹이 저해상도 세계이며 15 인치 망막 스크린을 가리키는 것은 DPI가 낮은 사진으로 돋보기를 가져가는 것과 같다는 것을 잘 알고있었습니다.
놀랍게도 우연히 우연히봤을지라도 우리는이 혁명에 대해 스스로를 잘 준비했습니다. 이미지없이 웹 그래픽을 구축함으로써 대역폭 절약에 대한 집착으로, 우리는 실제로 무한히 확장 가능한 웹을 구축하고있었습니다.
요즘 대부분의 UI는 좋은 오래된 HTML, CSS 및 JavaScript로 만들어졌습니다. 이 그래픽에 망막 디스플레이를 던지면 더 좋아 보입니다! 레코드의 경우 플래시 사이트에 대해서도 마찬가지입니다.
물론 실제 문제는 이미지에 있습니다. 흥미롭게도, 대부분의 웹 브라우징은 하나의 멍청이없이 진행되며 해상도 너트입니다.
전문 사진은 특히 멋지게 보입니다. Flickr 또는 500px로 이동하면 그 어느 때보 다 즐거운 경험을 할 수 있습니다.
작게 보이는 작은 이미지입니다. 웹 사이트 상단의 작은 JPG 로고 인 인터페이스 스크린 샷은 실제로 픽셀 배가에 사용할 수있는 정보가 많지 않으므로 매우 끔찍한 것처럼 보입니다.
영화 및 TV 쇼
Retina MacBook Pro는 MacBook Air와 마찬가지로 광학 드라이브를 폐기했기 때문에 DVD에 대한 경험은 없었지만 대부분 비디오는 이미지와 같습니다. 외형이 좋아지고 외형이 나 빠진다
Netflix / Hulu 라이브 스트리밍이 눈에 띄게 재밌게 보이는 반면 디지털로 다운로드 한 HD 영화가 디스플레이에 빛을 발합니다. 운 좋게도, 내가 일반적으로 쇼를 시청하는 거리는 내가 일하는 곳보다 훨씬 더 멀어서 모든 해상도 문제는 일반적으로 눈에 띄지 않습니다.
사진술
Canon 5D Mk II로 촬영하기 때문에 사진이 훌륭하고 커집니다. 그들은 망막 디스플레이에서 멋지게 보이며 확대 및 세부 정보 편집에 아무런 문제가 없었습니다. 유일한 문제는 CS6에서도 소프트웨어 (Photoshop & Lightroom)가 아직 미화되지 않았다는 것입니다.
쓰기
순수한 글의 관점에서, 망막 화면은 놀라 울 정도로 좋습니다. 인치당 220 픽셀의 타이포그래피는 아름다운 것입니다. Writeroom을 열고 전체 화면 모드로 전환하여 세상을 차단합니다.
몇 시간이 지난 후에는 유형이 얼마나 좋은지 잊어 버리기 쉽습니다. 그러나 저해상도 디스플레이에 텍스트 문서를 가져온 후 몇 초 안에 픽셀 만 보입니다. 더럽고 못생긴 픽셀.
유형은 팔의 길이를 잘 보지 않습니다. 눈을 감당할 수있을 정도로 화면에 가깝게 얼굴을 붙일 수 있으며 유형이 여전히 날카 로워 보입니다.
타이포그래피는 망막 화면에서 아름답게 선명합니다.
포토샵, 디자인 및 스크린 샷
이제 여러분이 정말로 듣고 싶은 부분이 있습니다. Photoshop은 어떻습니까? 이걸 디자인 할 수 있습니까?
iOS 디자이너가 유용하게 사용해야한다
나는 내가 iOS 디자이너가 아니라고 말함으로써 시작할 것이다. 이 사람들은 지금까지 레티 나가 아닌 화면에서 레티 나 그래픽을 설계해야했으며, 전환을 원한다고 생각합니다.
반대의 문제가 있습니다 : 망막 화면에서 비 망막 그래픽 디자인. 당신은 그것이 고통이 될 것이라고 기대하지 않을 수도 있지만, 정직하게 말하면, 그것은 정말로 사실입니다.
낮은 ppi 범위에 있으면 모든 해상도 개념을 잃기 때문입니다. 브라우징 할 때 작은 재기있는 이미지를 무시할 수도 있지만, 제작자의 의자에 있으면 뇌가 모든 픽셀을 검사합니다.
픽셀 배가 작품 짜증
"아트웍이 제대로 작동하는지 여부를 제대로 파악하려면 이전 화면에서 확인해야합니다."망막 화면에서 표준 웹 해상도로 내가 만들거나 Photoshop으로 가져 오는 것은 모두 쓰레기처럼 보입니다. 벡터로 무언가를 빌드하더라도 SVG로 내 보내지 않으려는 경우가 아니라면 (아직) 옵션이 아닌 대부분의 시간은 여전히 슈퍼 픽셀 화 된 작은 JPG 또는 PNG로 출력됩니다. 화면의 해상도가 두 배가됩니다.
이것은 내 자신의 작품과 다른 사람의 작품으로 작업 할 때 많은 까다로운 문제를 나타냅니다. 내 작품의 경우 저해상도를 만들어야합니까? 그렇게하면 선명도를 판단 할 수있는 능력이 손상됩니다. 아니면 고해상도로 구축하고 확장하기 위해 축소해야합니까? 눈치 채 셨을지는 모르겠지만, 크기를 조절할 때 Photoshop에서 래스터 아트 워크를 휴지통에 버릴 수 있습니다.
다른 사람의 아트 워크를 사용할 때도 문제가됩니다. 당신이 디자이너라면, 아마도 크 래핑되고 픽셀 화 된 제 3 자 아트 워크를받을 것입니다. 결과적으로 더 나은 아트 워크를 요구하지 않고 모두 사용하지 않아도됩니다.
언뜻보기에는 망막 디스플레이가 거대하지 않으면 항상 망가지기 때문에 나빠지 기가 훨씬 어렵습니다. 아트 워크가 제대로 작동하는지 여부를 제대로 파악하려면 이전 화면에서 아트 워크를 살펴 봐야합니다.
스크린 샷
"갑자기, 내가 찍는 스크린 샷은 내가 의도 한 크기의 두 배입니다!"생계를 위해 블로그를 운영한다는 사실을 감안할 때 평범한 사람보다 더 많은 스크린 샷을 찍는 것이 안전하다고 생각합니다. 나는 항상 앱 인터페이스 또는 웹 사이트의 스크린 샷을 사용하여 게시물에 포함시킵니다.
망막 디스플레이가 여기 사악한 커브 볼로 맞았습니다. 갑자기 내가 찍은 스크린 샷은 의도 한 크기의 두 배입니다! 크기를 조정하면 래스터 그래픽과 작은 텍스트가 포함 된 UI 스크린 샷이 실제로 어떤 화면에서나 불쾌하게 보이므로 가능한 한 항상 100 %로 사용하려고합니다.
망막 화면에서 510 픽셀 너비의 스크린 샷 (표준 디자인 image 이미지 크기)은 1, 020 픽셀입니다. 레티 나 사용자를 완전히 무시하고 존재하지 않는 척하는 경우 논리는 너비가 510 픽셀 인 이미지를 제공해야한다고 말합니다. 즉, Photoshop에서 수동으로 크기를 조정하고 원래 모습 그대로 유지해야합니다. 특히 래스터 화 된 텍스트가 관련된 경우 트럭으로 넘어갑니다.
당신은 그것을 망각 화면에 있기 때문에 당신은 물론 대부분의 사용자보다 나에게 더 나빠 보인다.
당신의 해상도 바보 변경
스크린 샷 딜레마를 다른 사람들에게 제시했으며 모두 같은 것을 말합니다. 해상도를 변경하십시오! 이것은 완벽하게 실행 가능한 솔루션처럼 보이지만 그렇게 간단하지는 않습니다.
Retina MacBook Pro에는 5 가지 해상도 설정이 있습니다. 서로 다른 두 해상도를 선택하고 동일한 정확한 창의 스크린 샷을 찍은 다음 Photoshop에서 서로 옆에 붙이면 어떻게됩니까?
보시다시피, 그들은 정확히 같은 크기로 나옵니다. 시스템 환경 설정에서 해상도를 변경하면 전체 스크린 샷의 전체 크기에 영향을 주지만 대부분 스크린 샷의 요소는 변경되지 않습니다.
기록을 위해 다음은 전체 창에서 510px 너비의 문서에 넣을 수있는 창 크기입니다.
방금 저주를 받았다면, 당신의 반응은 저만의 것으로 나타났습니다.
밝고 선명한 화면에서 작업
"반나절을 망막과 망막이 아닌 스크린 사이를 뛰어 다니는 것은 문자 그대로 바다가 아 feel다는 느낌을주었습니다!"오래된 MacBook에서는 일반적으로 최대 밝기로 작업했습니다. 나는 배터리 수명, 눈의 피로 및 그 밖의 것들에 대해 많은 것을 읽었지만 밝기가 크랭크되지 않으면 모양이 마음에 들지 않았습니다.
이 새로운 화면에서는 대부분의 조명 시나리오에서 전체 밝기가 너무 밝습니다. 망막 화면? 망막 굽기 화면과 비슷합니다. 그래도 화면이 너무 밝아서 화면을 꺼야합니다.
흥미롭게도, 나는 전환 이후 때때로 두통이 있음을 발견했습니다. 화면이 너무 밝고 날카로 워서 눈이 더 쉬울 것 같지만 너무 멀리지나 가서 저장하는 것보다 눈의 피로가 더 커질 수 있습니다. 밝기를 확인하지 않는 한 이것이 장기적으로 큰 문제라고 생각하지 않습니다.
화면의 선명도는 첫날에만 문제가되었으며 이전 시스템에서 새 시스템으로 모든 것을 이전 할 때 발생했습니다. 반나절을 망막과 망막이 아닌 스크린 사이에서 뛰어 내리면 말 그대로 바다가 아 feel습니다!
성장하는 고통
"새로운 기술로 새로운 도전이 이루어지고 나와 같은 얼리 어답터가 가격을 지불하는 사람들입니다."새로운 Retina MacBook Pro에 대한 칭찬과 불만의 전체 목록이 있습니다. 의도적으로이 기사는 장점보다 망막 스크린에서 작업해야하는 문제에 중점을 둡니다. 내가 정직하다면, 그 혜택이 저를 날려 버렸고 구매 한 것에 대해 조금도 후회하지 않습니다. 나는이 컴퓨터를 절대적으로 좋아하고 그것이 내가 사용한 것 중 최고라고 말하는 것을 망설이지 않을 것이다.
위에서 언급 한 모든 투쟁은 단지 고통이 커지고 있습니다. 새로운 기술이 등장함에 따라 저와 같은 얼리 어답터는 다른 사람이 가지고 있지 않은 반짝이는 새로운 장난감을 소유하는 대신 (비 유적으로 그리고 문자 그대로) 가격을 지불하는 사람들입니다.
몇 년 동안 모든 새 컴퓨터가 220ppi에 도달하고 표준 구성 요소로 솔리드 스테이트 드라이브를 사용하는 경우이 기술의 가격표는 훨씬 저렴하고 거의 사용하지 않을 것입니다.
The Verge의 컴퓨터 화면 해상도 비교
위에 나열된 모든 불만 사항은 실제로 내가 디자인하는 사람들보다 해상도가 높은 컴퓨터를 소유하고 있다는 사실로 귀결됩니다. 모두 같은 페이지에 있으면 모든 것이 극적으로 단순화됩니다.
망막 품질의 화면이있는 기기를 소유하면 웹에서 직면하고있는 이미지 문제에 대한 긴박감을 높일 수 있습니다. 레티 나 사용자가 아름다운 이미지를 원하지만 레티 나가 아닌 사용자에게로드 시간이 가치가 있습니까? 다행히 Retina.js와 같은 정말 멋진 솔루션이 등장하여이 문제를 완화 할 수 있습니다.
아직도, 우리가 사용했던 이미지의 두 배를 생성하고 업로드해야하는 가까운 미래는 정확히 흥분된 것이 아닌가?
어떻게 생각해?
바라건대, 이 거대한 웅덩이는 완전한 드라이브 더미가 아니 었습니다. 저의 의도는 레티 나 맥을 구입해야하는지 궁금해하는 디자이너가 정보에 입각 한 결정을 내릴 수 있도록 돕는 것이 었습니다. 너무 많은 소스가 현재 좋은 것만 나쁘게 나열하고 있으며, 모든 생각을 공유하고 레티 나 맥이 당신에게 적합한 지 여부를 스스로 결정하고 싶었습니다.
그 메모에서 당신은 어떻게 생각하십니까? 망막 품질의 디스플레이가 장착 된 컴퓨터를 아직 구입하지 않았다면 조만간 생각하십니까? 그 이유는 무엇? 있다면 어떻게 생각하십니까? 다른 사람에게 추천 하시겠습니까?
