◉ 132個のサンプルから選んで、好みの色のローディングアニメーションgifを作れるジェネレータ「Load Info – gif generator」

Macの起動、終了のときや、webページの読み込みのときなど、ローディングアニメーションを目にする機会は多い。

自分自身も、外部のhtml内容を静的に読み込むwebページを作る機会があって、ローディングアニメーションを作ったことがある。

ありふれたものはつまらないと意気込んではみたものの、実際に作るとなるとこれがなかなか面倒、そんなとき参考にさせていただいたのがこのwebサービス。

このジェネレータのページはごくシンプルにできているが、表示されている132個のアニメーションgifのすべて動いている様はなかなか壮観。
この中から一つを選び、クリックすると別窓が開き、自分用にカスタマイズできる。

実際に作成してみた

• [foreground]をクリックすると、右側にカラーピッカーが表示されるので、動く部分の色を決める。[foreground]の右側に16進の数値を入力してもかまわない。
• [background]をクリック、[foreground]と同様の動きで、バックの色を決める。
• サイズは16×16ピクセル、24×24ピクセル、48×48ピクセルの3種類から選ぶ。
• すべて決まったら、ジェネレートボタンをクリック、選んだgifの下にダウンロードボタンが現れる。
• ダウンロードボタンをクリックして、gifをダウンロード。
• この別窓を閉じれば、また別のgifを選択できる。

ダウンロードしたgifをプレビュー.appで表示すると、右画像のような感じ。

実際に作成したローディングアニメーションgif

使ってみた感想

• サイズは小さな3種類しか用意されていないが、ページ読み込みに時間がかかる大きなサイズはローディングアニメーションgifの役割からいって本末転倒なので、この位のサイズで十分。それなりのクオリティのあるgifをごく簡単なステップで入手できるのはとてもありがたい。
• ただ、デフォルトの白いアニメーションgifを際立たせるため、全体に暗い感じで構成されているため、ジェネレータの別窓を開いていることが判りにくい。最初は、トップに戻ろうとして、ブラウザの「戻る」ボタンを押してしまい、このページから移動してしまった。

「Load Info – gif generator」：http://www.loadinfo.net/