mcpField
H
html-ppt-zhangzara-soft-editorial

html-ppt-zhangzara-soft-editorial

github.com/nexu-ioドキュメント104.6k61 回インストール今日更新
リポジトリ

html-ppt-zhangzara-soft-editorial について

温かな紙色、Cormorant Garamond、控えめなアクセントを使った、静かで文学的なHTMLスライドを作成するスキルです。編集、文化、ライフスタイルなど、落ち着いた表現を求める資料に向いています。

主な機能

  1. 01ナビゲーション実行環境付きHTMLテンプレート
  2. 02温かな紙色と控えめなアクセント
  3. 03Cormorant Garamondのセリフ体
  4. 04内容とスライド数の調整ガイド
  5. 05MITライセンスの上流テンプレート

活用シーン

  1. 01編集特集のスライド作成
  2. 02ギャラリーや博物館の紹介
  3. 03創業者エッセイの資料作成

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/nexu-io/open-design --skill html-ppt-zhangzara-soft-editorial

インストール後、Claude Code で/html-ppt-zhangzara-soft-editorialを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

example.html
LICENSE
template.json
assets/
deck-stage.js

詳細

ソフト・エディトリアル

温かみのある紙色に、セージ、ブラッシュ、レモンのアクセントを添えたCormorant Garamondのセリフ体。

タイポグラフィ、パレット、装飾システム、スライドの表現を一体として調整した、単体で完結するHTMLデッキです。テンプレート間でレイアウトを混在させるとシステムが崩れるため、このテンプレート内で構成してください。

概要

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

おすすめの用途

文学的で、エレガントで、ゆったりとした雰囲気が求められるあらゆる用途に適しています。エディトリアル記事、長編ブランドストーリー、ギャラリー/美術館のデッキ、アドバイザリー向け成果物、ウェディング/ライフスタイルメディア、創業者のエッセイなどにおすすめです。企業的な洗練さより、日曜版の特集のような温かみを求めるテック、研究、ビジネスのデッキにも同様に適しています。

避けたほうがよい用途

視覚的な熱量やインパクトが必要なデッキには向きません。温かみのある紙色のパレットとCormorantのセリフ体は、意図的に控えめなデザインです。

ワークフロー

  1. example.htmlとassets/フォルダーを両方複製して、ユーザーのワークスペースに配置します。 このテンプレートには、キーボード操作とステージ描画を担うassets/deck-stage.jsランタイムが含まれています。HTMLはこれをassets/deck-stage.jsとして参照しているため、複製したHTMLと同じ場所にファイルを配置する必要があります。そうしないと、生成された成果物でこのパスが404になり、ナビゲーションが気づかれないまま機能しなくなります。単一の自己完結型ファイルにする場合は、HTML内の単一の<script>ブロックにJSをインライン化してもかまいません。
  2. プレースホルダーの内容を置き換えます。 ユーザーの実際の見出し、本文、数値、名前、日付、セクションラベルに差し替えます。画像プレースホルダーを差し替える際は、既存の寸法に合わせてください。
  3. デザインシステムを維持します。 フォントの差し替え、パレットの色変更、レイアウトグリッドの再構成、装飾要素(コーナーブラケット、紙の粒子感、幾何学図形、イラスト入りSVG)の削除は、絶対に行わないでください。これらはデザインのアイデンティティの一部です。
  4. レイアウトを複製してデッキの長さを調整します。 デモに収まらないほどユーザーのコンテンツが多い場合は、最も適したレイアウトの既存スライドを複製します。コンテンツが少ない場合は、末尾のスライドを削除します。ページ番号のラベルも更新してください。
  5. 不足しているレイアウトのデザイン: テンプレートにないレイアウトが必要な場合は、同じフォント、パレット、装飾表現、余白のリズム、コンポーネントの文法を使って、一からデザインしてください。別のテンプレートに切り替えて済ませてはいけません。
  6. 同梱されているナビゲーションランタイムを維持します。 デッキにassets/deck-stage.jsまたはインラインのキーボードハンドラーが含まれている場合は、そのまま残してください。

出力仕様

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

<artifact identifier="zhangzara-soft-editorial" 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を参照してください。

コメント