仕事に関係ない場面で会った人にはこういう名刺を配っている。
このブログにも使っているドメイン(ikki418.jp)を載っけているけど、この飛び先で表示するページがずっとなかったので、簡単なものを作ろうと思っていた。ちょうど昨年の暮れに同僚にGoogle AI Studioのことを教えてもらって、見た目の出力がなかなかいけているなと思っていたので使ってみることにした。
上の写真と一緒に、下記のプロンプトを渡した。(使ったモデルはGemini 3 Flash Preview)
この名刺の飛び先(ikki418.jp)で表示されるポートフォリオサイトをつくりたいです。
ただし今出せる実績はあんまりないので、コンテンツは下記の通りとしてください- トップページ
- アイコンと名前、その下に「@ikki418」を小さく表示
- 上部にドットの雲が流れるアニメーション
- TOP/Profile/Linkのメニュー
- Profile
- 編集するだけの雛形をつくること
- Link
- はてなブログ(x.ikki418.jp)へのリンクを入れておくことそして上記はWebサーバーへFTPで上げるだけの状態にしてわたしてください
---
できたサイトがこれ
---
細かい調整などは手で入れているが7-8割くらいはそのまま使えるものが出てきた印象だった。
プロンプトでは「FTPで置くだけにして」と言ったんだけどviteプロジェクトで生成してわたしてきたので自分でビルドした。CSSはtailwindを使っている。何回かいろんなお題でWEBページの生成を試したんだけど毎回このvite+tailwindの構成だったので、この組み合わせが好み?らしい。
1年前(2024年末くらい)の生成AIではビジュアル面の検討をさせるのはまだ厳しいのかなーと思っていたけどこの1年間でぐっと進歩していることを感じる。特にコードで取り扱える範囲であればいろんなデザインがそれなりのレベルで一発で作れるようになっている。tailwindとかでソースの文字だけで判断できるように寄っていったのが大きいのかな
