この学び場を作った全工程

「いい感じにして」で出てくるもの

ロゴと、最初の画面の演出。ここがいちばん、頼み方の差が出たところでした。

最初のうちは、かっこいい感じで、とか、動きを付けて、みたいな注文をしていました。 返ってくるのは、悪くはないけどどこかで見た形。曖昧な注文には、平均が返ってくるんですよね。 当たり前で、こちらが何も決めていないので、向こうは無難なところへ寄せるしかない。

ロゴは、画像生成を挟まずにやろうとして失敗しました

最初、ロゴは画像生成を通さずに、そのままコードで描いてもらっていました。 画像生成を挟まなくても、いい感じにできるんじゃないかと思っていたんですよ。 で、できなかった。そこは甘えてましたね。

3回直して、指摘はどれも正しくて、直すたびに良くはなった。それでも届かなかったし、 アニメーションを通すと不可解な動きをしたりして、ロゴとしての完成度が低いままでした。 なので途中で切り替えて、ちゃんと画像生成でロゴを作りました。コンセプトを教えて、色合いも教えて、生成した画像を素材としてロゴに使う。 この形にしてから、一気に決まりました。

頭の中の動きを、そのまま口にする

演出は、自分が見たいものを先に言葉にできるかで決まります。

起動の演出には、頭の中に絵がありました。細かい粒が渦を巻きながら集まってきて、ロゴの形になって止まる。これを、そのまま丸々口にして渡しました。プロンプトの型は無いです。 やり取りしながら実際に固まっていった条件が、これです。

• 着地は下から上へ。同時に着地すると、現れたように見えて、組み上がったようには見えない
• 着地の直前に少し行き過ぎて、戻る。ぴたりと止まると、置いたように見える
• 粒は多めに出す。少ないと、集まりきる前の絵がスカスカで、何になるのか読めない
• 粒の跡は短く。長いと、出発点から着地点まで画面を横切ってしまう

どれも技術の話ではありません。全部、見え方の話です。「下から順に」「少し行き過ぎて戻る」は、僕が頭の中で見ていたものをそのまま書いただけ。 で、近づくんですよね、言葉にしたぶんだけ。

結局ここで要ったのは、うまいプロンプトではなくて、頭の中で見えているものを、そのまま言語化する力のほうでした。 うまく言葉が出ないときは、STEP 2の雑な思考をまとめるプロンプトに ぼんやりしたまま喋って、向こうに言葉へ起こさせればいいです。

1枚を差し替えると、全部が作り直される

もう1つ、地味に効いている決めごとがあります。もとになるロゴの画像は1枚だけという形にしてあること。

1. もとになる1枚を差し替える
2. 用意しておいた作り直しの命令を、1回走らせる
3. タブの小さいアイコン、アプリのアイコン、暗い画面用のロゴ、共有したときに出る画像が、全部作り直される

起動の演出の粒も、同じ1枚から位置を読んでいます。 なのでロゴを変えれば、粒の形も色も一緒に変わる。手で別々に直す場所が、1つも残っていない状態です。

ここは、作るものが何であっても効く考え方です。 同じ素材から何種類も作るなら、もとになるものを1つに決めて、 残りは毎回そこから作り直す形にしておく。

つまずきやすいところ

ここまでのまとめ