インセインカード生成ツール

「自分でインセインのカード作るのに一個ずつ作るの面倒くせ〜〜〜!そうだ、ウェブツールで自動生成できるやつ作ったろ」と思って作りました。
機能面に全振りしたので、レイアウトは死んでる。やむをえない。いつか余裕が出た時に綺麗にされるだろう。
あとスマホとかの狭い画面では見るな。機能ごとレイアウトが死ぬ。iPadの横向き(1080px)はギリギリいけるかも? いやしかし無理はしないで大きい画面で使ってくれ。
自分用に作ったものなので、使う人は自己責任でよろしくな!

カードプレビュー

狂気
狂気名だよ
トリガー
発動条件だよ

この狂気を取得するとこうなっちゃうよ

この狂気を自分から
明らかにすることはできない

カラー調べるの面倒くさい〜って人は↑の□押して適当に色選んで、各所にコピペしてくれ。

各設定

カード設定

  • カード背景

  • カード罫線

  • 余白

  • フォント(全体)

カード(裏)設定

狂気カード

box1設定

  • 見出し

  • 詳細

box2設定

  • 見出し

  • 詳細

box3設定

  • 詳細

box4設定

  • 詳細

以下に情報を入れて「一括出力」を押すと、一気にカードが作られるよ。
一番長い文言であらかじめカードの設定をしておくと最終的にいい感じになると思います。

※一気に出せるのは10枚までです

※テキストで改行したい場合は<br>って入れるといいよ。

出力エリア

出力された画像は一つずつ右クリックなどで保存してくれ。

CSSのセーブ/ロード

CSSのセーブとロードができます。
セーブは今設定されているCSS情報が↓に入力されるだけなので、出力したものを自分でどっかにコピペしておいてください。

隠し(?)機能

凝ったデザインを作りたい
基本機能としてはHTMLを画像として出力してるだけだから、開発ツールを開いてHTMLとCSS直接いじるといいよ。
その場合、CSSのセーブ機能使っても保存されないから、その場合はソースとCSSを保存してくれ。
開発ツール開ける人にはこれくらいの説明でわかるはずだ。
この欄削除したいな……って時
『テキスト』項目を空欄にすると、なんと枠が消えます。そういう機能を入れました。
ただ、一括出力を使う場合、あらかじめカードレイアウトで消した上で、一括出力用JSONでもそこの文言消しとかないと多分うまく出力できない。
※これについては、後々JSONで空白だった場合は枠自動で消すみたいな機能作るかもしれないし、作らないかもしれない。
特殊なフォントを使いたい
開発ツールを開いてfont-familyいじるとかでどうにかしてみてくれ。
あと、GoogleIconFont入れてあるから、心得がある人はそれを使うことでアイコンとか入れられなくもない。その辺は自己責任だ!

特に意味はないFAQ

ココフォリアとかに入れたら画像大きいんだが。
画像は横1:縦1.5の比で作ってるので、コマサイズはそれにあわせて2:3, 4:6などでやれば多分いい感じになると思う。計算してくれ。
なんか記述特殊じゃない?
細かい設定を入れようとすると無限に大変になるから、その辺省くためにCSSがわかる人向けに作ってるぜ!
色とか細かいところは自分で調べて入れてくれ~。ちなみに背景色半透明にしたい場合はrgba(xxx, xxx, xxx, 0.5)とかにすればいける。詳しいことは調べてくれ。
もっと凝ったレイアウトとかできない?
HTMLを画像に落とし込んでる形だから、開発ツールでも開いて編集してくれたら多分できるよ。
画像入れられない?
そういう機能入れると面倒だから対応しないことにしてる。自分で合成してくれ。
なんかうまく使えない、動かないんだけど
これは自分が楽するためのツールなので、検証は自分がよく使うブラウザ(firefox)でしかしてないんだ。すまんな。自己責任で使用してくれ。
なぜ作ったの?一個ずつ作った方が早くない?
フォントとか見た目とか凝りだしたら時間が無限にかかるから、ツールで出した方が「まあツール出力だしな」で諦めがつくと思ったし、凝ったり悩んだりする時間よりこっちのツール作る時間の方が時間かからんので。
自己責任って言いながらなんでウェブで公開してるの?
「ママ~~~~、こんなの作ったよ~!」って気持ちで公開しました。
あとローカルに入れてると永遠に完成しないから。

更新履歴

問い合わせなど

やけくそになってこのツールを作った人:クロバショウ/黒葉クロモジ
(※名義が二つありますが一人です)
問い合わせ先:
GoogleForm
マシュマロ