インスタ投稿をおしゃれなコラージュにする方法とオススメの無料アプリ

インスタのコラージュ投稿の作り方をご紹介。Adobe Expressで画像を編集する方法も解説します。

Adobe Expressを早速試しましょう

Instagramのフィードやストーリーズで、複数の画像を組み合わせたおしゃれなコラージュ画像を見たことがあるでしょう。コラージュ画像は、Instagramの機能または画像編集アプリで作れます。

この記事では、Instagramでよく見かける以下2パターンのコラージュの作り方をご紹介。コラージュをおしゃれにする背景色付きの文字の入れ方やフレームの付け方も解説します。

ちなみに、上記のコラージュ画像のうち、Instagramの機能を使って作れるのは左側の「ストーリーズ用のグリッドレイアウト」の画像のみです。幅広いデザインの画像を作るには、画像編集アプリが必要です。

まずはInstagramの機能だけを使ってグリッドレイアウト画像を作る方法を解説します。後半では、無料の画像編集アプリ「Adobe Express」を使って多彩なコラージュ画像を作る方法も見ていきましょう。

style

long-form

Levels

Instagramのストーリーズでコラージュ投稿を作る方法

Instagramのストーリーズは、以下のようにグリッド（格子）のレイアウトに複数の写真を組み合わせて投稿できます。

この投稿を作る手順について詳しく解説していきます。

【手順1】「レイアウト」を選択する

プロフィールページの右上の「＋」アイコンをタップし、「ストーリーズ」を選択します。次に左上の「カメラ」をタップし撮影画面を開いたら、画面左側のグリッドのアイコンをタップします。

【手順2】好みのグリッドを選択し、写真を挿入する

作りたい構図のグリッドを選択すると、編集可能なグリッドのみが撮影モードに切り替わります。撮影ボタンをタップして撮影をするか、左下のアイコンから自分のスマホ内にある画像を選んでください。

画像を挿入し終えたら、画面下部のチェックマークをタップし、完了します。

なお、各グリッドでは挿入した画像の中央部分が表示され、表示位置の微調整はできません。見せたい部分が上手く表示されない場合は、見せたい部分が各画像の中央に来るように、スマホの写真アプリのトリミング機能で画像を加工しておきましょう。

【手順3】背景色付きの文字を入れる

編集画面の上部にある「Aa」のアイコンをタップすると、文字の挿入や見た目の変更ができます。

表示されたテキストボックスに文字を入力し、画面上部のアイコンから背景色を付けたり、文字色を調整したりしましょう。

文字の見た目を調整したら画面右上の「完了」をタップし、変更を適用しましょう。テキストをドラッグし、位置を調整したら完成です。

そのほかのInstagramの機能も使い、お好みに合わせて加工したら、ストーリーズに投稿しましょう。

このようにInstagramの機能だけで加工できるのは、ストーリーズ用の画像のみです。フィード投稿用に画像をコラージュ加工したい場合は、画像編集用のアプリを使う必要があります。そこで続いて、画像の切り抜きや配置などの編集がカンタンにできる、無料のデザイン作成アプリ「Adobe Express」を使って、コラージュ画像を作る方法を解説します。

「Adobe Express」を使ってコラージュ画像を作る方法

ここでは、以下の2パターンのコラージュ画像をAdobe Expressで作る方法を解説します。

複数の写真をグリッドで組み合わせる（グリッドレイアウト）
切り抜き画像を自由に配置する

なお「Adobe Express」は、アプリのダウンロード後、無料で会員登録（30秒で完了）をした後、ログインするとすぐにご利用いただけます。以下よりアプリをインストールしてご利用ください。

【iPhone・iOS用】アプリをダウンロードする

【Android用】アプリをダウンロードする

まずは「1．グリッドレイアウト」の画像の作り方から解説していきます。

【パターン1】複数の写真をグリッドで組み合わせる（グリッドレイアウト）

