記事#1061

バッジの仕様を変更しました。

当サイトのアカウント機能には、特典の1つとして、
バッジを獲得、収集できる機能がありますが、
これにより入手できるバッジについて、
画像の形式と、サイズを変更しました。

これまでのバッジは、88x31ドットのPNGイメージ形式でした。
しかしながら、ラスター形式画像な上、画素数が小さく、
モバイルデバイスでは画像が小さすぎたり、
PNG形式のようなラスター画像の特性により、
あるいは拡大しすぎたときにぼやけてしまったりなどの課題がありました。

また、解像度自体の小ささもあって、乗せられる情報量に限りもありました。

そこで、今回の仕様変更で、200x80ドットのSVG形式に変更しました。

参考に、仕様変更前のバッジと、仕様変更後のバッジをいくつか紹介します。

ヴァレンタインデー2018記念バッジ
→

サイト14周年記念バッジ
→

連続50日ログイン証
→

SVG(スケーラブルベクターグラフィクス)形式は、
ベクター画像の形式であり、画像はソースコードで記述されています。

画像を表示する際は、このソースコードを基に描画されるため、
拡大しても画像が粗くなったりぼやけたりすることがありません。

また、バッジの大きさ自体も大きくしたため、
これまで以上に情報を載せることができるようになり、
より精細にバッジをデザインすることができるようになると考えています。

加えて、バッジがソースコードで記述されているという特性を生かし、
自動生成や、微調整といったバッジの生成、更新作業にかかる手間が軽減され、
サイトを管理する際にバッジのデザインよりかは、
メインのコンテンツのほうに開発のリソースを割くことができるものと期待しています。

より魅力的になったバッジを集めて、
当サイトならびにアカウント機能をお楽しみください。

以上。