Photopeaの使い方、整列

今回は、Photopeaという画像編集ツールの紹介と、オブジェクトの整列について紹介したいと思います。

Photopea

Photopea

GIMPに変わる画像編集ソフトないかなって探していたところ、Photopeaというものを見つけました。

主な特徴は、
1.フリーツール
2.インストール不要、ブラウザで使えるオンラインエディタ
3.GIMPの代わりが十分できそう(まるでPhotoshop)

オブジェクトのレイアウト、整列

Photopeaは、オブジェクトが境界や中央に対しスナップします。水平、垂直や画面の上下左右でピタッと止まるのでレイアウトがしやすくなっています。

オブジェクトのレイアウトは移動ツールを使用し、整列ボタンをクリックしてオブジェクトを揃えることができます。

画面の中央に配置

オブジェクトを整列させるためには、基準となるものを決めないといけません。画面中央にオブジェクトを配置するなら、画面全体を選択範囲とします。

Ctlr+Aで画面全体を選択範囲とすることができます。選択範囲は点線で囲われます。

画面全体が選択範囲になっている状態で水平、垂直に中央揃えの整列ボタンをクリックします。

このようにオブジェクトが画面の中央に配置されます。

複数のオブジェクトを揃える

このようにバラバラに配置されているオブジェクトを整列させてみます。

整列させたいオブジェクトをCtrl+クリックで複数選択します。

垂直方向に対し中央揃えをすると、バラバラだったABCが横一列に整列します。続いて等間隔のボタンをクリックすると、ABCの字間が同じ間隔になるように整列します。

新規フォルダを作成し、その中にABCのオブジェクトを入れます。Ctrl+Aで全てを選択し、フォルダを先ほどの中央揃えの要領で水平垂直に中央揃えにすると、ABCが整列しつつ画面の中央に配置することができます。

複数オブジェクトをひとつの塊として中央揃えにするときは、フォルダの中に入れてフォルダを画面中央に配置するというのがポイントですね。

オブジェクトを基準に整列

画面右側、四角形オブジェクトの中央にテキストBを配置したい。

まず、基準を右側の四角形にします。

四角形オブジェクトのサムネイルをCtrl+クリックするとオブジェクトのピクセルが選択されます。選択範囲は点線で表示されます。

その状態でテキストBを水平垂直に中央揃えにすると、右側の四角形の中央に配置することができます。

いかがだったでしょうか。
オブジェクトの整列はレイアウトに欠かせない作業なので覚えておきたいところです。是非、参考にしてみてください。