ニコニコ大百科:お絵カキコヘルプ

ニコニコ大百科の掲示板には「お絵カキコ」という機能があり、様々なイラストをニコニコ動画会員ならば誰でも描けるようになっている。
この記事は、そのお絵描き機能に関するヘルプである。

「お絵描きとかほとんどやったことない！」という人は後述の初心者向けチュートリアルを参照のこと。

概要

現在お絵カキコとして提供されているのは「HTML5版お絵カキコ」と通称されているツールである。その通称の通り、HTML5対応ブラウザで動作するペイントツールで、スマートフォンからの利用も可能。初期に提供されていたFlash版お絵カキコ「グニャラペイント」（以下、旧版）の後継として、2017年3月からサービスが提供された。
このツールのベースはpipa.jp社のブログサービス「手書きブログ」から提供されたもので、お絵カキコの名を冠してはいるが、旧版とは全くの別物である。

ペイントツールとしては比較的シンプルな部類であり、操作方法が簡単で分かりやすく初心者にも使いやすいものとなっている。旧版では投稿エラーなどの発生で描いた絵が消失する問題があったが、このHTML5版では自動バックアップ機能が搭載されていることで安心してお絵カキコを楽しめる。

反面、旧版で提供されていた、レイヤー、透過色、バケツ塗りつぶし、描画履歴のアニメ再生などの主要な機能がサポートされておらず、ユーザーからは機能改善を求める声が継続的に挙げられている。

PC版とスマートフォン版（以下、スマホ版）では、ツールの画面レイアウトや機能に差異が存在する。これについては各項目にて適宜説明する。

機能仕様

ペンの太さ、濃度、不透明度

• ペンの太さは、1,2,3,4,5,6,8,10,12,14,30ピクセルの11段階から選択可能。
  
  • このボタンはPC版は縦長、スマホ版は横長の一列で表示される（画像はスマホ版）。
• ペンの不透明度と濃度の指定はどちらか一方のみが有効となる。初期値は濃度100%。
  
  • PC版では上側が不透明度、下側が濃度のボタンとなる（画像）。スマホ版はそれぞれ1列で表示される。
  • 不透明度は10~90%の範囲で10%刻みで選択可能。0に近いほど透明に近づく。背景が透ける半透明の線が描かれる。
  • 濃度は10~100%の範囲で10%刻みで選択可能。0に近いほど白色に近づく。不透明度が常に100%の、背景が透けない線が描かれる。

色パレット、色作成画面

• 色パレットは「8色＋虹色1色」の9色を1セットとし、PC版では4セット、スマホ版では8セット使用できる。スマホ版の場合、左右スワイプでセットの表示切り替えができる。
  
  • １つの色枠には線の色（Line color）とふちどりの色（Rim color）が設定されている。
  • 線の色は通常の描画に使用され、ふちどりの色はふちどりペンでの描画時に輪郭線の色として使用される。
  • 虹色は、パレット内の8色の線の色（Line color）を順番に並べたもので、虹のような線が描ける。
• 色パレットの右上の歯車アイコンを押すことで、色作成画面が表示される。
  • カラーコードを直接入力指定することで色を変更できる。
  • カラーコード部分を押すと表示される色見本から色を選択することもできる。
  • 線色を変更すると、自動的に虹色の構成色に反映が行われる。
  • 「random」ボタンを押すとセット内のすべての色がランダムに設定される。
  • 「default」ボタンを押すとセット内のすべての色がデフォルトに戻される。
  • 「OK」ボタンで変更内容を確定。「CANCEL」ボタンを押した場合、変更内容は破棄される。

キャンバスの拡大／縮小

• キャンバスは×0.5～16.0の範囲で表示の拡大／縮小が可能。
  
  • PC版の場合、ルーペアイコンの操作で0.5単位での拡大／縮小が可能。
  • 表示拡大率の部分を押すと原寸（×1.0）に戻る。キャンバス位置も初期の中央に戻る。
  • スマホ版、またはPC版でタッチパネルが使える場合、ピンチ操作で0.1単位での拡大／縮小が可能。
    • また、スマホ版では表示拡大率が表示されない代わりに、原寸に戻す100%アイコンが存在する。

