CodeKitHubこのツールとは？
Facebookストーリージェネレーターは、実際のFacebookストーリーの縦型フルスクリーンの見た目を再現します——プロフィールリング、名前とタイムスタンプのヘッダー、背景写真またはグラデーション、太字の重ねテキスト、そして下部の返信バーの帯まで。
詐欺的な証拠の捏造、嫌がらせや誹謗中傷、実在の人物の実際の投稿やストーリーへのなりすましに使用してはいけません——法域によっては違法となる可能性があります。
すべてHTML Canvas APIを使ってブラウザ内でローカルに生成され、サーバーには一切アップロードされません。
なぜこれを使うのか？
- 動画編集の練習で「SNSストーリー風のサムネイル」を作りたいが、実際のFacebookアプリで投稿せずに見た目だけ確認したい――名前とテキストを入力するだけで、投稿せずにストーリー風のプレビュー画像が手に入ります。
- 友人内輪のミームで「こんなストーリーを上げそうな人」ネタの画像を作ってグループチャットで共有したい――背景のグラデーションと重ねテキストを組み合わせて、それらしい雰囲気に仕上げられます。
- スマホアプリのストーリー機能のUIデザイン案をクライアントに見せる必要があるが、実際のFacebookをキャプチャすると無関係な情報まで写り込んでしまう――9:16の縦型モックアップだけを、必要な要素だけで作れます。
- 自分の写真や文章をどこにもアップロードしたくない――背景画像もテキストもブラウザ内だけで処理され、PNGをダウンロードするまでサーバーとのやり取りは一切発生しません。
使い方
- 名前、タイムスタンプ、アバターの色を設定します（または写真をアップロード）。
- 背景のグラデーションを選ぶか、自分の画像をアップロードします。
- ストーリーの下部付近に表示される重ねテキストを入力します。
- 縦型プレビューがリアルタイムで更新されるのを確認し、「Download PNG」をクリックして画像を保存します。
例
入力
名前：「Sam Whitfield」・時間：「4h」・背景：青からピンクへのグラデーション・テキスト：「日曜の朝のコーヒー ☕」出力
360×640のPNG画像で、実際のFacebookストーリーのスタイルを表示します：プロフィールリング付きアバター、名前とタイムスタンプ、フルブリードのグラデーション背景、中央配置の太字の重ねテキスト、そして下部にハートアイコン付きの返信バーの帯。画像はライブプレビューのcanvas上で即座に生成され、ワンクリックでダウンロードできます——待ち時間もサーバーとの通信もありません。
カスタマイズできる項目
- プロフィール名、タイムスタンプ、アバターの色または写真。
- 背景：2色のグラデーションまたはアップロードした画像。
- ストーリーの下部付近に表示される太字の重ねテキスト。
- 実際のFacebookストーリーの視覚的スタイルに合わせたレイアウトの詳細。
責任ある利用について
このジェネレーターは、ユーモアやストーリーテリング、デザイン作業のために、明確に架空のモックアップ画像を簡単に作成できるようにすることを目的としています。このツールで作成した画像を共有する場合は、見る人が実際のストーリーではないと理解できるよう、説明を添えることをおすすめします。
他のFacebookモックアップとの比較
| ツール | アスペクト比 | 主な用途 |
|---|---|---|
| Facebookストーリージェネレーター | 9:16（縦型） | フルスクリーンの一時的な投稿を再現したいとき |
| Facebookプロフィールジェネレーター | 600×500（横長ヘッダー） | カバー写真と自己紹介付きのプロフィール全体を見せたいとき |
| Facebookコメントジェネレーター | スレッドの長さに応じて可変 | 返信付きの会話形式のやり取りを見せたいとき |
よくある質問
このツールを使うのは合法・倫理的ですか？
このツール自体は、エンターテインメント、モックアップ、プレゼンテーション、デザイン作業に使う分には合法です。合法でも倫理的でもないのは、生成した画像を使って誰かを騙すことです。明確に架空・説明目的の用途のみにご利用ください。
ツールは私のコンテンツをどこかにアップロードしますか？
いいえ。入力またはアップロードしたすべての内容はブラウザのメモリ内に留まり、JavaScriptによってcanvas要素に直接描画されます。PNGはお使いのデバイス上で生成・ダウンロードされます——サーバーに送信されることは一切ありません。
自分の写真をストーリーの背景としてアップロードできますか？
はい——「Video background」の下にあるアップロードリンクをクリックすると、グラデーションの代わりに自分の画像をフルブリードのストーリー背景として使用できます。
書き出される画像サイズはどれくらいですか？
書き出されるPNGは360×640で、実際のFacebookストーリーが使用する9:16の縦型アスペクト比と一致します。
このツールと他のFacebookモックアップジェネレーターのどちらを使うべきですか？
フルスクリーン縦型のストーリーをモックアップするなら、このストーリージェネレーターを使ってください。コメントスレッドが必要なら Facebookコメントジェネレーター、カバー写真と自己紹介付きのプロフィールページ全体が必要なら Facebookプロフィールジェネレーターをお使いください。
重ねテキストの文字数に制限はありますか？
厳密な文字数上限は設けられていませんが、テキストは下部付近の限られたスペースに収まるよう描画されるため、長すぎる文章は自動的に折り返されたり、レイアウトが窮屈になったりすることがあります。1〜2行に収まる短いフレーズが最も見栄えよく仕上がります。
縦型以外のアスペクト比で書き出すことはできますか？
いいえ、このツールは実際のFacebookストーリーと同じ9:16の縦型（360×640）に固定されています。正方形やランドスケープのフォーマットが必要な場合は、別の画像編集ツールで後からトリミングする必要があります。
背景に写真をアップロードした場合、画像は自動的に切り抜かれますか？
はい。アップロードした画像は9:16の縦型キャンバスいっぱいに表示されるよう自動的に拡大縮小・トリミングされます。横長の写真を使う場合、左右の重要な部分が見切れることがあるため、事前に縦向きにトリミングしておくと仕上がりが安定します。
返信バーのテキストやアイコンは変更できますか？
返信バーはFacebookストーリーの見た目を再現するための固定デザイン要素で、現在のバージョンではテキストやアイコンを個別にカスタマイズする機能はありません。