もう３年ほど経つが、かつて「ギルドリーヴ風キャラクターカードクリエイター」というツールを公開した。

2013年11月4日 お気に入りのSSがキャラカードに！

いわゆる画像ジェネレータ系のサービスで、お気に入りのSSから、ギルドリーヴカード風のキャラクターカードが作れるというもので、公開当時はけっこう反響があって、いろんな人に使ってもらった。
しかしもう3年も前に公開したものなので、使ってくれる人もそんなにはいないだろう。

ただ、ちょっと前から、FF14のTwitterユーザーコミュニティでエオスタグラムというゲーム内SSをInstagramのサービス風にアレンジしたテンプレートをnenecoさん(@nenecotte)が公開して、SSのエオスタグラム風加工が流行っていた。
eostagram_image

 
テンプレートが公開されているとはいえ、画像加工はPCにツールが必要なので元々画像加工をするような人がアップすることが主だったが、むーむーさん（@moomoo_ffxiv)が「FF14 エオスタグラム フレームジェネレーター」を作成して、より気軽にできるようになった。

むーむーさんには、いろんな人からのフィードバックが寄せられ、画像フィルタ機能などいろいろ強化されていたった流れで・・・


という経緯で、ギルドリーヴ風キャラクターカードクリエイターのSSトリミング機能を切り出して、
画像ジェネレーターサービス向け汎用トリミングUIライブラリ「LBTrim」
として作成し、むーむーさんに組み込んでもらった。
※先のリンクのエオスタグラムフレームジェネレータはもう組み込み済みのもの


というのが結構前で、今回、いろいろフィードバックをもらって安定してきたので、もっといろいろな人に使ってもらえるように、Githubで公開した。

https://github.com/LuckyBancho/lbtrim


基本的にWeb開発者向けなので、実際の動作はエオスタグラムフレームジェネレータや、こちらのデモで確認してもらうといいだろう。

ここからは、ジェネレータ系ツールを使う人向けになるが、このライブラリのウリは、画像トリミング機能がサーバーレスで簡単に組み込める、というもの。

画像トリミング機能を作るのがいかに面倒なのかを説明すると・・・
  • ローカルの画像ファイルを読み込んでサーバーにアップせずにページに反映させる必要がある。
  • 画像ファイルを決め打ちで切り抜くのはそう難しくない（初期のエオスタグラムジェネレータがこの形）。
  • 読み込んだ画像と、トリミングする領域を選択するUIを作らないといけない。
  • トリミングもできる画像加工UIのライブラリはいくつかあるが、たいてい縦横自由に切り抜き領域を選択できるタイプで、切り抜いた画像のサイズ（と縦横比）がほぼ固定の画像ジェネレーターサービスには使いにくい。
ざっと、こんな感じになる。
それが、数行のコードを書くことでこんなトリミング用UIを自分のページに組み込むことができる。
※詳しくは上記GitHubのページの説明をご参照下さい。

lbtrimデモ


以上が、画像ジェネレーターサービス向け汎用トリミングUIライブラリ「LBTrim」の紹介だ。
実際に画像ジェネレーターサービスを作る場合には、切り抜いた画像とテンプレートを合成したりとプログラミングの技術が必要だが、HTML5+Javascriptでの画像加工の世界ではわりと一般的な範疇なので、ヤル気とフットワークがあれば、プログラミングができる人いとってはそこまで難しいものでもないだろう。


MMOPRGで、もっとも強いモチベーションは自キャラへの愛着。
その自キャラLoveをより楽しむのにSS加工とその共有は、プレイヤーコミュニティを盛り上げるためにとても貢献できると思う。
LBTrimが、そうした楽しみを広げてくれるツールが生まれるのに少しでも貢献できれば、これほどうれしいことはない。