厳選・オープン・無料
Playful Software
大切な人々のための、パーソナルミニアプリを構築・共有するためのプラットフォーム。
ProductPlayfulBold TypographyGradientConsumer
01
デザイン DNA
パーソナルクリエイティブ共有可能なミニアプリ遊び心のある
パーソナルな瞬間を描き出すデジタルキャンバス
02
カラー
#FF2E95Accent
#141414Ink
#FAF7F5BG
#414040Muted
rgba(232,229,224,1)Line
エネルギッシュなピンクアクセントを持つ、温かみのある親しみやすいニュートラル。
03
タイポグラフィ
humanist-sans
ディスプレイテキストは、最大のインパクトのために Tight tracking と Heavy weight を使用。 · 本文テキストは、Regular weight と豊かな line-height で快適な可読性を維持。 · 見出しは強力な視覚的焦点をつけるため、中央揃え。
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
中央のヒーローブロック周辺に広い余白を設け、メッセージを強調。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 16px
lg · 40px
pill · 999px
カードの区切りに、rgb(232,229,224) の控えめな 1px ボーダーを使用。
rgba(0, 0, 0, 0.14) 0px 4px 20px 0px · rgba(71, 71, 71, 0.1) 0px 2.18px 5.44px 0px
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
中央揃えのシングルカラムヒーローレイアウトから、コンテンツ用のフルワイドグリッドへと推移。
07
モーションとインタラクション
220msmicro
350mssmall
800msmedium
cubic-bezier(0.34, 1.56, 0.64, 1)easing
遊び心のある UI インタラクションのための弾力的なイージング。 · 背景と透過度の滑らかなトランジション。
インタラクティブ要素上の控えめな色の変化と軽微なスケーリング。 · カスタムイージングカーブを使った弾力的なフィードバック。
08
コンポーネント
- button アクセントカラーと白のテキストを使用した、高コントラストのピル型ボタン。
- card 柔らかいシャドウを持つ角丸のカード。動的なスタックでオーバーラップさせることも多い。
- chip 最小限に使用。主にメール入力などのフォーム要素用。
- input 控えめなボーダーを持つ、クリーンで角丸の入力フィールド。
- hero ソフトなグラデーション背景の上に、浮遊する3Dスタイルのアプリアイコンと、大規模な太字タイポグラフィ。
09
文体と禁止事項
- トーン フレンドリーで、率直かつ革新的。
- 見出し パーソナルなタッチを含む、太字の宣言的なステートメント。
- CTA 「ウェイトリストに参加」のような、行動を促す呼びかけ。
- 退色した企業的なグレーを使用しない — スクリーンショットは暖かいベージュ/クリーム(#FAF7F5)の背景を示している。
- 見出しに薄い装飾的なセリフ体を使用しない — スクリーンショットは太く太字のヒューマンサンスを示している。
- 暗くムーディーなカラーパレットを使用しない — スクリーンショットは明るく、風通しが良く、暖かい環境を示している。
- 主要な要素にシャープな 90 度の角を使用しない — スクリーンショットは高ラジウスのピル型と角丸のカードを示している。
- 消極的で控えめなコール・トゥ・アクションを使用しない — スクリーンショットは鮮やかなピンク(#FF2E95)のボタンを示している。
- 過度なボーダーや区切り線を使用しない — スクリーンショットはクリーンで、最小限または目立つラインのないサーフェスを示している。
- 避ける: 企業的な専門用語
- 避ける: 複雑な技術用語
- 避ける: 過度にフォーマルまたは冷たいトーン
- 避ける: 攻撃的なセールス言葉
- 避ける: 小さく控えめなタイポグラフィ
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これは、パーソナルなクリエイティビティと共有を重視した、「Playful Software」の消費者向けランディングページ。デザインのDNAは、温かみのある亲しみやすいベージュ(#FAF7F5)の背景、ソフトなピンクグラデーション、そして鮮やかなピンク(#FF2E95)のアクセントカラーを特徴とする。タイポグラフィは太字のヒューマンサンスで、宣言的でインパクトのある見出しに使用。重要な制約:冷たい企業的なグレーや暗い背景は決して使用しない;見出しに薄い装飾的なセリフ体フォントを使用しない;プライマリUI要素にシャープな90度の角を使用しない;消極的で控えめなコール・トゥ・アクションのカラーは決して使用しない;暖かいデザインを雑にする過度なボーダーや複雑なグリッドラインは避け;ドライで技術的な声口は使用せず、フレンドリーで率直なトーンを維持すること。
en · zh-CN · zh-TW · ja · ko