本文へスキップ
Moriqa
Moriqa を支援ログイン

エディター

スプライトとタイル

ドット絵とカラー

画像を編集

画像を変換

AI

Moriqa

スプライトのアウトラインを生成

スプライトのまわりに、きれいなアウトラインをひと手間で付けます。1 ピクセルでもそれ以上でも、好きな色で、ぼけは一切ありません。画像がデバイスの外に出ることはありません。

お使いのデバイス上で作成します。画像がアップロードされることはありません。

  • アップロードなし
  • ピクセルパーフェクト
  • 複数の画像を一度に

仕組み

スプライトにアウトラインを付ける方法

  1. ステップ 1: スプライトを追加

    背景が透明なスプライトを選択、ドロップ、または貼り付けます。フォルダーごとでも大丈夫です。

  2. ステップ 2: アウトラインを選ぶ

    太さと色、角を丸めるか角ばらせるか、絵の外側か内側かを設定します。

  3. ステップ 3: PNG をダウンロード

    スプライト 1 枚、または同じアウトラインを付けたすべてのスプライトを ZIP で保存します。

スプライトにアウトライン

手で描くようなアウトライン

  • ピクセル単位のみ

    アウトラインは単色の不透明なピクセルでできていて、ぼけもやわらかい縁もありません。

  • 丸めるか、角ばらせるか

    斜めの角を空ける定番のアウトラインか、角も埋めるより太いアウトラインか。

  • 余白は自動で

    キャンバスがアウトラインの太さだけ広がるので、端に触れているスプライトも切れません。

  • 好きな色で

    黒、白、パレットの暗い色、または好きな色を選べます。

詳しく見る

ドット絵のアウトライン

アウトラインの作られ方

絵に接しているすべての空きピクセルが、アウトラインの色になります。「丸める」では、絵の真上、真下、真横のピクセルだけを数えるので、斜めの角は空いたままになります。ドット絵のアーティストが手で描くアウトラインです。「角ばらせる」では斜めも数えます。

アウトラインは完全に不透明なピクセルでできています。画像にもともとあるやわらかい縁や淡い光は残され、アウトラインの上に重ねられるので、アンチエイリアスのかかった絵にもきれいなアウトラインが付きます。

アウトラインの選び方

  • 太さ:64 ピクセル程度までのスプライトなら 1 ピクセル。もっと大きな絵やステッカー風にしたいときは 2 ピクセル以上。
  • 色:黒はどんな背景でも読みやすい色です。スプライト自身のパレットの暗い色を使うと、やわらかく、意図のある見た目になります。
  • 「内側」:絵のいちばん外側のピクセルを塗り替えるので、スプライトのサイズは変わりません。タイルセットや固定のスプライトシートなど、サイズを変えられないときに使います。
  • 「アウトラインの余白を作る」:画像を各辺で太さの分だけ大きくします。サイズを保ちたいときはオフにしますが、端に触れているスプライトはそこで切れます。

アウトラインが役立つ場面

アウトラインは、込み入った背景からスプライトを切り離します。プレイヤーが見失ってはいけないもの、つまりキャラクター、アイテム、敵でとくに重要です。

何かが選択されている、または使えることを示す一般的な方法でもあります。ポインターが重なっている間、スプライトを明るいアウトライン付きで描きます。アウトライン付きのコピーをここで作り、ゲーム内で 2 つを切り替えてください。

スプライトにアウトライン

よくある質問

画像はどこかにアップロードされますか?

いいえ。すべてお使いのデバイス上のブラウザーで実行されます。画像が Moriqa やほかの誰かに送信されることはなく、ページを閉じたあとは何も残りません。

スプライトにアウトラインを付けるには?

スプライトを追加し、太さと色を設定して、PNG をダウンロードします。ツールがスプライトの形を認識できるように、背景は透明である必要があります。

画像が大きくなったのはなぜですか?

アウトラインには余白が必要です。「アウトラインの余白を作る」がオンのとき、どこも切れないように、画像は各辺でアウトラインの太さの分だけ大きくなります。

スプライトシート全体にアウトラインを付けられますか?

はい、フレームの間に空きがあれば可能です。フレームの位置を変えないように「アウトラインの余白を作る」をオフにするか、「内側」を使ってください。

画像の背景が透明ではありません。使えますか?

そのままでは使えません。アウトラインが画像全体を囲んでしまいます。先に「背景を削除」で背景を取り除いてから、アウトラインを付けてください。

たくさんのスプライトに一度にアウトラインを付けられますか?

はい。好きなだけ追加できます。すべてに同じアウトラインが付き、ZIP でまとめてダウンロードできます。

アウトラインを自分で描きたいですか?

Moriqa のドット絵エディターを開いて、スプライトを 1 ピクセルずつ描いたり整えたりできます。ブラウザーで無料です。