インスタ投稿をおしゃれなコラージュにする方法とオススメの無料アプリ
インスタのコラージュ投稿の作り方をご紹介。Adobe Expressで画像を編集する方法も解説します。
かんたんオールインワンエディター
ワンクリックでどのデバイスからでも編集
生成AIでスピーディに作成
プロがデザインした数千のテンプレート
Instagramのフィードやストーリーズで、複数の画像を組み合わせたおしゃれなコラージュ画像を見たことがあるでしょう。コラージュ画像は、Instagramの機能または画像編集アプリで作れます。
この記事では、Instagramでよく見かける以下2パターンのコラージュの作り方をご紹介。コラージュをおしゃれにする背景色付きの文字の入れ方やフレームの付け方も解説します。
ちなみに、上記のコラージュ画像のうち、Instagramの機能を使って作れるのは左側の「ストーリーズ用のグリッドレイアウト」の画像のみです。幅広いデザインの画像を作るには、画像編集アプリが必要です。
まずはInstagramの機能だけを使ってグリッドレイアウト画像を作る方法を解説します。後半では、無料の画像編集アプリ「Adobe Express」を使って多彩なコラージュ画像を作る方法も見ていきましょう。
※当記事の情報は、2025年1月時点のものです。アプリケーションのバージョンにより、操作画面のUIや機能が異なる場合がございます。あらかじめご了承ください。
目次
Instagramのストーリーズでコラージュ投稿を作る方法
「Adobe Express」を使ってコラージュ画像を作る方法
おしゃれなコラージュを作れるデザイン作成アプリ「Adobe Express」
Adobe Expressを使ってコラージュを楽しもう
Instagramのストーリーズでコラージュ投稿を作る方法
Instagramのストーリーズは、以下のようにグリッド(格子)のレイアウトに複数の写真を組み合わせて投稿できます。
この投稿を作る手順について詳しく解説していきます。
YouTubeでも解説しています。
【手順1】「レイアウト」を選択する
プロフィールページの右上の「+」アイコンをタップし、「ストーリーズ」を選択します。次に左上の「カメラ」をタップし撮影画面を開いたら、画面左側のグリッドのアイコンをタップします。
【手順2】好みのグリッドを選択し、写真を挿入する
作りたい構図のグリッドを選択すると、編集可能なグリッドのみが撮影モードに切り替わります。撮影ボタンをタップして撮影をするか、左下のアイコンから自分のスマホ内にある画像を選んでください。
すべての画像を挿入し終えたら、画面下部のチェックマークをタップし、完了します。
なお、各グリッドでは挿入した画像の中央部分が表示され、表示位置の微調整はできません。見せたい部分が上手く表示されない場合は、見せたい部分が各画像の中央に来るように、スマホの写真アプリのトリミング機能で画像を加工しておきましょう。
【手順3】背景色付きの文字を入れる
編集画面の上部にある「Aa」のアイコンをタップすると、文字の挿入や見た目の変更ができます。
任意の文字を入力し、画面上部のアイコンから背景色を付けたり、文字色を調整したりしましょう。
文字の見た目を調整したら画面右上の「完了」をタップし、変更を適用しましょう。テキストをドラッグし、位置を調整したら完成です。
そのほかのInstagramの機能も使い、お好みに合わせて加工したら、ストーリーズに投稿しましょう。
このようにInstagramの機能だけで加工できるのは、ストーリーズ用の画像のみです。フィード投稿用に画像をコラージュ加工したい場合は、画像編集用のアプリを使う必要があります。そこで続いて、画像の切り抜きや配置などの編集がカンタンにできる、無料のデザイン作成アプリ「Adobe Express」を使って、コラージュ画像を作る方法を解説します。
「Adobe Express」を使ってコラージュ画像を作る方法
ここでは、以下の2パターンのコラージュ画像をAdobe Expressで作る方法を解説します。
1. 複数の写真をグリッドで組み合わせる(グリッドレイアウト)
2. 切り抜き画像を自由に配置する
なお「Adobe Express」は、アプリのダウンロード後、無料で会員登録(30秒で完了)をした後、ログインするとすぐにご利用いただけます。以下よりアプリをインストールしてご利用ください。
まずは「1.グリッドレイアウト」の画像の作り方から解説していきます。
【パターン1】複数の写真をグリッドで組み合わせる(グリッドレイアウト)
グリッドレイアウトの画像を作る前に、組み合わせたい写真を用意しておきましょう。
なお、ここではストーリーズ用の画像の作成手順を紹介しますが、フィード用の画像も同じ手順で作れます。
【手順1】フィード用の編集画面を開く
Adobe Expressにログインしたら、画面上部の「Instagram投稿」をタップし、フィード投稿用の画像の編集画面を開いてください。ストーリーズ用の画像を作りたい場合は「Instagramストーリー」を選んでください。
【手順2】グリッドを選び、画像を挿入する
「+」ボタンをタップ後、「グラフとグリッド」を選択し、作りたいレイアウトを選びましょう。
編集画面に戻ったら、画像を挿入したいエリアをタップし「置換」をタップしましょう。すると画像の参照場所を選べるので、スマホ内に保存している画像や動画を使う場合は「フォトライブラリ」を選びましょう。「写真またはビデオを撮る」を選ぶと、その場で撮影した写真を挿入できます。
挿入したい画像を選ぶと、右上の「追加」をタップすると、 自動で画像が挿入されます。
画像をタップすると、画像の大きさを調整できたり、ドラッグで表示位置を変更できたりするので、表示させたい部分が見えるように調整しましょう。
他のエリアについても同様の手順で画像を挿入したら、グリッドレイアウトを使った画像の完成です。このまま画像をフィードに投稿する場合は、画面右上のシェアボタン(飛行機のアイコン)をタップし、「Instagram」→「Instagramに投稿」を選びます。すると、投稿形式の選択画面に移動するので、フィードを選び、通常のフィードと同様の流れで投稿しましょう。
グリッドレイアウトでコラージュするだけでも投稿が華やかになりますが、続いて紹介する手順で、背景色付きの文字を入れると、よりおしゃれな投稿を作れます。
背景色付きの文字を入れる方法
Adobe Expressでは背景色付きの文字をカンタンに入れられます。
【手順1】テキストを挿入する
「+」ボタンをタップ後、「テキスト」を選択し、 画像に挿入したい文字を入力します。
挿入したら、まずはドラッグして位置やサイズを調整しましょう。
【手順2】背景色を付ける
次に、テキストを選択した状態で「効果」→「シェイプ」をタップし、さらに「シェイプ」の下にある調整バーをタップします。すると、テキストに帯や四角形、リボンなどの背景を付けられます。
今回は文字の背景に四角を置きたいので、四角のシェイプを選びます。
また、メニューの左上にある色付きのボックスをタップすると色の変更が可能です。
【手順3】フォントと文字色を変更する
フォントは「フォント」タブから、文字色は「カラー」タブの「テキスト」から変更できます。
文字色を変える場合、「テキスト」をタップして以下のいずれかの方法で色を変更してください。
1. 「スウォッチ」の中にある色から好きな色を選ぶ
2.「スポイト機能」を使って画面内の色を選ぶ
3.「カスタム」で色を指定する
配色に慣れていない人は、「スウォッチ」から色を選ぶか、スポイト機能で抽出した画像上の色を使ってみましょう。スポイト機能を使うには、取りたい色の場所にスポイトをドラッグするだけです。画像上にある色を背景色や文字色に使うと、画像に統一感が出て、洗練された印象を与えやすくなるので、配色に迷ったらぜひ使ってみてください。
色が決まったら、画面右下の「完了」をタップして色を適用させて完成です。
続いて、切り抜き画像を自由に配置するパターンのコラージュ画像の作り方について解説します。
【パターン2】切り抜き画像を自由に配置する
ここでは「Adobe Express」を使って、切り抜いた画像を自由に配置したコラージュを作る方法をご紹介します。
なお、今回はストーリーズ用の画像の作成方法をご紹介しますが、画像サイズを変更すればフィード用の画像も同じように作成できます。
【手順1】ストーリーズ用の編集画面を開く
Adobe Expressにログインしたら、画面上部の「Instagramストーリー」をタップし、ストーリーズ投稿用の画像の編集画面を開いてください。フィード用の画像を作りたい場合は「Instagram投稿」を選んでください。
画像の背景色は、画面の背景をタップし「背景色」から好きな色を選ぶことで変えられます。今回作りたい画像の背景色は白のため、このまま編集を進めます。
【手順2】切り抜きたい画像を挿入する
画像を挿入するには、「+」ボタンをタップ後、「デバイスからアップロード」を選択します。スマホ内に保存している画像を使う場合は「写真ライブラリ」、その場で撮影した写真を挿入する場合は「写真またはビデオを撮る」を選択しましょう。「フォトライブラリ」からは、一度に複数枚の画像の挿入も可能です。
なお「Adobe Stock写真」からは、数十万点の写真素材を無料で使えるので、コラージュに必要な場合はぜひご利用ください。(プレミアムプランでは数億点の素材を利用できます)
【手順3】画像を切り抜く(背景を削除する)
切り抜きたい画像を選択した状態で、画面下部の「背景を削除」をタップします。これだけでカンタンに画像の背景を削除できます。
他の画像も同様の手順で切り抜いたら、各画像をドラッグして好きな場所に移動しましょう。
なお、画像の背景に他の目立つ要素が入っていたり、複雑な模様になっている場合はうまく切り抜けない場合があるので、なるべく背景がシンプルな画像を使うとよいでしょう。
これで画像の切り抜きは完了です。ここにテキストやフレームを追加して、おしゃれに仕上げましょう。
文字を画像に挿入する方法
続いて、Adobe Expressで画像に文字を挿入する手順を解説します。
【手順1】文字を挿入する
文字を挿入するには編集画面の下部から「追加」→「テキスト」を選択します。テキストボックスが開くので、画像に挿入したいテキストを入力しましょう。
【手順2】文字のサイズ、フォント、色を変更する
文字サイズやフォントは、テキスト選択時に画面下部に表示される「サイズ」タブから、フォントは「フォント」タブから変えられます。
文字の色を変える場合は、テキスト選択時に画面下部に表示される「カラー」タブ内の「テキスト」をタップします。
続いて、以下のいずれかの方法で文字色を変更してください。
1. 「スウォッチ」の中にある色から好きな色を選ぶ
2.「スポイト機能」を使って画面内の色を選ぶ
3.「カスタム」で色を指定する
文字色を変更し、編集画面の右側のチェックアイコンをタップすると、変更した文字色が適用されます。
同様に他のテキストも挿入し、色やフォントを調整します。その後、タップして移動しお好みの位置に配置しましょう。
これで文字の挿入は完了です。
フレームを付ける方法
画像にフレームを付けると、引き締まった見た目となり、よりおしゃれな印象を与えられます。
【手順1】四角形を挿入する
フレームを付けるには、「+」ボタンをタップ後、「素材」→「図形」を選びましょう。すると様々な図形が表示されるので、四角形をタップします。
【手順2】「塗り」と「境界線」の色を設定する
四角形がフレームに見えるように、「塗り」をつけずに、「枠線」をグレーに設定します。挿入された図形を選択した状態で、画面下部の「枠線」をタップしましょう。すると、文字色と同じようにスウォッチやカスタムで色を変更できるようになります。今回は「スウォッチ」からグレーを選び、編集画面の右側のチェックアイコンをタップしましょう。
枠線に色が付いたら、次は「塗り」をタップし、同様の手順で塗りをなしにします。
【手順3】サイズと境界線の太さを調整する
色の調整が完了したら、画像の辺や角をタップしながら動かして、大きさや形を調整しましょう。
サイズを調整したら「境界線」タブでスライダーを動かし、境界線の太さを調整してください。
【手順4】重ね順を変更する
このままでは四角形が画像の一番上に乗っており、枠線がテキストの上に被っているので、四角形を最背面に移動します。「レイヤー」タブから、スライダーを一番下に動かすと、四角形が最背面に移動します。
このあと、必要に応じて画像や文字の位置を調整したら完成です。画面右上のダウンロードボタンをタップして、画像をダウンロードしましょう。
ここまで、コラージュの作成方法を解説しましたが、上記でご紹介したのはあくまでも一例です。Adobe Expressには本記事でご紹介した以外にも様々な機能があります。直感的に使えるので、ぜひ様々な機能を試してオリジナルのコラージュを作成してみてください。
おしゃれなコラージュを作れるデザイン作成アプリ「Adobe Express」
Adobe Expressは、画像や動画をカンタンかつおしゃれに加工できる、無料のデザイン作成アプリです。Instagramにはない加工機能やおしゃれなフォント、テンプレートを使って、オリジナルの画像を短時間で作れます。
また、無料プランでも数十万点、プレミアムプランでは数億点の素材を使えるので、他とは違うオリジナルな投稿を作れるのも特徴です。
Adobe Expressは会員登録・ログインをすれば無料ですぐに使えます。会員登録にかかる時間は30秒ほどです。以下からアプリをインストールしてご利用ください。
コラージュ作成に使えるおしゃれなテンプレート42選
コラージュ画像のデザインに迷ったときに使える、Adobe Expressのオススメのテンプレートをご紹介します。もちろん、商用利用も可能です。気になるテンプレートがあったら、タップしてAdobe Expressから使ってみてくださいね。
フィード用
Collection ID
(To pull in manually curated templates if needed)
Orientation
(Horizontal/Vertical)
Width
(Full, Std, sixcols)
Limit
(number of templates to load each pagination. Min. 5)
Sort
Most Viewed
Rare & Original
Newest to Oldest
Oldest to Newest
Premium
(true, false, all) true or false will limit to premium only or free only.
ストーリーズ用
Collection ID
(To pull in manually curated templates if needed)
Orientation
(Horizontal/Vertical)
Width
(Full, Std, sixcols)
Limit
(number of templates to load each pagination. Min. 5)
Sort
Most Viewed
Rare & Original
Newest to Oldest
Oldest to Newest
Premium
(true, false, all) true or false will limit to premium only or free only.
Adobe Expressを使ってコラージュを楽しもう
Adobe Expressを使って、Instagramでよく見かける定番のコラージュの作り方をご紹介しました。この記事の内容を参考におしゃれな投稿を作成し、インスタライフをもっと楽しみましょう。