harekyon.com

COMMING SOON

Paper.js 入門

Paper.js 入門

概要

Paper.jsとは何か

Paper.jsはプログラムでお絵描きするためのJSライブラリです。軽量ながらも、2Dグラフィックスの描画やアニメーション・インタラクションなど、様々な機能が使えるのが特徴です。

特徴

ベクター系描画ライブラリ

Paper.jsはJavascriptの拡張言語である「Paperscript」というものを使うことで描画の効率化を図っています。また、ベクターグラフィックス(数値化された形状)やベジエ曲線の生成・操作に特化した機能が豊富に用意されており、これらの処理は数行のコードで描画することが出来ます。

※PaperscriptをJavascriptに変換することもできますが、変換するための処理を書く必要があります。

イラレでも使用されているScriptographer

Paper.jsのベースのシステムでScriptographerというものが使われており、これはIllustratorと同じものらしいです。しかし、Scriptographerのgithub更新がしばらくされていなかったり、最近のイラレで使われているかはよくわかりません。Paper.js自体は現在(2022/10月確認)も更新されているので、まだまだ現役なライブラリかと思います。

私用・商用問わず使えるMITライセンス

Paper.jsライブラリで作られたプロジェクトは私用商用問わず、公開することが出来ます。

HPを見よう

Paper.jsのHPはすべて英語で書かれていますが、Deeplなどで翻訳すれば大体のことが理解できるので大丈夫です。このサイトで特に見てほしいのが、ExamplesとShowcaseです。Paper.jsでどのような作品が作れるのか、実際に見てモチベを上げることが出来ます。Examplesでは作品の他にコードも見ることが出来るので、自身のプロジェクトに貼り付けて改造してみると勉強になるかなと思います。

Hello Paper.js

Paper.jsは環境構築することなくお試しでコードを書くことが出来るサイトが公開されています。

以下のサイトにアクセスしてみてください。

http://sketch.paperjs.org/

続きは後日

毎日少しずつ更新していきます。お楽しみに