今更聞けない「Retinaディスプレイ」って一体なんなのさ?

2012年07月02日(月)【
LINEで送る
Pocket

新しいiPadや新型のMacBookProなどに搭載されている次世代型? の高画質モニタである「Retinaディスプレイ」
読み方は「レティナ」であったり「レティーナ」であったりだけれど、ネイティブではどう読むんだろうね?

エンドユーザーからすると「びっくりするほ画面が綺麗!素敵!」と言うお話になるのだけれども、発信者側。要するにWEBデザイン関連の方からすると、これからの苦労を想像してみるに今からすでに吐き気をもよおしていると言うこともあるのではないだろうか。

実際Retinaディスプレイはすごい技術ではあると思うんだけど、では今後の対策はどうなるのか。誰がどんな恩恵を受け、誰がどのような対策を考えるのかとかあると思うんだけど、そもそも「Retinaディスプレイ」ってなんなの? って話になると案外答えづらいところもあるんじゃないかなと思う。

と言う訳で、今回はその注目のRetinaディスプレイの簡単なお話でも。
出来るだけわかりやすくなるよう心がけたものの、技術者寄りのお話かもしんない(すいまそん)

SPONSORED LINK


Retinaディスプレイの何が凄いのか?

Retinaディスプレイが凄い!凄い!!と言われているけれども、結局何が凄いのかと言われると、単純に答えとして出てくるのは「画面すごい綺麗!」と言う事だと思う。
RetinaディスプレイはiPhone4から使用されており、

●iPhone 480×320→iPhone4から960×640
●iPad 1024×768→New iPad(3世代)2048×1536

と旧タイプに比べ2倍の解像度になっているのがわかると思う。
そして今回の初めてノートにRetinaディスプレイを搭載したMacbookで見ると

●Macbookpro15(基本解像度)1440×900→Retina Macbook 2880×1800

と、同じように2倍の解像度に上がっている。

家電業界でも絶賛売出し中の「画面が綺麗で鮮明にうつりますよ」と綺麗さを前面にアピールして売り込んでいるハイビジョン対応テレビ、そのハイビジョンの上位となるフルハイビジョンの解像度は1920×1080(Blu-rayも同様)
つまり、Retinaディスプレイの解像度は、このフルハイビジョン解像度よりも高い。

ものすごくかいつまんで言うと、モニタの大きさを無視したとして、Retinaディスプレイはデジタルハイビジョンテレビよりも綺麗なのだ。

さらに特筆すべき点として、高解像度なディスプレイであると同時に、見た目の良さをより向上させるため、コントラスト処理として「黒は黒」「白は白」と表現する能力が高くなっている事もポイント(RGB表現の特性上、特にモニターと言うのは製品としての仕様上、黒の描写が苦手)

また、Macbookで言えばRetinaディスプレイが初めてIPSパネル搭載モデルとなり今までのTNパネルで見る角度によって色むらが発生する事が少なくなったのも大きな特徴かも。
それらにより、今までのMacbook proよりもモニターのキャリブレーション・カラーマッチングはとりやすくなる可能性も高くなるかもしれない。
色を扱う仕事なら使いやすいのではないかなぁ? DTPの現場的にはありがたくなる(かもしれない?)

蛇足として、液晶モニタの駆動方式は下記を参考にしてみてくだしぃ

TN? VA? IPS? ──液晶パネル駆動方式の仕組みと特徴を知ろう(ITmedia +D)

発色も良く、色彩豊かで超高解像度ディスプレイから見る絵はさぞかし気持ちいいだろうし、本当に素晴らしい物じゃないだろうか。
ただし、これは「利用するユーザー」側の話であって、「製作側」としては色んな問題が吹き出てくることが容易に予想できるのは当然なわけで、すでに様々なところでその対策が紹介されていたりもする。

MacBookにRetinaディスプレイが搭載された事によって起こりえること

iPhone・iPadはモバイル端末だったので対策も考えやすかったものの、MacBookProにも搭載されてしまったことにより、超高解像度ディスプレイ時代が幕を開けたと言っても過言ではないのかもしれないなと思う。

モバイル系の仕事をされた方なら、iPhone4Sや新しいiPadが登場してからiPhone・iPad向けコンテンツやその他で従来の物から手直しまたは作り直しで苦労されたのを実感していることだろう。
それが、PCベースの環境でお同じ事をしなければならない感満載なのである。

Appleが今回ReteinaをPCに搭載した事で他社メーカーも同様に超高解像度ディスプレイやノートPCをリリースして来る可能性は非常に高い。
そして、そのセールストークとして、「今までとは比べ物にならない位、繊細で綺麗に表示出来るよ!」みたいな感じになってくるだろう。

家電メーカーの液晶テレビ戦争と似たような乱立ぶりになり、高解像度が飽和したら今度は3Dみたいな飛び道具で顧客を狙うとかもありえるわけで、Appleだけではない熾烈なディスプレイの戦いが始まる(もう始まってる?)のかもしれない。

このような高解像度が一般的になるとそれを表示させる物(WEBサイトであったり、アプリであったり、動画であったり、写真であったり・・・色々)をその高解像度のディスプレイに最適化してやらなければ、綺麗には表示出来ないし色々不具合も出てくる。

上記において、「利用するユーザー側の話なら」とか書いたけれども、いち個人が好きで高解像度の写真や映像を撮影し取り込み閲覧・処理したりするのは良い。

