こんにちは、ブブです。
今回は「お金がないから高額なソフトは買えないなー」「買う前に練習したいなー」という人のために、無料で使えるオンライン画像編集ツール、「Photopea」でロゴを作ってみたので、作成方法を紹介します。
Photopeaとは?
「Photopea」は無料で、ダウンロード不要、会員登録不要でオンライン上で利用できる、画像編集ツールです。ネット環境があればPCでもスマホでもタブレットでも、手っ取り早く始められます。
JPG・PNG・SVG・PSD・GIFなどのファイル形式での保存が可能で、Photoshopで作ったファイルも編集することができます。
Photopeaを使ってみる。
ここからは「Photopea」を使ってロゴを作っていきます。
作ったロゴは当ブログのタイトルにある、「カモノブブ」のロゴです。
背景が透過できるので、ロゴ作成に向いていると思います。

まずは「Photopea」のサイトへ行きます。

サイトへ行くとこの画面になります。
「新規プロジェクト」をクリックします。
- ファイル名です。
- 目的に合わせて数値を入力してください。
- 白・黒・透明・最背面が選べますが、今回は透明に設定します。
- 規定のサイズを選択することもできます。今回は「Social」の「FB Page Cover」を選びます。
- 「作成」をクリックします。

するとこのような画面が出ます。PhotoshopとUIが似ています。まずはオブジェクトを出します。左のバーから「矩形」を選びます。長押しすると他の形も選ぶことができます。


オブジェクトを1つ追加するとレイヤーが1つ追加されていきます。テキストボックスなども同じです。オブジェクトを新しく描くとレイヤーが追加されていきます。

色の変更は上のバーからできます。「フィル」では塗りつぶしのタイプと色を変更します。

「ストローク」でオブジェクト周囲の縁のタイプと色を変更します。

縁の太さを変更します。

角を丸めたり、線種を変更することも可能です。

右にあるバー内、「プロパティ」アイコンをクリックすると詳細が表示されます。
ここで図形の形を数値を指定して変更することができます。

図形を設置して、色や形の変更を繰り返して、ロゴのベースを作成します。

オブジェクトの整列を行う方法は、レイヤーから揃えたいオブジェクトを複数選択し、上のバー内のアイコンで上下左右、水平、垂直、縦横等間隔にすることが可能です。

形がある程度決まったら、たくさんのレイヤーがあり煩雑なので、整理します。「カ」に関わるレイヤーを全て選択して、1つのレイヤーにまとめます。複数のオブジェクトを1つのレイヤーにまとめると、その中にあるそれぞれのオブジェクトは個別に編集できなくなってしまうので注意してください。


「カ」のオブジェクトに傾きをつけます。一番上のバーから「編集」をクリックして、「自由変形」を選びます。

上のバー内、「V」の角度を指定するとオブジェクトを水平に傾けられます。

「カ」以外の、「モ」「ノ」「ブ」「ブ」もそれぞれをレイヤーにまとめて、水平傾斜を加えて、位置を整理して完成です。

出力はpsdやjpeg、pngなど各種指定できるので、目的に合わせて使用できます。

Photopeaを使ってみた感想。
Photopeaを使うのは今回が初めてだったのですが、UIも分かりやすく、使いやすいです。今回作成したロゴは単純な図形の組み合わせということもあり、比較的短時間で作成できたかなと思います。今後もイラストや写真編集で使用する予定なので、その時にはまた記事にしたいと考えています。
コメント