アイコンボタン

アイコン	説明
丸ペン	先の丸い線を引く。
ふちどり丸ペン	パレットに設定されたふちどりの色の輪郭線が付いた、先の丸い線を描画する。
角ペン	先の四角い線を引く。
ふちどり角ペン	パレットに設定されたふちどりの色の輪郭線が付いた、先の四角い線を描画する。
えんぴつ	鉛筆風の線を引く。線を太くするとエアブラシのような効果になる。
ドットペン	ドット絵調のペン。等間隔に正方形を描画する。
筆ペン	描画速度に応じて強弱のついた線を引く。筆圧は対応していないので影響しないが、書き始めの太さは直前に書いていた線の太さを引き継ぐ。
消しゴム	先の四角い消しゴム。なぞった部分の描画を消去する。
スポイト	キャンバス内で指定した座標の色を読み取り、一時的な線色（Line Color）とする。記憶中の色はスポイトアイコン内に表示される。
ゴミ箱	キャンバス全体を消去する。
100%	[スマホ版のみ]表示拡大率、およびキャンバス位置をリセットする。
ハンドツール	キャンバスの表示位置を移動する。
移動ツール	キャンバスに描かれた絵を移動する。キャンバスからはみ出した部分は消去される。
アンドゥ	直前の操作を取り消す。最大51回まで。
リドゥ	アンドゥを取り消す。最大51回まで。
描画履歴	描画履歴を一覧表示し、指定した時点のキャンバスを復元する。 （自動バックアップ機能）
補助線	補助線のON/OFFを切り替える。デフォルト:ON 表示される補助線は、実際に投稿される画像には影響を及ぼさない。 また分割数などは一定で、指定・変更する機能は無い。
補正	入力を補正して、手ぶれのないなめらかな線を描けるようにする。デフォルト:ON ズーム時にペンの描画がカクカクする場合は、補正を無効にすると解消できることがある。

自動バックアップ

• 10ストローク（10回線を引く）毎にキャンバスのバックアップが自動的に作成される。
• 描画履歴アイコンを押すと作成済みのバックアップのサムネイルが一覧表示される。
  • サムネイルには日時が付与されているが、日時順にソートされていない。（目的の履歴が探しづらい問題を抱えている）
  • 目的のバックアップを指定するとキャンバスが復元される。それまでの描画内容は消去される。
  • 復元せずに元の画面に戻るには、画面右上の×ボタンを押す。
• キャンバスサイズが異なるバックアップ履歴を復元しようとした場合、現在のサイズが優先され、画像の配置調整が行われる。
• 使用しているキャンバスサイズが大きいほど、遡ることができる履歴数が変動して少なくなる。^[1]

お絵カキコのセーブデータ

• 自動バックアップ、および色パレットの設定は、ブラウザにローカル保存される。ブラウザを閉じたり、PCやスマホの電源を切っても残り続けるため、後日にツールを起動したときも引き継がれる。
• ブラウザの「Cookieとサイトデータの消去」^[2]を行うと、お絵カキコのセーブデータも一緒に消えるため、注意が必要である。
• 旧版では色パレットの情報をサーバー側で保存していたため、「基にしてお絵カキコ」をした際、投稿時点の色パレットを他者へ引き継ぐことができたが、本ツールではローカル保存のため不可能になっている。

全般