グリッドレイアウトの画像を作る前に、組み合わせたい写真を用意しておきましょう。

なお、ここではフィード用の画像の作成手順を紹介しますが、ストーリーズ用の画像も同じ手順で作れます。

【手順1】フィード用の編集画面を開く

Adobe Expressにログインしたら、画面上部の「Instagram投稿」をタップし、フィード投稿用の画像の編集画面を開いてください。ストーリーズ用の画像を作りたい場合は「Instagramストーリー」を選んでください。

「ダブルタップしてテキストを編集」の文字を編集すると画像に任意の文字を入れられます。ここでは画像を編集しやすくするため、テキストをタップし、画面下部の「編集」タブからテキストを「削除」しておきましょう（後でテキストの追加は可能です）。

【手順2】レイアウトを選び、画像を挿入する

画面左下の「レイアウト」から作りたいレイアウトを選び、右下の「完了」をタップします。

編集画面に戻ったら、画像を挿入したいエリアをタップし画面下部の「編集」→「置き換える」をタップしましょう。すると画像の参照場所を選べるので、スマホ内に保存している画像を使う場合は「フォトライブラリ」、動画を使う場合は「ビデオ」を選びましょう。「カメラ」を選ぶと、その場で撮影した写真を挿入できます。

挿入したい画像を選ぶと、自動で画像が挿入されます。

画像をドラッグすると表示位置を調整できるので、表示させたい部分が見えるように調整し、右下の「完了」をタップしましょう。

他のエリアについても同様の手順で画像を挿入したら、グリッドレイアウトを使った画像の完成です。このまま画像をフィードに投稿する場合は、画面右上のシェアボタン（上向き矢印）をタップし、「Instagram」→「フィード」を選びます。すると、Instagramのアプリが開くので、通常のフィードと同様の流れで投稿しましょう。

グリッドレイアウトでコラージュするだけでも投稿が華やかになりますが、続いて紹介する手順で、背景色付きの文字を入れると、よりおしゃれな投稿を作れます。

背景色付きの文字を入れる方法

Adobe Expressでは背景色付きの文字をカンタンに入れられます。

【手順1】テキストを挿入する

画面下部の「追加」→「テキスト」をタップし、画像に挿入したい文字を入力します。

挿入したら、まずはドラッグして位置やサイズを調整しましょう。

【手順2】背景色を付ける

次に、テキストを選択した状態で「効果」→「シェイプ」をタップし、さらに「シェイプ」の下にある調整バーをタップします。すると、テキストに帯や四角形、リボンなどの背景を付けられます。

今回は文字の背景に四角を置きたいので、四角のシェイプを選びます。また、メニューの左上にある色付きのボックスをタップすると色の変更が可能です。

【手順3】フォントと文字色を変更する

フォントは「フォント」タブから、文字色は「カラー」タブの「テキスト」から変更できます。

文字色を変える場合、「テキスト」をタップして以下のいずれかの方法で色を変更してください。

「スウォッチ」の中にある色から好きな色を選ぶ
「スポイト機能」を使って画面内の色を選ぶ
「カスタム」で色を指定する

配色に慣れていない人は、「スウォッチ」から色を選ぶか、スポイト機能で抽出した画像上の色を使ってみましょう。スポイト機能を使うには、取りたい色の場所にスポイトをドラッグするだけです。画像上にある色を背景色や文字色に使うと、画像に統一感が出て、洗練された印象を与えやすくなるので、配色に迷ったらぜひ使ってみてください。

色が決まったら、画面右下の「完了」をタップして色を適用させて完成です。

続いて、切り抜き画像を自由に配置するパターンのコラージュ画像の作り方について解説します。

【パターン2】切り抜き画像を自由に配置する

ここでは「Adobe Express」を使って、切り抜いた画像を自由に配置したコラージュを作る方法をご紹介します。

なお、今回はストーリーズ用の画像の作成方法をご紹介しますが、画像サイズを変更すればフィード用の画像も同じように作成できます。

