html-ppt-zhangzara-scatterbrain

Scatterbrain

付箋に着想を得たデザインです。パステルカラーの付箋、Caveatの手書き文字、ShrikhandとZilla Slabの書体を組み合わせています。

単体で完結するHTMLデッキです。タイポグラフィ、カラーパレット、装飾の仕組み、スライドの表現はすべて、まとまりを持つよう調整されています。テンプレート間でレイアウトを混ぜると、この仕組みが崩れるため、このテンプレートの範囲内で使用してください。

概要

• 配色: ライト
• フォーマル度: 低
• 情報密度: 高
• デモのスライド数: 10

適した用途

デザイナーのホワイトボードのような雰囲気が求められるもの全般。ブレインストーミング、ワークショップ、クリエイティブエージェンシーの実績紹介、デザイン思考のセッション、アイデア提案、アートディレクションのレビューなどに適しています。また、完成された結論ではなく、考えをまとめている途中のように見せたい場合は、テクノロジー、研究、ビジネスなど、どのようなテーマのデッキにも楽しく使えます。

避けたほうがよい用途

厳密さや組織としての重厚感が求められる場面です。付箋を使ったポストイット風の美しさは、意図的に温かみと未完成さを感じさせます。

ワークフロー

1. 作業用ファイルとして、example.htmlをユーザーのワークスペースに複製します。
2. プレースホルダーの内容を、ユーザーの実際の見出し、本文、数値、名前、日付、セクション名に置き換えます。画像プレースホルダーを差し替える場合は、既存の寸法に合わせます。
3. デザインシステムを維持します。 フォントの変更、カラーパレットの再配色、レイアウトグリッドの再構成、装飾要素（コーナーブラケット、紙の質感、幾何学模様、イラスト入りSVG）の削除は行わないでください。これらはデザインのアイデンティティの一部です。
4. レイアウトを複製してデッキの長さを調整します。 ユーザーのコンテンツがデモに収まらない場合は、最も適切なレイアウトの既存スライドを複製します。コンテンツが少ない場合は、末尾からスライドを削除します。ページ番号のラベルも更新してください。
5. 不足しているレイアウトのデザイン: テンプレートにないレイアウトが必要な場合は、同じフォント、カラーパレット、装飾表現、余白のリズム、コンポーネントの文法を使って、一からデザインしてください。別のテンプレートに切り替えてはいけません。
6. 提供時のナビゲーションランタイムを維持します。 デッキにassets/deck-stage.jsまたはインラインのキーボードハンドラーが含まれている場合は、そのまま残してください。

出力仕様

<artifact>タグで囲んで出力します。

<artifact identifier="zhangzara-scatterbrain" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>

ソースとライセンス

上流のMITライセンス対象である zarazhangrui/beautiful-html-templatesから取り込まれています。

元の著作権表示を含む上流のMITライセンス全文は、このスキル内の LICENSEに含まれており、example.html、template.json、または取り込んだassets/ランタイムの複製とともに再配布する必要があります。上流のメタデータのスナップショットについては、template.jsonを参照してください。