しかし、様々な外部サービスを利用してその「綺麗」を楽しむにはその外部サービスを高解像度に最適化してくれる人間がいてくれて初めて実現出来る世界であり、Retinaディスプレイユーザーを満足させるためには本当に様々努力と労力が必要になってくるのではと思われる。これが多分、僕を含めて製作側が行うことになる新しい戦いの始まり。

Retinaディスプレイと業界の対応

テレビ映像業界やゲーム業界(他にもあるけど省略)等を見れば今から向かう世界が垣間見れるような気がする。

映像製作の現場では、高解像度ディスプレイの登場によりその解像度に対応したり、デジタル化によりテープベースからファイルベースへと移行し既存の機材を入れ替えなければならなかったりしている。
当然、高解像度デジタル化でファイル容量の増大やそのデータを処理する為のシステムにもお金がかかって涙目なわけだ。

ゲーム業界などは、みなさんご存知の通りで、描画については綺麗な表示は当たり前みたいな風潮で、物によってはどこまでフォトリアルに描画出来るかなど究極を求める恐ろしく大変な世界だと思う。
このように、高解像度に対応する為には業種によっては根本的なシステムから見直し構築と言う、洒落にならないくらいのお金を投資せねばならないわけで、この投資が回収出来るか出来ないか? この部分がプロとして一番の問題なのかもしれない。

WEBやDTPで言えば、画像処理に対してのアプローチを画像側で行うのか、HTMLやCSS側で行うのかとか、カラーマッチングについてやディスプレイ差による修正なんかも視野に入れなければならず、すでに涙目な話もチラホラと。

綺麗に見えるのは嬉しいんだけど、製作者泣かせにはなるんじゃないかなーと、ほとんど最新の知識を必要としない僕ですらすでに怖くなっている。

Mac Book ProのRetinaディスプレイの仕様を調べてみた

MacBookPro Retina(以下 MBP Retina)は2880×1800ピクセルと凄いのだが、解像度選択は5つから選択出来るようになっている

●1,024×640
●1,280×800
★1,440×900 (Retina ディスプレイに最適)
●1,680×1,050
●1,920×1,200

これを見て「え!?」っと思った方。その違和感は多分、正しい。

そうなのだ。実は2880×1800をそのまま作業領域にするのでは無い。(2880×1800をそのまま使えるようにする方法もあるらしいものの、今回は省略)
上記の中で、真ん中(Retinaディスプレイに最適化)と言うのが従来の15インチMBPの解像度と同じ。

従来まで1ピクセルは1ピクセル表示だったところ、MBP Retinaディスプレイでは、1ピクセル表示に4ピクセルをつかっていると言うのがわかると思う。
Retinaディスプレイは常に2倍で描画するような仕様というか、一般的なモニタサイズにも関わらず、実は2倍のサイズの画像を取り扱っていると言う形になる模様。

とりあえず現段階で出来るRetinaディスプレイ対策の一例

例えば、32×32ピクセルの画像をブラウザで表示させるとRetinaディスプレイでは64×64ピクセルで表記される。
なので、当然描画が荒くなる。

これを回避するには、乱暴に対応するなら通常32×32の画像を事前に64×64で作成し50%縮小して配置する。
もしくは、Retinaディスプレイだけ2倍解像度の画像を描画させるようにHTML・CSSで指定してやるとか。

なので、WEB系の場合にはピクセルベース素材では無く、ベクター画像(SVGなど)を利用するなど解像度非依存を上手に利用する事や、ピクセル素材を利用する場合には、しっかりとRetina用に高解像度データを用意しておくなどが必要になってくるのかも。SVG画像とか久々に聞いたよなー。

WEBでRetina対応のための方法は下記とかで調べてみてくだしぃ

WebサイトをRetinaディスプレイに対応させる方法まとめ7つ(W3Q)

Retinaディスプレイはお化けみたいなもの?

Appleお得意の販売手法と言うかなんと言うか、まだ情報が出揃っていない状態で突如販売をスタートさせたり、基本的な情報の多くを噂レベルでしか確認できず、カンファレンスから短期間で情報を調べなければならないため、このような情報を多く取り扱うフロントエンドユーザーからの情報提供に頼らざるを得ない状態と言うか、とりあえず「Retinaディスプレイは画面が綺麗。すごい!」と言うことは分かるものの、それ以外の点ではなかなか把握するにはもう少し時間がかかるよなーって言うのが正直なところかなと思ったりもしている。

ある程度の仕様は理解しているものの、じゃぁどうすればより高い次元で対策を考えることが出来るのか? となった際、やっぱり役に立つのはAppleの公式サイトによる仕様情報だったりするのかなーと。

ただ、それを全て理解するにはある程度解像度に関する知識やカラーマッチングについてなども理解しておかなければならないわけで、ある程度分かっておかないと画像処理自体が大きな戸惑いに包まれてしまうみたいな。
今のところはそれがまだ完全に把握できていない状態が続いているから、ある意味化け物のようにも見えてるんじゃないかなーなどと思ってみたりもするわけだ。

Retinaディスプレイが本格的に実装されつつある中、製作者としてどのようなアプローチによってこの問題を解決していくのか と言うのは個人的には結構見もので、フロントエンドユーザーの方には大いなる期待を寄せていたりするものである。

SPONSORED LINK


LINEで送る
Pocket

最後までここにいてくれてありがとう

よろしければ四畳半ワークスのRSS購読、SNS参加もどうぞ!

RSSリーダーに登録する

twitterでフォローする

Facebookページを見る

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です