【手順1】ストーリーズ用の編集画面を開く

Adobe Expressにログインしたら、画面上部の「Instagramストーリー」をタップし、ストーリーズ投稿用の画像の編集画面を開いてください。フィード用の画像を作りたい場合は「Instagram投稿」を選んでください。

「ダブルタップしてテキストを編集」のテキストを編集すると、画像に任意の文字を入れられます。ここでは画像を編集しやすくするため、テキストをタップし、画面下部の「編集」タブからテキストを「削除」しておきましょう（後でテキストの追加も可能です）。

また、画像の背景色は、画面の背景をタップし「カラー」から好きな色を選ぶことで変えられます。今回作りたい画像の背景色は白のため、このまま編集を進めます。

【手順2】切り抜きたい画像を挿入する

画像を挿入するには、編集画面で「追加」→「写真」を選択します。スマホ内に保存している画像を使う場合は「フォトライブラリ」、その場で撮影した写真を挿入する場合は「カメラ」を選択しましょう。「フォトライブラリ」からは、一度に複数枚の画像の挿入も可能です。

なお「Adobe Stock写真」からは、数十万点の写真素材を無料で使えるので、コラージュに必要な場合はぜひご利用ください。（プレミアムプランでは数億点の素材を利用できます）

スマホのフォルダやAdobe Stockの写真素材を選択すると、「背景にピン留め（固定）」するか「自由に移動」するかを選ぶポップアップが開くので、「自由に移動」を選びましょう。

これで画像を好きな場所に配置できます。

【手順3】画像を切り抜く（背景を削除する）

切り抜きたい画像を選択した状態で、画面下部の「編集」→「背景を削除」をタップします。これだけでカンタンに画像の背景を削除できます。

他の画像も同様の手順で切り抜いたら、各画像をドラッグして好きな場所に移動しましょう。

なお、画像の背景に他の目立つ要素が入っていたり、複雑な模様になっている場合はうまく切り抜けない場合があるので、なるべく背景がシンプルな画像を使うとよいでしょう。

これで画像の切り抜きは完了です。ここにテキストやフレームを追加して、おしゃれに仕上げましょう。

文字を画像に挿入する方法

続いて、Adobe Expressで画像に文字を挿入する手順を解説します。

【手順1】文字を挿入する

文字を挿入するには編集画面の下部から「追加」→「テキスト」を選択します。テキストボックスが開くので、画像に挿入したいテキストを入力し「完了」をタップしましょう。

【手順2】文字のサイズ、フォント、色を変更する

文字サイズやフォントは、テキスト選択時に画面下部に表示される「サイズ」タブから、フォントは「フォント」タブから変えられます。

文字の色を変える場合は「カラー」タブ内の「テキスト」をタップします。

続いて、以下のいずれかの方法で文字色を変更してください。

「スウォッチ」の中にある色から好きな色を選ぶ
「スポイト機能」を使って画面内の色を選ぶ
「カスタム」で色を指定する

文字色を変更し、画面右下の「完了」をタップすると、変更した文字色が適用されます。

同様に他のテキストも挿入し、色やフォントを調整します。その後、タップして移動しお好みの位置に配置しましょう。

これで文字の挿入は完了です。

フレームを付ける方法

画像にフレームを付けると、引き締まった見た目となり、よりおしゃれな印象を与えられます。

【手順1】四角形を挿入する

フレームを付けるには、編集画面で「追加」→「シェイプ」を選びましょう。すると様々な図形が表示されるので、四角形を選び、右上の「追加」をタップします。

【手順2】「塗り」と「境界線」の色を設定する

四角形がフレームに見えるように、「塗り」をつけずに、「境界線」をグレーに設定します。挿入された画像をタップし、「カラー」タブを開いたらまずは「境界線」をタップしましょう。すると、文字色と同じようにスウォッチやカスタムで色を変更できるようになります。今回は「スウォッチ」からグレーを選び、右下の「完了」をタップしましょう。