オンライン写真編集ソフト「Photopea」を使ってみた!キャンバスサイズで画像のはみ出し、空白を整える。

2020年5月23日デザイン

オンライン写真編集ソフト「Photopea」を使ってみた!キャンバスサイズで画像のはみ出し、空白を整える。

Photopea ホーム画面

https://www.photopea.com/

オンライン無料写真編集ソフト「Photopea」は登録不要ですぐに写真の編集が始められます。普通に使いやすいのでおすすめです。

今回は「キャンバスサイズ」を使って画像のはみ出しや空白部分を整えてみます。下の画像ですが、

Photopea 編集→変形→回転90度

もともと、横向きで表示されていたのを「回転」を使って横から縦へと変更しました。

オンライン写真編集ソフト「Photopea」を使ってみた!回転を使って画像の向きを変更する。

ただこの画像、左右の空白と上下のはみ出しが気になります。気になりますよね?これをなんとかしていきたいと思います。

ここで使うのが「キャンバスサイズ」です。WEBサイトのデザインをするときなんかはこれを使うと調整が楽なので頻繁に使っていましたが、こういう時にも使えるので覚えておくと便利です。

日本語への変更↓↓

オンライン写真編集ソフト「Photopea」を使ってみた!英語表示を日本語へ変更してみる。

それでは始めていきましょう。まずはメニューの「イメージ」をクリックしてください。

Photopea メニューのイメージ

「イメージ」をクリックするとドロップダウンメニューが表示されます。その中から、

Photopea イメージ→キャンバスサイズ

「キャンバスサイズ」をクリックしてください。するとPhotopea上にポップアップメニューが表示されます。

Photopea イメージ→キャンバスサイズ

これを使って画像の幅と高さを変更します。今表示されているのが、現在のキャンバスサイズになります。つまり上の画像の場合、3264×2448になります。

今回は画像のサイズぴったりに合わせたいと思います。どうやるかというと、幅と高さを入れ替えてあげます。幅が3264pxで高さが2448pxなので、幅を2448px、高さを3264pxにしてあげます。

Photopea イメージ→キャンバスサイズ

こんな感じ。これでOKをクリックします。すると、、、

Photopea イメージ→キャンバスサイズ変更

空白がなくなり上下のはみ出しもなくなりました。いい感じですね。「キャンバスサイズ」はこんな風にも使えるので知っていると便利です。

イメージ→キャンバスサイズ→幅、高さの入力→OKの順ですね。

ちなみに、、

Photopea イメージ→キャンバスサイズの基準位置

この基準位置を変更するとキャンバスサイズを変更した時の位置が変わってきます。百聞は一見になんとやらということで、この状態(基準位置が左上の状態)でOKを押してみましょう。

Photopea イメージ→キャンバスサイズの基準位置変更

見てください。先ほどとpxの数値は同じなのに基準位置を変更したので仕上がりが変わりました。もし同じようにやっているのに、こんな風にずれた感じで表示される場合は基準位置を確認してみてください。

ついでに、基準位置の上の「相対」も見てみたいと思います。気になってた方もいらっしゃるのでは?キャンバスサイズの「相対」にチェックを入れてみます。チェックを入れると、

Photopea イメージ→キャンバスサイズの相対

幅と高さが0になります。これは今の位置を表示してくれています。ここで、、

Photopea イメージ→キャンバスサイズの相対の幅に100と入力

幅に100と入力してみます。どうなるでしょう?「OK」をクリックします

Photopea イメージ→キャンバスサイズの相対の幅に100と入力後の画像

キャンバスサイズが横に100広がりました。ここで重要なのが基準位置です。基準位置を中央にしていたので左右に50px増えました。ここで基準位置を変えるとまた違った表示になります。

キャンバスサイズの「相対」を使うと増やしたり減らしたりが楽にできますね。px表示でどれくらい増やしたのか減らしたのか見たいって場合もあるので、そこは臨機応変にって感じですね。

今回はPhotopeaの「キャンバスサイズ」を使って画像の空白やはみ出しを整えてみました。Photopeaは無料で使えるオンライン写真編集ソフトです。使ってみるとその使いやすさがわかるかなと思います。ぜひ試してみてください。