• ペンタブレットなどのペン入力にも対応している。筆圧は感知されない。
• キャンバスサイズは最小サイズ8×8から最大サイズ600×600ピクセルまで。ツール起動前の画面で指定する。描き始めた後にサイズを変更するには裏ワザを使う必要がある。（→Tips）
• キャンバス全体には常にアンチエイリアスがかかる。点がぼやけて表示されるため、細かいドット絵を描く用途には不向きである。（→対処法）
• ページ遷移で描いた絵が消えないように、何らかの描画を行った後にページ移動しようとした場合、確認ウィンドウが出るようになっている。
• 画像に透過色が含まれている場合、投稿時に透過部分が白背景に変換される。このため、透過を目的とした記事素材の作成はできない。

ショートカットキー一覧

基本的にPC版専用の機能。スマートフォンでは動作しない。^[3]

ｚ ……アンドゥ
ｙ ……リドゥ

ｕ ……全面塗りつぶし
ｔ ……絵全体に輪郭線をつける

ｈ …水平反転
ｖ ……垂直反転

ｉ ……絵を拡大させる
ｏ ……４分割にする

Shift…Shiftを押しながら描画すると直線が引ける
ｇ ……グレースケール（白黒）にする
ｐ ……セピア調にする

０ ……表示拡大率×0.5
１ ……表示拡大率×1.0
２ ……表示拡大率×2.0
３ ……表示拡大率×3.0
４ ……表示拡大率×4.0
５ ……表示拡大率×5.0
６ ……表示拡大率×6.0
７ ……表示拡大率×7.0
８ ……表示拡大率×8.0
９ ……表示拡大率×9.0

初心者向けのチュートリアル

とにかく描いてみよう

投稿までに最低限必要な手順を解説する。
試しに何か描いてみたいけれど、どこの掲示板に投稿すれば良いか分からなければ、本記事の掲示板を使っても良いだろう。

PC版

1. 絵を投稿したい記事の掲示板へ行き、「掲示板にレスする」ボタンを押す。
2. テキスト投稿用フォームのさらに下にある「お絵カキコする」ボタンを押す。
3. お絵カキコツールが別窓で起動する。
4. ここからお絵かき開始。
   • 画面中央の罫線が引かれた白い四角形の内側が「キャンバス」となり、マウスをドラッグすると線を引くことができる。
   • 画面上側のルーペアイコンの操作でキャンバスの拡大／縮小ができる。
   • ×1.0は現在の表示拡大率を表す。また、この部分を押すとキャンバスサイズが原寸に戻る。
   • ペンの太さは色々な太さの四角ボタンで変更できる。
   • ペンの色は色パレット（色付きの円ボタン）で変更できる。
   • 各種ペンアイコンを押すとペンの種類を変更できる。使用中のペンアイコンは青塗りつぶしで表示される。
   • 消しゴムを使用すると、ペンで描いた線を消すことができる。
   • 罫線が邪魔だ、と思ったら補助線アイコンを押すと消せる。
   • アンドゥアイコンを押すと、直前の描画を取り消して１つ前の状態に戻せる。
   • 最初からやり直したいときは、ゴミ箱アイコンを押すと描いた内容がすべて消える。
5. 絵を描き終えたら画面を下にスクロールする。
6. 「投稿者名」「タイトル」「本文（必須）」の入力フォームがあるので、内容を入力する。
7. 「お絵カキコする！」ボタンを押せば投稿が完了。描いた絵が掲示板のレスとして投稿される。

スマホ版

1. 絵を投稿したい記事の掲示板へ行き、「掲示板にレス・お絵カキコする」ボタンを押す。
2. 「テキスト」と「お絵カキコ」の２つのタブを選択できるので、「お絵カキコ」タブを選ぶ。
3. 「お絵カキコする」ボタンを押す。
4. お絵カキコツールが起動する。
5. ここからお絵かき開始。
   • 画面中央の罫線が引かれた白い四角形の内側が「キャンバス」となり、指でなぞると線を引くことができる。
   • ピンチ操作でキャンバスの拡大／縮小ができる。
   • 100%アイコンを押すとキャンバスサイズが原寸に戻る。
   • 他のお絵かき操作はPC版と共通。PC版の解説を参照。
