ペイント（ベータ版）の紹介〜Monaca Education「ツール」機能〜
お断り
以下の記事で紹介するMonaca Educationの機能「ペイント」は、2024年5月時点ではベータ版（試用版）として提供しています。記事公開後、画面、機能や操作性が変更される場合があります。
ペイント（Monaca Education）
ペイント（Monaca Education）は、いわゆる画像編集ソフト、ペイントソフトの一種です。PC、Webブラウザ、マウスを用いて、絵を描いたり、写真などの画像を加工することができます。
Monaca Educationに組み込まれた機能で、単体では利用できません。利用するためには、まず、Monaca Educationにログインする必要があります。
Monaca Educationへのログインには、アカウントが必要です。Monaca Educatinのアカウントを持っていない方は、こちらをご覧ください。
miniPaint
Monaca Educationのペイントは、miniPaintというオープンソースのソフトウェアを利用して実現しています。
miniPaint のプロジェクトページはこちらです。
機能の詳細や制限などについては、上のプロジェクトページが参考になります。
起動
Monaca Educatinにログインし、ダッシュボード画面でプロジェクトを作成するか、既存のプロジェクトを選択して、Monaca Education IDEを開きます。
画面上の「ツール」メニューから、「ペイント」をクリックして、起動します。
Webブラウザの別のタブが開き、ペイント機能が表示されます。
画面中央が、加工する画像を表示している領域です。
画面左には、線や図形を描くためのツールが縦に並んでいます。
画面右には、色の指定をしたり、レイヤーを操作したりするためのパネルが並んでいます。
使用例：写真の中に文字を入れる
ペイントソフトを用いると、様々な絵を描いたり、画像を加工したりできます。
今回は、簡単な使用例として「写真の中に文字を入れる」という使い方を紹介します。
非常に簡単な使い方ですが、ポスターや、書籍の装丁、アルバムジャケットのような作品を作ることができます。
ファイルを開く
最初に、文字を入れたい写真のファイルを開きます。
画面左上の「ファイル」メニューから「開く」>「ファイルを開く」と選択して、
PCのフォルダにある画像を選択します。以下は、ファイルが読み込まれた様子です。
今回は、自分で撮影したスカイツリーの写真を選んでみました。
なお、開いたファイルが、画面の中で小さく表示されてしまったり、大きく表示されてしまったりして、全体を見渡しにくい場合は、画面右上の「プレビュー」のパネルにある「フィット」ボタンをクリックすると、適正な拡大率に調整してくれます。
「テキスト」ツールで文字の領域を作る
画面左側にあるツールバーから、テキストツールを選びます。「T」というアイコンがそれです。
選択したツールは、緑色になります。写真の上でドラッグして、文字を入れる領域を作ります。
文字の領域に文言を入れる
領域の中に、文字を入力します。
このとき、日本語の入力がうまく行えない場合があります（ローマ字入力中に、変換されずに入力されてしまう）。
その場合、メモ帳など、他のアプリにあらかじめ文字を入力しておき、それをコピー＆ペーストしてペイントのテキスト領域に貼り付けると、うまく入力できます。
なお、テキストツールを使っている間、画面の上には、文字のフォントやサイズ、効果（ボールド、イタリック、下線、取り消し線）、色などを指定するオプションメニューが表示されています。
テキストの入力エリアは、レイヤーになる
画面右下の「レイヤー」パネルを見ると、写真のレイヤーの上に、テキストのレイヤーが乗っていることが分かります。ツールを使って、テキストや図を追加すると、追加した要素はレイヤーになります。
追加したテキストについて、内容を変更したり、変形させたり、編集を加えたい場合は、画面左上の矢印ボタン（選択ツール）を使うか、
画面右下のレイヤーパネルで、対象のレイヤーを選択するようにしてください（選択中のレイヤーは、緑色に表示されます）。間違ったレイヤーや対象を選ぶと、思ったような編集ができません。
変形する（位置と傾きの変更）
選択したテキストの周りに丸が表示されています。この部分をドラッグすると、サイズを変更したり、傾きを変えたりできます（※傾きを変えたいときは、黄色の丸をドラッグします）。
今回は、スカイツリーを見上げる角度に添わせてみました。
レイヤーをマージする
画面上のメニュー「レイヤー」から、「マージダウン」を選ぶと、
レイヤーがマージ（統合）され、１つのレイヤーになります。
複数のレイヤーをマージ（統合）すると、その後はそれぞれのレイヤーにあった要素（写真、テキストなど）ごとの変更ができなくなります。誤操作による間違った編集を防ぐことができます。
完成したファイルをダウンロードする
ファイルメニューから「エクスポート」を選択することで、作成したファイルをダウンロードできます。
エクスポートメニューでも、ファイルのフォーマットをはじめとして、様々なオプションが指定できます。
手軽な画像編集機能を、情報デザインやアプリ開発に役立てよう
世の中には、高機能な画像編集ソフトがたくさんありますが、手軽に使えるので、ぜひMonaca Educationに組み込まれた画像編集機能も試して欲しいと思います。
情報デザイン（Webページ制作）や、アプリケーション開発に役立ててください。
