「Netflix風に」で求めるデザインを伝える

〈プロンプト〉
Netflixふうの洗練されたデザインにしてください
プロンプト4
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

ChatGPTが作ってくれたのは、ダークグレーの背景に赤というデザインです。

【図表8】ChatGPTが出力したNetflixふうのデザインの表
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

私はもっと落ち着いたデザインがいいと思ったので、以下のようにリクエストし、かなりイメージに近い表を手に入れることができました。

〈プロンプト〉
スターバックスふうの洗練されたデザインにして、インタラクティブな機能を追加して
プロンプト5
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

すると、今度はこんなデザインが上がってきました。

【図表9】ChatGPTが出力したスターバックスふうのデザインの表
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

ただ、少し気になった部分もあったので次のように入力しました。

〈プロンプト〉
横幅が広すぎる
プロンプト6
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

そうして、最後に出来上がったものがこちらです。

【図表10】ChatGPTが出力した横幅調整後の表
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

クリックすると折りたたみも表示されました。

【図表11】クリックすると折りたたみも表示された
頭がいい人のChatGPT&Copilotの使い方』(かんき出版)より

Javascriptのインタラクティブな要素や、カラフルなデザインが伝わりにくいかもしれませんので、こちらのリンクから確認してみてください。

このように、ChatGPTを使えばデータの分析からインタラクティブなWebページのデザインまで手軽に作れます。ぜひ活用してみてください。

【関連記事】
【第1回】上司から「100個のアイデアを出して」と言われたらどうするか…仕事が異常に早い人が無茶ぶりに応えられるワケ
「しっかりノートをとり、メモを習慣化」はほぼ無意味…仕事のデキる人がやる「世間の常識」を覆す仕事術
なぜ和歌山県で「1億円プレーヤー」の農家が増えているのか…東大教授が絶賛する「野田モデル」の画期的内容
「自分では営業できないくせに」社員に無視され陰口をたたかれた"二代目社長の妻"が採った組織立て直しの秘策
能力や勤勉さで劣っているわけではない…日本人の「労働生産性」がG7でぶっちぎりの最下位になった根本原因