6. 絵を描き終えたら画面右上にある「次へ→」ボタンを押す。
7. 「投稿者名」「タイトル」「本文（必須）」の入力フォームが表示されるので、内容を入力する。
8. 「お絵カキコする！」ボタンを押せば投稿が完了。描いた絵が掲示板のレスとして投稿される。

自分が描いたお絵カキコリストを活用しよう

大百科のマイページには、自分が投稿したお絵カキコを一覧表示する機能がある。

イラスト毎のほめられた数を確認することができる他、「静画に投稿」ボタンを押すことで、ニコニコ静画に投稿することができる。この方法で投稿した静画は「このイラストのお絵カキコ記事へ」という大百科へのリンクが付与される。

• 参考リンク
  • 自分が描いたお絵カキコリスト
  • ニコニコ静画「お絵カキコ」タグを含むイラスト

投稿について知っておきたいこと

• 投稿者名は空欄でも可。その場合「ななしのよっしん」として投稿される。
• タイトルは空欄でも可。タイトルに「いちほ」「一保」「一時保存」「途中保存」のいずれかの文字が含まれると、投稿したお絵カキコが記事の「最近描かれたお絵カキコ」に表示されなくなる。（大百科TOPページの「最近描かれたお絵カキコ」には表示される）
• 投稿エラーが発生した場合は、改めてツールやブラウザを再起動し、自動バックアップ機能を使って描いた画像を復元して、時間をおいて再度投稿することで解決する場合が多い。
• 利用規約により、投稿した絵は一切の著作権が運営に譲渡される。投稿者本人であっても一度投稿した絵を削除することができず、他のユーザーが大百科上で自由に利用することが認められている。
• 公序良俗に反するお絵カキコは運営により削除される場合がある。

基にしてお絵カキコする

• 投稿された絵のレスに表示される「基にしてお絵カキコする」ボタンを押すことで、誰でも続きから描くことが可能である。複数の絵師による合作や、ぬりえ、連続絵画、テンプレートを基にしたお絵カキコ（七夕の記事など）といった遊び方ができる。
• 自分自身が続きを描いても良いため、これを"確実な"一時保存機能として使う事もできる。その場合、作業途中絵の投稿タイトルを前項で述べたように「いちほ」等として、続きを描く意思があることを明示するのが慣習である。^[4]
• 「基にしてお絵カキコする」機能を使用した場合、必然的に基絵と同一の掲示板に投稿することになる。投稿したお絵カキコには「この絵を基にしています！」という基絵へのリンクが付与される。
• 他者の作品に落書きしただけ、勝手に転載しただけ、のような投稿は悪意があるとみなされる場合があるので注意。被害にあった場合は、ニコニコ大百科:お絵カキコ上書き削除依頼の記事で運営に削除申請を行うことができる。
• 基絵が運営により削除された場合、削除されたお絵カキコから続きを描いた投稿は、連動して全て削除される仕様がある。つまり、一時保存のために投稿した途中絵に問題があり削除されてしまうと、本投稿の絵も削除されてしまうことになる。

以上の仕様を理解して、正しく活用していただきたい。

動画【お絵カキコ作成講座】

お絵カキコ絵師による解説動画。PC版準拠。
見るだけで一通りの操作を習得できるだけでなく、面白い仕上がりになっている力作。

Tips

作業中の一時保存方法

• 描き途中で中断して別の日に続きから描きたい場合、自動バックアップを利用する方法がある。
  • キャンバスの空きスペースに「正」の字を２回描くことで、自動バックアップまでの10ストロークのカウントと復元時の視認性を確保するという手法が有志により確立されている。
  • ブラウザを閉じる前に正の字が書かれた自動バックアップが作成されていることを確認し、復元後に正の字を消し忘れることが無きよう注意されたし。
  • 視認性の確保が必要なければ、キャンバスの外側の灰色領域で線を描く操作（実際に線は描かれない）を10回行うだけでも、バックアップが作成される。

