slowtime designのデザイン、イラスト、その他もろもろ担当のヌン（@nun_）です

ドット絵アニメを使って404ページのデザインしたよ

slowtime designのホームページの404ページにドット絵のアニメを制作してみました
404ページ：https://slowtime-design.com/404_dot.html　※表示はランダムです
だいぶデータサイズが大きいのですが、デザインのショーケース的な立ち位置でみてやってください
どこかに消えてしまったページを探す旅に出ているストーリーになっています
ちなみに、主人公はslowtime designの社長です

全体のイメージはこんな感じ

動くドット絵をつくろう！

404ページのドット絵アニメはPhotoshopで制作しましたが、無料のツールでもアニメをつくることができます
アニメを制作するツールはたくさんあるのですが、今回はパソコンにインストールする必要がないツールをいくつかご紹介します
メールアドレスなどを登録せずに、すぐ使うことができるものを選びました

パソコンにインストール不要のドット絵の無料ツール

Piskel

ドットが描けて、アニメもつくれるエディタ
Piskel：http://www.piskelapp.com/
英語ですが、アイコンでなんとなく機能はわかります
画面の右上で常にアニメをプレビュー表示してくれるのがわかりやすい！
パソコンにgifファイルで保存するときは右側の「EXPORT」から、サイズを指定して「Download GIF」を選択するとダウンロードできます
描いたドットの縦横サイズは、「EXPORT」するときに大きさを変更することができます　この機能も地味に便利

ミニドット絵メーカー

小さなドット絵を描くのに最適なエディタ
ミニドット絵メーカー：http://neutralx0.net/dot/
はじめてドット絵を描いてみようという方にオススメのエディタです
色のパレットから色をとってサクサク描くことができます

写真画像加工編集サイト -GIFアニメ/動く画像-

静止画を一枚ずつアップロードするとアニメgifにしてくれるサービス
写真画像加工編集サイト -GIFアニメ/動く画像-：http://www.bannerkoubou.com/anime/
上記の「ミニドット絵メーカー」で描いたドット絵を使ってgifアニメをつくるときに良いです

MAKE PIXEL ART

見た目がドット絵のかわいいエディタ
MAKE PIXEL ART：http://makepixelart.com/free/
すべてドット絵でできているエディタ！とにかくかわいいのでご紹介です
使っていてうれしくなるからかわいさは大事！

まとめ

パズル感覚で描けるドット絵は、絵に苦手意識のある方でもはじめやすいと思います
好きなゲームのキャラや、似顔絵などのモチーフで描いてみてはいかがでしょうか！
3月にドット絵＝Pixel Artのイベントをやったのですが、懐かしさと新しさが混在する魅力的なドット絵がたくさん集まりました
ドット絵好きによるドット絵イベント Pixel Art Park：http://pixelartpark.html.xdomain.jp/　レポート

ドット絵の可能性はまだまだ留まるところを知らないようです
ドット絵、ぜひぜひ挑戦してみてください！
おまけ：焦る社長