花の画像を全部やめて、コードで水彩を描くことにした

押した場所が、花になる

時花は、「今を咲かせる」ボタンを押すと、その時その場所から一輪の花が咲くアプリです。

どの花が咲くかは、現在地を粗いマスに分けた情報から決まります。同じ場所では同じ種類が咲き、押した時刻は花束の淡い色味になる。何も入力せず、説明も出さず、咲いた結果だけを庭に残します。

最初の花は、画像生成で一枚ずつ作った水彩のPNGでした。

画面には置けました。でも、種類を増やすたびに、また外から画像を持ってくる構成です。自分が持っているのは完成した絵で、花を生む仕組みではありませんでした。

欲しかったのは、花の画像より作り方だった

画像生成を自動化する案も、既存の花を学習させる案も考えました。

最後に選んだのは、絵をやめてコードで描くことでした。理由は単純で、生成の仕組みを自分で持ちたかったからです。

花びらの輪郭をパスで作り、薄い色を少しずつ重ねる。中心から放射状に開く花、花びらが重なる花、房や穂になる花。それぞれを画像ではなく、骨格と色のレシピとして持たせました。

最後にMetalのシェーダーで紙の目を重ねると、均一なベクター図形だった花に、水彩らしい揺らぎが出てきました。

最初に咲いた花は、まだ雑だった

最初の実機表示を見たとき、「根っこが雑」「重なりが美しくない」と思いました。

花びらの裏が透けて、後ろの茎が見える。画像の端で花が切れる。茎が広がりすぎて、リボンも茎ではない場所に浮いていました。

花の裏に紙色の薄い下地を置き、前後の重なりを作りました。茎を細くして、根元を束の幅へ集める。切り口をリボンの下へ出して、帯が本当に茎へ巻かれている形に直しました。

かわいい花を一枚作ることと、花束として美しく重なる仕組みを作ることは別でした。

過去の花束も、新しい絵で咲き直す

時花は、咲いた花の画像を保存していません。

保存するのは、押した時刻、場所から作った短い文字列、花の種類、配置を揺らすための種だけです。花束を開くたびに、その情報からもう一度描きます。

だから描き方を変えると、今日の花だけでなく、過去の花束も新しい水彩で蘇ります。PNGを外しても、庭に残した時間は消えません。

花の種類を増やすときも、次から必要なのは画像ファイルではなく、新しい咲き方のレシピです。

絵をコードへ置き換えたというより、時花が自分で花を咲かせられるようになった。今はそんな感覚です。