キャンバスサイズの変更

• 大きくしたい場合
  
  • 10ストローク分の適当な描画を行い、自動バックアップを作成する。
  • キャンバスサイズを変更したお絵カキコの画面を開き、自動バックアップから復元する。
  • 中央揃えで復元されるので、移動ツールで望みの位置に調整する。
• 小さくしたい場合
  • 残したい部分がキャンバス中央にくるように、移動ツールで画像の位置を調整する。
  • 10ストローク分の適当な描画を行い、自動バックアップを作成する。
  • キャンバスサイズを変更したお絵カキコの画面を開き、自動バックアップから復元する。

画像をファイルに保存

• 自動バックアップの一覧画面でサムネイルを右クリックor長押しすると、原寸大の画像をpng形式ファイルに保存することができる。

不具合

大百科運営から告知があったもの

• ^[致命的]iOS端末において、環境によりお絵カキコの自動バックアップが機能せず、バックアップデータが作成されなくなる。^[5]
  • 不具合が発生する環境（ユーザー報告）
    • iPad (第9世代)

ユーザーから報告があったもの

• ^[致命的]なんらかの条件下で、10ストローク毎の自動バックアップが作成されない場合がある。この場合、しばらく描き続けていると正常に戻る場合がある。^[6]
• ^[致命的]バックアップから復元を行った際、復元をアンドゥ（取り消し）すると1つ前ではなく2つ前に戻されてしまう。
• ^[致命的]消しゴムで描画した直後、バックアップから復元が動作しなくなる（画像が復元されず、全消去される）。任意のペンで１度描画を行うと復帰する。
• ^[致命的]スマホ版において、移動ツールを使った直後にアンドゥを行うと、画像が消えてしまう。もう１度アンドゥすると元に戻る。
• ふちどりペン＋[Shift]押しで引く直線が正常に描かれない。また、描画途中で[Shift]を押して直線に切り替えると線と輪郭が分離して、線が自由曲線、輪郭が直線として描かれる。
• ふちどりペンで線を引いた直後に別の色で[t]frameのキャンバスの縁取りを行うと、ふちどりペンで引いた直近の線の色まで塗り潰される。
• えんぴつの中心点にずれがあり、太い線になるほど左上にずれて描画される。
• 色作成画面に９番目の色設定が存在するが、虹色として自動設定される枠のため、どこにも反映されない無意味な項目となっている。
• PC版の画面のショートカットキー表示で、[o]split が２つ存在する。
• 色パレットの綴りがpaletteではなく、palletになっている。

解決済み

• 一つ前の描画が勝手に消去される（同時に１本の線しか描画することができない）。^[7]
  • Chrome,Edgeのversion119.xにて発生を確認。
  • Chromiumベース以外の別のブラウザ（Firefoxなど）では不具合は発生しない。
  • ブラウザを最新版にアップデートすることで全環境で問題が発生しなくなる旨の告知が運営より行われている。 ^{[8] [9]}

よくある質問

■バケツ（塗り潰し）機能はないの？

指定範囲を塗り潰す機能は、HTML5版のお絵カキコにはありません。

全面（キャンバス全体）を塗り潰す機能ならあります。

■レイヤー機能はないの？

HTML5版のお絵カキコにはありません。

乗算やオーバーレイといったものもありません。

■□とか○などの図形ツール機能はないの？

HTML5版のお絵カキコにはありません。

■透過画像として投稿できないの？

HTML5版のお絵カキコにはありません。

透過を目的とした記事素材の作成はできません。

記事編集の一部の代用方法として、HTMLのタグにopacityを指定すると指定要素をまるごと透過することはできます。(透過画像の方ができることは多い)

■一時保存はできないの？

キャンバスに一定の回数書くごとにローカルブラウザに定期的に自動保存されます（具体的には10ストロークごと）。ただし、一旦投稿されたお絵カキコを何らかの方法で別の掲示板へ投稿し直すと削除対象とされる可能性がありますのでご注意ください。^[10]

