イラストのトレース練習サイト（仮）メモ - はかせだけど博士じゃない

はじめに

以前読んだ「【これは納得】 #０から絵師になる方法論 #ダラダラと絵師になる方法【従来の労力を軽減】」という記事、何となくイラストを練習したいけど続かないしそもそもどうやって練習すればいいのか分からないという自分にとても合ってる練習方法なのでは？　と思って早2年。やらない。知ってたけどやらないんだよなあ。うん。

ということでトレースの練習に特化したアプリでもあれば継続して練習するのでは、しかも自分で作ったアプリならなおさらなのでは！？　という感じのモチベーションでアプリを作ってみたいと思います。今はN予備校をやってるけど、終わってからがいいか並行するかは未定。

（たぶんアプリを作ってもイラストの練習はやら）ないです。

イラストをトレースする
- イラストの上から線を描く
  - 線の太さを変える
  - 線の色を変える
- イラストの上に書いた線を消す
  - 消しゴムのように消す
  - すべて消す
  - UNDO
- 書いた線を非表示にする
イラストを表示する
- イラストを半透明にする
- イラストを非表示にする
- イラストを横に表示する
- イラストを左右反転する
- イラストを上下反転する
書いた線を保存する
- ローカルに
- Web上に
書いた線を共有する
- Twitterに
トレースするイラストを用意する
- アップロードする？
  - ローカルの画像を表示するだけとかできないかな
- Web上の画像をもってくる
- アプリ側であらかじめ用意する？

色々書いたけど、とりあえずパスはログインとお絵かき（トレース）画面くらいがあればいいのかな。基本的な部分以外は作りながら考えよう。

まず最小構成で作るためにお絵かき画面だけでもいいかもしれない。そもそもログインが必要かどうかも怪しい。

お絵かき機能はcanvasで実現できそう。簡単な線が描ける程度のものを想定していて、「canvas お絵かき」とかでググるとそれっぽいコードがたくさん出てくるのでパク参考になるだろう。

画像を表示する部分も、画像をどこから持ってくるのかはさておき、canvasでレイヤーを実現できるかは調べてみるがそもそも要素を2つ重ねるとかすればできそうである。半透明・非表示も並べて表示もなんならCSSで実現できる。

まずはそこまで作ってみよう。