top of page

WixでAdobe Expressとの連携機能を使い、ホームページの画像を魅力的にデザインしよう


WixでAdobe Express を使って画像編集

アドビのデザインアプリ「Adobe Express」が、Wix 上で使えるようになりました。Adobe Express は誰でも簡単に、画像や動画コンテンツを編集できるアプリです。無料で始められ、背景削除や画像生成といった AI 機能など様々な機能が利用できます。


本記事では Wix エディタ上で Adobe Express を使って、画像を編集する方法をご紹介します。

\いますぐ Wix でホームページを作成/


Adobe Expressとは


Adobe Express とは、誰でも簡単に魅力的なコンテンツが作れるデザインアプリです。


豊富なテンプレートが用意されていて、ホームページや SNS、Web 広告などで使用するコンテンツ、ロゴやチラシ、プレゼンテーション用の資料、動画などを作ることができ、無料で使えます。


また、高品質な画像やオーディオを提供する Adobe Stock や、数千ものフォントを提供している Adobe Fonts も Adobe Express の編集画面から直接使えます。これらの特長を活かして、様々な素材を組み合わせて思い通りのデザインを作成できます。


なお、Adobe Express にはブラウザで使える PC 版、スマートフォンやタブレットで利用できるアプリ版があります。同じアカウントでログインすれば、PC とアプリでスムーズにデータを共有することも可能です。


Adobe Express の編集画面


まずは Adobe Express に登録


Adobe Express のホームページからアカウント登録

Wix で Adobe Express の編集機能を使うには、Adobe Express のアカウント作成が必要です。すでに Adobe アカウントを持っている方は、お持ちの Adobe アカウントでログインできます。


Adobe Express は無料で利用できますが、有償版のプレミアムプランでは、無料プランよりもさらに多くの魅力的なテンプレートや、Adobe Fonts、Adobe Stock の画像、動画、オーディオ素材、大容量のストレージが使えるようになります。


気になる方はぜひこちらでチェックしてください。


ちなみに、Adobe Creative Cloud のコンプリートプランを契約している方は、Adobe Express のプレミアムプランの機能が利用可能です。



WixでAdobe Expressを使ってみよう


ここから Wix で Adobe Express を使う手順をご紹介します。

今回は Wix の「ブログ記事を作成」から画像を編集してみます。


まずは、「追加」から「画像」を選択し、編集したい画像をアップロード。

画像がアップロードされたら右下の「Adobe Expressで編集」をクリックしましょう。すると Adobe Express のメニューが表示されます。


Wixエディタから、Adobe Express 編集画面を開く


生成塗りつぶしを使ってみよう


Adobe Express には、簡単なテキストを入力するだけで、画像内に新たなオブジェクトを生成したり、置き換えたりできる「生成塗りつぶし」という機能があります。早速使い方をみていきましょう。


画像を選択して「生成塗りつぶし」メニューをクリックします。


このとき、画像を生成したいエリアをブラシで塗りつぶすと、青いマスクがかかります。


そして生成したいものをテキストで入力します(ここでは「フルーツナイフと白い皿」と入力)。生成ボタンをクリックすると、青いマスク部分に画像が生成されます。


Adobe Express の生成塗りつぶし機能

いちどの生成で3種類の画像が生成されますので、一番イメージに近い画像を選択します。生成された画像がイメージと違う場合は、テキストを変えて再度生成してみましょう。


背景を削除してみよう


Adobe Expressでは、ワンクリックするだけで自動で背景を削除できます。

画像を選択し、「背景を削除」をクリックすると、果物以外の背景がすべて削除されます。


「塗りつぶしなし」に設定すると背景を透明にできます。


Adobe Express で 背景を削除する方法


消しゴムツールを使ってみよう


続いて、「消しゴムツール」を使って、画像の一部を削除してみましょう。

消しゴムツールでは自分で削除したい箇所を選ぶので、先ほど紹介した「背景削除」より細かい調整ができます。


画像を選択し、「消しゴム」をクリックします。ブラシのサイズを指定し、消したいエリアをドラッグすると、画像を消すことができます。


消しゴムツールを使う

もし消しすぎた場合は「復元」で簡単に元に戻せます。


画像をトリミングしてみよう


Adobe Expressでは「切り抜き」機能を使って、好きな形に画像を切り抜くこともできます。


手順は、画像を選択して「切り抜き」をクリックし、後はトリミングしたい形を選択するだけ。直感的な操作で調整することができます。


トリミングした画像とデザイン素材を組み合わせて、魅力的な画像に仕上げましょう。

画像トリミング機能の使い方


テキストをデザインしてみよう


Adobe Express ではテキスト要素を、簡単におしゃれなデザインにすることもできます。「デザイン素材」から好きな素材を選び、テキストを入力してフォントを変更します。「テキストレイアウト」の「ダイナミック」をクリックすると、自動でダイナミックにテキストが配置されます。


テキストやタイポグラフィの作成方法

ちなみに、1番の「デザイン素材」で選べる素材は簡単に色を変更できます。1番のリボン形の素材はデフォルトでは金色ですが、上記の例では赤色に変更しています。


デザインが思いつかないときは、Adobe Express のさまざまなテンプレートを眺めて、アイデアを探すのもおすすめです。



Adobe Expressで編集したあなただけのデザインを、Wixで作成したホームページで活用しよう


Wix のエディタ上で Adobe Express を使えば、魅力的な画像・動画コンテンツを簡単にデザインし、より魅力的なホームページに仕上げることができます。


Wix と Adobe Express の連携機能を活用して、あなたのブログやホームページを素敵なものにしましょう。


\いますぐ Wix でホームページを作成/


Adobe Express

編集チーム

ja03.png
bottom of page