概要

美雲あんずちゃん、美雲このはちゃんを好きな画像に合成出来るジェネレータぽい物を作ってみました　　

仕事であまり使う機会が無い、けど使ってみたい「fabric.js」を使用しています。

解像度 1280×960以上推薦です

機能

背景画像の取り込み
キャラクター画像の拡大、縮小
キャラクター画像の角度変更

操作方法

①背景画像を取り込みます
※背景画像なしでも合成可能です

②キャラクター画像を「画像追加」ボタンで追加し編集を行います

③キャラクター画像の削除は、削除したい画像を選択し「選択画像を削除」ボタンで行います。

動作環境・使用ライブラリ

• webサーバー：ConoHa VPS
• 画面構成：bootstrap
• キャラクター画像の編集：fabric.js
• キャラクター画像の選択：swiper.js

2016/10/25 追記
①Laravel 5.3（php7.0）フレームワークに変更
②選択キャラクターに「あんずちゃん&このはちゃん」を追加
③選択キャラクターに「このはちゃん　読書（眼鏡なし）」を追加

注意事項

• 背景画像の拡大・縮小はできません
• 背景画像の削除は「最初からやり直す」ボタンを押下するか、他の画像を取り込んでください。

その他

fabric.jsは便利ですが、かなりクセがありますねぇ…
使いこなせるとECサイトのカスタムオーダーなんかで使えそうです。

作品リンク

• windurst.jp