「style」の検索結果

メンバー一覧や活動履歴、役割別グラフを備えたチーム管理画面を作るスキル。タブ切替や明暗表示、CSV出力が動く単一HTMLの試作を作成します。

• チーム管理画面を試作したいとき
• 役割の構成やオンライン状況の説明
• メンバー情報や活動をタブで確認

ドキュメントや文章をVercelの文章ガイドラインに照らして確認し、語り口、トーン、書式、構成の指摘を、ファイル名と行番号付きで簡潔に返します。

• 公開前のドキュメントを点検したいとき
• 複数ファイルの語り口を確認したいとき
• 書式や構成の問題を探したいとき

恋愛・マッチングサービスやコミュニティの数値を、主要指標とグラフで見せるデスクトップ向け画面を、落ち着いた誌面風の単一HTMLに仕上げるスキル。

• 恋愛サービスの管理画面を試作したいとき
• コミュニティ活動の一覧画面
• 相互マッチ数とマッチ率の推移表示

ブランドに合わせた報告書や提案書を、OpenXML SDKでDOCX文書として作成・編集するスキルです。テンプレートを使った文書づくりにも向いています。

• ブランドに合わせた報告書の作成
• 体裁の整った提案書を作りたいとき
• テンプレートを使った文書作成

商品発表やSNS共有向けの縦長ポスターを作成。大きな見出し、鮮やかなグラデーション、要点カードを組み合わせ、伝えたい情報を一枚にまとめます。

• 新商品の縦長ポスターを作りたいとき
• SNSで共有する告知画像の作成
• 特徴3〜5点を一枚にまとめたいとき

入力した文章やデータを、いいね・リポスト・閲覧数付きのX風投稿カードに整え、動画への重ね表示や画像共有に使う単一HTMLを作るスキル。

• 動画に投稿カードを重ねたいとき
• 印象的な言葉を共有用カードにしたいとき
• 入力データを短い投稿文にまとめたいとき

ユーザー調査の背景・参加者構成・行動パターンを、紙の温かみを感じるスイス様式の3枚のHTMLスライドに整理し、図表と控えめな動きで伝えるスキル。

• ユーザー調査を3枚で報告したいとき
• 参加者構成をドーナツグラフで表示
• 行動パターンと根拠を並べた説明

リリースの追加機能、修正、互換性を損なう変更、既知の問題、更新手順を1ページのHTMLに整理します。未提供の情報も明示し、変更内容を共有する文書を作ります。

• バージョン更新の案内を作りたいとき
• 追加機能と修正を一覧で共有したいとき
• 互換性の変更と更新手順の説明

製品紹介や発表内容を、余白と大きな見出しを生かしたKeynote風のWebスライドにまとめます。左右キーやスペースキーで切り替え、ページ番号も表示します。

• 製品紹介のスライド作成
• 登壇用の発表資料を準備したいとき
• データ図を1枚で見せたいとき

温かみのあるモノトーンと文字の強弱、広い余白を使い、カードのグリッドや淡い差し色で、雑誌のように情報を整理したミニマルなWeb画面を設計するスキル。

• ミニマルなプロダクト画面を試作したいとき
• 機能紹介カードの非対称グリッド配置
• 書体・余白・配色を統一したいとき

告知やメッセージを、アプリアイコンと見出しを備えたmacOS風の通知バナーに整えます。動画への重ね表示や製品予告、SNS画像に使えるHTMLを作成します。

• 動画に通知バナーを重ねたいとき
• 製品公開の予告を作りたいとき
• SNS用の告知画像作成

CSVやJSONのデータを、新聞記事風の見出しと段階的なアニメーション付きの図表にします。折れ線・棒・範囲帯で、動画やSNS向けに結論を伝えます。

• 動画でデータの推移を伝えたいとき
• SNS用の図表カードを作りたいとき
• CSVやJSONを図表にしたいとき

動画の転換場面やサイバーパンク風のメインビジュアルに使うタイトル画面を、色ずれや走査線、文字の乱れを重ねた単一のHTMLで作るスキル。

• 動画の転換用タイトルを作りたいとき
• サイバーパンク風の画面制作
• 見出しに文字の乱れを加えたいとき

業務手順やシステムの流れを、付箋と曲線の矢印で白板風に図解するスキル。分岐や合流も表し、導入案内や運用説明に使える単一HTMLにまとめます。

• 利用開始までの流れを図解したいとき
• 運用手順を説明したいとき
• システム構成の説明

流体のように揺れる背景に大きな見出しや短いメッセージを重ね、動画の冒頭、ランディングページのメインビジュアル、ポスターに使える単一HTMLを作ります。

• 短いメッセージ付きの動画冒頭を作りたいとき
• ランディングページのメインビジュアル制作
• 流体背景のポスターを作りたいとき

暖色の光漏れ、35mmフィルム風の粒子、大きなセリフ体を組み合わせ、映画風の冒頭画面や章タイトルを作るスキル。単一のHTMLにまとめます。

• ドキュメンタリーの冒頭画面制作
• 個人短編のタイトル画面作成
• 映画風の章タイトル制作

写真をもとに、Funko PopやPop Mart風の動くGIFステッカーを作るスキル。MiniMax APIを使い、チャット用スタンプやアバター集の制作に使えます。

• 写真から自分用のチャットスタンプ制作
• 玩具風の動くステッカーを作りたいとき
• 写真をもとにしたアバター集の制作

公開サイトの配色・フォント・ロゴ・画像・文体を実測して整理し、ブランドガイドやプレビュー付きの再利用可能なデザインシステムにまとめるスキル。

• サイトの配色・フォント・ロゴの整理
• 参考サイトからブランドガイドを作りたいとき
• ブランドを表す画像の収集

React、Tailwind CSS、shadcn/uiを使い、複数の部品を組み合わせたclaude.ai向けのHTMLアーティファクトを制作するスキル。

• claude.ai用のHTMLを作りたいとき
• 複数部品からなる画面の試作
• Reactとshadcn/uiでの制作

暗い背景とセリフ体を使い、ファッション誌のような３ページの映像的な演出を作ります。文字の段階表示や章の切り替えを備えた単一のHTMLにまとめます。

• ファッション誌風の動く紹介を作りたいとき
• 短い物語を３ページで見せたいとき
• 既存のブランド表現を暗い誌面に反映

p5.jsで、計算ルールと乱数を使ったアートを制作します。乱数の初期値を固定して同じ描画を再現でき、ポスターや動きを感じる静止画、画面構成の試作に使えます。

• ルールからポスターを作りたいとき
• 動きを感じる静止画の制作
• アートの画面構成の試作

雑誌の誌面と電子ペーパーを思わせる横長スライドを作ります。10種類のレイアウトと5種類の配色で、主張やデータを紙の印刷物のような見た目にまとめます。

• 主張を雑誌風の資料で伝えたいとき
• 研究結果や重要な数値の共有
• 章立てのある発表資料の作成

1920×1080の固定キャンバスで、内容に合わせて構成を自由に組むスライド制作スキル。配色や文字サイズを統一し、キーボードで切り替えるHTMLにまとめます。

• 個人の作品集を作りたいとき
• 美術やデザインの授業資料
• 問いや画像が主役の講演資料

ボタンや通知などの細部を見直し、操作に合った動きと反応を設計するスキルです。アニメーションの要否からCSS実装、アクセシビリティまで検討します。

• アニメーションの要否を判断したいとき
• ボタンや通知の操作感を整えたいとき
• UIコードを変更前後で比較したいとき