- プロンプト実行例
どんなアプリのデザイン仕様書を作成したいですか？
アプリ名
画面
デザイン仕様書：
ページレイアウトと構造
- ログインページ：
- ロゴとタイトルが中央に配置される
- ユーザー名とパスワードの入力フォームが垂直方向に並ぶ
- ログインボタンがフォームの下に配置される
- ダッシュボードページ：
- ナビゲーションバーがページ上部に固定配置される
- サイドバーが左側にあり、メニュー項目が垂直に表示される
- メインコンテンツがサイドバーの右側に表示される
- チャートがメインコンテンツ内に埋め込まれる
UI要素と配置
- ログインページ：
- ロゴ
- タイトル
- ユーザー名入力フォーム
- パスワード入力フォーム
- ログインボタン
- ダッシュボードページ：
- ナビゲーションバー：
- ロゴ
- ログアウトボタン
- サイドバー：
- ダッシュボード
- タスク管理
- レポート
- メインコンテンツ：
- チャート
- ナビゲーションバー：
スタイリングとカラースキーム
- ログインページ：
- 背景色: #f5f5f5
- ボタンカラー: #007bff
- ダッシュボードページ：
- ナビゲーションバー背景色: #333
- ナビゲーションアイテムカラー: #fff
- サイドバー背景色: #f8f9fa
- メインコンテンツ背景色: #fff
- チャートカラー: カラーパレットを使用
インタラクションとアニメーション
- ログインボタンをクリックすると、ログイン処理が開始される
- チャートにマウスオーバーすると、詳細情報がポップアップで表示される
- ナビゲーションアイテムをクリックすると、対応するコンテンツがメインエリアに表示される
追加技術仕様
- CSS Flexboxを使用してレイアウトを調整する
- チャートにはchart.jsライブラリを使用して作成する
<design_specification> こちらの設計に沿って、HTMLとCSSを使用してログインページとダッシュボードページのデザインを実装します。Flexboxを使ったレイアウト調整とchart.jsライブラリを使用したチャート作成を行います。スタイリングは指定されたカラースキームに従い、インタラクションやアニメーションを実装します。 </design_specification>
コメント 0
他のプロンプトもチェック
画像生成
資料作成
推奨モデル - DALL•E 3「見せる資料」から「魅せる資料」へ ～ あなただけのオリジナルクリップアートで「デキる人」に！ あなたのスライドが一瞬で"かっこいい"に生まれ変わります。 資料作成で、「もう少し見栄えがよければ…」 そんなモヤモヤした経験、ありませんか？ 標準のクリップ素材ではダサくて独自性もありません。 このプロンプトなら、その悩みはもう過去のもの。背景が白だから、切り貼り自由自在。パワポでも、Googleスライドでも、どんなプレゼン資料にも一瞬でフィット。まるで、あなた専属のデザイナーが作ったような仕上がりに。 ★シンプルなのに圧倒的に印象的★ どんなテーマでも、洗練されたデザインに変える魔法のプロンプト。アイデアを輝かせるシンプルさと、心を掴むかっこよさ。これを使えば、あなたの資料は「伝わる」を超えて「惹きつける」スライドに。 たとえば… ・新製品のプレゼンで、「これがイノベーションだ」と言わずとも伝わる視覚効果。 ・営業資料で、数字が語りかけるような説得力を演出。 ・セミナーや学会で、プロフェッショナルさを感じさせる仕上がりに。 ＜切り抜き方法の例＞ 1.ツールを使用する方法 生成した写真をダウンロードし、それを「remove.bg」や「clipdrop」などの背景削除ツールにアップして使うことで簡単に切り抜きできます。 https://www.remove.bg/ja https://clipdrop.co/remove-background 2.iPhoneを使用する方法 iPhoneの写真アプリに保存していれば、写真を開いて人物部分を長押し →切り抜く部分が選択されたのを確認し、「共有」→「写真に保存」をタップ ＜無料デザインツールの例＞ Canva https://www.canva.com/ja_jp/ Adobe Express https://new.express.adobe.com デザインAC https://www.design-ac.net/ （使い方などはYouTube動画等で検索してください）13046188GPTs
チャットボット
私は簿記に関する問題の解決をサポートするために設計されたAIです。特に日本の簿記に関する問題を解決することを目的としています。初心者や簿記の資格試験を目指している方に対して、わかりやすい説明を提供し、学習を支援することができます。以下の点に留意しながらサポートします： 1. **分かりやすい説明**： - 専門用語を使う場合は、その都度説明を加える。 - 初心者向けのシンプルな言葉で説明することを心がける。 2. **柔軟な対応**： - ユーザーの理解度や質問の具体性に応じて、説明の詳細や複雑さを調整する。 - 資料やテキストに基づいて具体的な例を用いる。 3. **簿記の基本概念の説明**： - 例えば、「貸借対照表」、「損益計算書」、「貸倒引当金」、「売上原価」などの基本的な概念を明確に説明する。 4. **実際の問題の解決**： - 提供された資料に基づいて具体的な仕訳や計算を行う。 - ユーザーが持ち込んだ資料や問題を解析し、適切なアドバイスや解答を提供する。 例を挙げると、以下のような問題に対応できます： - 決算整理仕訳の方法についての質問 - 貸倒引当金の設定とその処理方法の説明 - 財務諸表の作成に関するガイドラインの提供 質問があれば具体的に教えてください。資料に基づいて詳細な解答を提供いたします。10201465ロールプレイ
推奨モデル - GPT-4o聞きたいことを言えば、 ギュッ！ と詰めて回答します。本当に短い回答ながらも、分かりやすく！！ ※あくまでAIですので情報に誤差があったり、簡潔な情報を教えるだけで詳しいことは言いません。00940
