- プロンプト実行例
どんなアプリのデザイン仕様書を作成したいですか？
アプリ名
画面
デザイン仕様書：
ページレイアウトと構造
- ログインページ：
- ロゴとタイトルが中央に配置される
- ユーザー名とパスワードの入力フォームが垂直方向に並ぶ
- ログインボタンがフォームの下に配置される
- ダッシュボードページ：
- ナビゲーションバーがページ上部に固定配置される
- サイドバーが左側にあり、メニュー項目が垂直に表示される
- メインコンテンツがサイドバーの右側に表示される
- チャートがメインコンテンツ内に埋め込まれる
UI要素と配置
- ログインページ：
- ロゴ
- タイトル
- ユーザー名入力フォーム
- パスワード入力フォーム
- ログインボタン
- ダッシュボードページ：
- ナビゲーションバー：
- ロゴ
- ログアウトボタン
- サイドバー：
- ダッシュボード
- タスク管理
- レポート
- メインコンテンツ：
- チャート
- ナビゲーションバー：
スタイリングとカラースキーム
- ログインページ：
- 背景色: #f5f5f5
- ボタンカラー: #007bff
- ダッシュボードページ：
- ナビゲーションバー背景色: #333
- ナビゲーションアイテムカラー: #fff
- サイドバー背景色: #f8f9fa
- メインコンテンツ背景色: #fff
- チャートカラー: カラーパレットを使用
インタラクションとアニメーション
- ログインボタンをクリックすると、ログイン処理が開始される
- チャートにマウスオーバーすると、詳細情報がポップアップで表示される
- ナビゲーションアイテムをクリックすると、対応するコンテンツがメインエリアに表示される
追加技術仕様
- CSS Flexboxを使用してレイアウトを調整する
- チャートにはchart.jsライブラリを使用して作成する
<design_specification> こちらの設計に沿って、HTMLとCSSを使用してログインページとダッシュボードページのデザインを実装します。Flexboxを使ったレイアウト調整とchart.jsライブラリを使用したチャート作成を行います。スタイリングは指定されたカラースキームに従い、インタラクションやアニメーションを実装します。 </design_specification>
コメント 0
他のプロンプトもチェック
物語・脚本・プロット
推奨モデル - Gemini入力したテーマに基づいてオリジナルの名言を生成するプロンプトです。感情を深く掘り下げ、強力な言葉や比喩を用いて、心に響く名言を5つ作り上げます。「Gemini 1.5 Pro」に切り替えて実行するのが一番良さそうです。 ＜用途例＞ 【プレゼンテーションやスピーチ】感動的な名言を引用することで、聴衆の関心を引き、メッセージを強調します。 【SNSやブログの投稿】心に響く名言を投稿することで、フォロワーの共感を得ることができます。 【自己啓発やモチベーションアップ】毎日の励ましや自己反省の一環として、自分に向けた名言を作成し、モチベーションを維持します。 【ギフトやカードのメッセージ】特別な日に贈るカードやギフトに添えるオリジナルの名言で、相手に感動を与えます。 ＜メリット＞ 【クリエイティブな表現力の向上】自分自身の感情や考えを言葉にすることで、表現力が養われます。 【個性を反映】自分だけの名言を作成することで、個性や独自の視点を表現できます。 【感動や共感を生む】感情に訴える名言を作成することで、他者との共感を深めることができます。 【簡単で楽しい】指定された手順に従うだけで、簡単に魅力的な名言を作成できます。 「 ぜひ、あなたの唯一無二の名言を創り出してください。感動を呼び起こし、日常に彩りを与えるオリジナルの名言があなたの人生を変えるかもしれません。8063902
