メニュー
\ 最大15%ポイントアップ! /

【Photoshop】素材を別データから参照!超便利機能「リンクを配置」を解説[応用技解説付き]

eyecatch_ photoshop

別データから素材を参照して並べることのできる「リンクを配置」はご存知でしょうか?

すいみん

複数人でUIやレイアウトを作成する時に必須の機能です

参照元のデータが更新されると、参照先も更新されるので超便利です。

リアルタイム更新はもちろん、レイヤーカンプも読み込めるのでうまく使えばかなり効率化できるので本記事ではその「リンクを配置」を解説します!

目次

基本!リンクを配置のやり方


STEP.1
リンクを配置

ファイル>「リンクを配置」から画像を配置。


STEP.2
自動更新

Photoshopで開いている時に素材を差し替えると自動で更新されます。

データを開いていない時に素材を差し替えて、データを開くと更新されていない場合は、「!」マークが点灯しています。 

その場合はレイヤーを右クリックして、「変更されたすべてのコンテンツを更新」ボタンを押すと更新されます。


実例!リンクされたスマートオブジェクトでの画像配置


STEP.1
サンプル素材の用意

UIパーツを作成します。(PSDで保存)

またレイアウトのPSDデータも作成しましょう。


STEP.2
PDFを開きます

ファイル>リンクを配置からUIパーツを読み込みしましょう。

※属性ウインドウから状態確認できます。


STEP.3
配置する

参照した素材を複製して並べてみます。


STEP.4
配置する

次に参照元のUIパーツの(PSD)の色を青にしてみましょう。


STEP.5
配置する

レイアウトもリアルタイムで修正が反映されます!

株式会社LIG(リグ)|コンサルティ...
PhotoshopでWebデザイン作業を効率化する設定方法 | 株式会社LIG(リグ)|コンサルティング・システム開発・... いつも「時間が足りない!」「忙しい」「寝たい……」と思っているデザイナーの皆さん、作業の時間短縮をしていますか? 今回は、Photoshopを毎日使うデザイナーさんならぜひ...


うまく使えば、「UI素材の作り込み」と「画面レイアウト」の作業を担当を分けて作業できますね!

応用例 レイヤーカンプとの連携

UIパーツ(PSD)で複数UIパーツを作成してレイヤーカンプで登録しておけば、レイアウトの方で切り替えることもできます。

www.youtube.com

  • URLをコピーしました!
  • URLをコピーしました!

Photoshopに関する参考記事・ツール・書籍のまとめ

Photoshopに関する記事を下記にまとめました。

Photoshopのソフトウェア購入

Photoshopが学べるスクール

Photoshopの参考書籍

すいみん

独学で勉強できてしまうPhotoshopですが、他の人の手法を見ると全然使いこなせてなかったことに気がつくこともあります

この記事を書いた人

すいみんのアバター すいみん CGデザイナー・テクニカルアーティスト

技術的なことが好きなフリーランスのデザイナー。
ブログが好きで月間20万PVの技術ブログを運営。
書籍のお仕事もしています。
・「Unity デザイナーズ・バイブル」
・「Unityゲーム プログラミング・バイブル 2nd Generation」
ご依頼はこちらから!

この記事も読まれてます

目次