プラカンブログSTAFF BLOG

2017.07.03

とても便利!「Adobe Preview CC」を使ってPhotoshopのデザインをリアルタイムで確認する方法

こんにちは。デザイナーのSUZUKIです。
今回はデザイナー必見の「Adobe Preview CC」の使い方を紹介します。

「Adobe Preview CC」とは

2015年にPhotoshopのアップデートに合わせ、発表された無料のアプリです。
リアルタイムでPhotoshopのデザインをスマホやタブレットで確認できます。

今までは・・・

WEBデザインでは、PC用とスマホ用のデザインを作ることが多いですが、
スマホ用の場合、文字の大きさや余白の感じなどを
実際の端末で確認して、調整をします。
今までは画像に書き出し、それをスマホに送り、確認するという面倒な作業でした。
※もちろん修正が発生するたびにこの作業を繰り返していました。

「Adobe Preview CC」の登場により

「Adobe Preview CC」をiPhoneにインストールすると、
リアルタイムでPhotoshopで制作しているWEBデザインをiPhoneで確認できます。
今までの確認が噓のようです!
※タブレットにも対応しています。

「Adobe Preview CC」インストール

App Storeから「Adobe Preview CC」を検索して、ダウンロード&インストールしてください。

AdobeIDを入力

起動後、画面1になるので右下の「サインイン」をタップしてください。
画面2に遷移するので、「Photoshop CC」で使っているAdobeIDを入力してください。
途中で携帯電話番号を追加する画面になりますが、スキップして構いません。

画面3になれば、iPhoneでの設定作業は終了です。

PCとの接続方法

USB接続かWifi接続をします。
Wifiの場合は、PCとiPhoneは同じ環境のWifiに接続しなければなりません。

PC側での設定

「Photoshop CC」の上部メニューの「ウィンドウ(W)」内の「Device Preview」を選択します。(画面4)
※「Adobe Preview CC」と同じAdobeアカウントで「Photoshop CC」はサインインしてください。

接続ができると「Device Preview」のボックス上に接続されたiPhone名が表示され(画面5)、
iPhoneにPhotoshopのデザインが表示されます。

以上で設定終了ですが、接続できない方は下記を参照してください。
※私の場合は下記内容で引っかかりました・・・

接続できなかった場合

USB接続もWifi接続もできなかった場合は「iTunes」がPCにインストールしているか確認しましょう。
私の場合、職場のPCで「iTunes」をインストールしておらず、何度やっても接続ができませんでした。

「iTunes」をインストールして、iPhoneを最初に接続した時、接続するPCとの信頼が確認されます。
これが重要なポイントで、信頼が確認されると接続ができるようになります。
※「iTunes」をインストールした場合はPCを再起動してください。
「Device Preview」のボックス上が画面6となっていれば、「デバイスを確認」をクリックして接続してください。

上記の方法でも接続がうまくいかない場合は、
・PCの再起動
・iPhoneの再起動
・Wifiの場合、PC、iPhoneともに同じWifiに接続しているか確認
・USBで接続している場合、USBポートを変えてみる
を試してみるといいと思います。

まとめ

私は「iTunes」をインストールしていなかったせいで、時間がかかりましたが、
本来はとても簡単に導入できるのでご安心ください!
デザイナーは絶対導入すべきです、断言します!
かなりの精度で表示し、なんといってもリアルタイムで確認できるので、
作業効率がかなり良くなります。
ぜひ「Adobe Preview CC」を試してみてください。

参考リンク

下記は参考にしたサイトになります。
詳しく知りたい方はどうぞ。

http://wpcj.net/976
https://webkikaku.co.jp/blog/software/photoshop_iphone_sync/

 

この記事は1年以上前の記事で内容が古くなっている場合があります。

+dc (鈴)

この記事は、SUZUKI が書きました。