ユーザーを補助する拡張機能など

すべて有志による非公式なものであるため、導入と使用は自己責任で行うこと。

• HTML5版お絵カキコ自動バックアップ拡張 - 日時順にソートされる自動バックアップ(バックアップできない不具合のあるiOSでも正常にバックアップされる)機能、任意のセーブ/ロード機能を追加するユーザースクリプト
• お絵カキコ ボタン名表示 - 各ペンなどのボタンにマウスオーバーでボタン名を表示するユーザースタイルシート
• HTML5お絵カキコで拡大時にぼやけないやつ - 拡大表示での補完ボカシを除去するユーザースタイルシート
• 1ドット枠グリッド線(縦横) - 1ドット毎のグリッド線など任意の補助線を表示するユーザースタイルシート
• AXNOS Paint - レイヤー機能などのある開発中のペイントツール

関連項目

• お絵カキコ
• ニコニコ大百科:Flash版お絵カキコヘルプ: 終了したFlash版のヘルプ
• お絵カキコ関連記事の一覧
• ニコニコ大百科:ヘルプ

編集者向けページ
マニュアル	記事の編集方法 - HTMLタグ一覧 - HTMLエディタヘルプ - スマホエディタヘルプ - ピコカキコヘルプ - お絵カキコヘルプ - パンくずリスト - パンくずリストのガイドライン
マナー	編集時のマナー - 編集合戦 - 編集競合 - 楽しく過ごすために
素材	素材集 - 素材集2 - ニコニコテレビ君 - キャラアイコン - ドットキャラ - 外字・特殊フォント
テンプレ	お知らせ表示 - ユーザーボックス - テンプレートボックス - 作品テンプレート - HTMLテンプレート集 - Twitter引用
カラー	HTMLカラーコード - CSSでの色指定
仕様	仕様 - デフォルトCSS - 自動リンク - ページ番号 - リビジョン番号 - 初版作成日 - 最終更新日 - 編集履歴
依頼	一般会員依頼スレ - 記事作成依頼 - 記事加筆依頼 - 要編集記事 - 未作成タグ - 話題の単語
公式企画	百チャレ - 大百科グランプリ
ヘルプ	よくある質問 - エラー・不具合情報
編集者	編集者一覧 - ★ - ∞ - ♢
その他	今週のオススメ記事 - おすすめトレンド - 急上昇ワード改
編集者向けページテンプレートver20231215

脚注

1. *履歴全体としての記憶容量が定められており、上限を超える履歴を作成しないような処理を行っていると推測される。
2. *ブラウザにより操作の名称が異なる場合がある。具体的には、nicovideo.jpのサイトデータを消去する操作が該当する。
3. *スマホ版＋タブレットPCのような一部環境では動作する、との報告あり。
4. *旧版ではこの方法でしか一時保存ができなかったため、このような慣習が形成された。現ツールでは自動バックアップ機能によって解決できるため、可能であれば自動バックアップ機能による一時保存を利用するのが望ましい。
5. * https://twitter.com/nico_nico_pedia/status/1646441612728471553
6. *完全に推測ではあるが、小さいキャンバスサイズの自動バックアップ履歴を容量限界まで作成した後、大きいキャンバスサイズで描き始めると、古い履歴を１つ削除しても、新しい履歴を保存する容量が確保できず、複数の履歴が削除され容量が確保されるまでの間、作成に失敗しているのではないかと考えられる。早期に不具合が修正されることを望む。
7. * https://twitter.com/nico_nico_pedia/status/1723952573902999697
8. * https://twitter.com/nico_nico_pedia/status/1732672476365414853
9. * https://twitter.com/nico_nico_pedia/status/1745370788780462415
10. *【百チャレ】2022年の夏に向けてお絵カキコを描いてみよう「本キャンペーンに関する質問と回答」より太字部分を引用