🥳

『SOZAI』というフリー素材サイトをリリースしました!!

2024/06/20に公開

はじめに


この度フリー素材サイト『SOZAI』をリリースしました!!
この記事では開発の経緯や使用技術について触れていこうと思います。

▼ サイトリンク
https://soz-ai.com/

また、イラストのリクエストもお待ちしております!!
https://docs.google.com/forms/d/10C9FOrT-IvdL9_yN1VUdhgDvWaxExGaTRDWDLMsWfP4/edit

開発の経緯

このサイトを開発するきっかけは大きく二つありました。

きっかけ①

最近、私は「なぜこのAI時代にフリー素材サイトは使われているのか」という疑問がありました。今の時代、Stable DiffusionやDALL-E、Midjourneyを使えば簡単にものの数秒で好きなイラストが生成できます。

思い通りの画像にならない

しかし、実際やってみるとわかるのですが、AIはなかなか思い通りの画像を生成してくれません。イメージに近いものはできても、タッチが違ったり、背景に変なものが描かれていたりします。もちろん、私のプロンプトが悪いのかもしれませんが、AIを使いこなすのは簡単ではありませんでした。

タッチを統一させる難しさ

やっとの思いで理想の画像を生成できたと思ったとしても、ブログやスライドで利用する場合など、複数枚のイラストを使うことがあると思います。その際にスライドごとで画像のタッチが異なってしまったら嫌です。ですが、タッチを統一して画像を生成するのが驚くほど難しいです。

例えば、思い通りの①の画像を頑張って生成したとします。次に同じスライド内で使う別の画像②を①を生成した時のプロンプトをいじって生成させました。しかし、タッチの部分では同じプロンプトを投げたにも関わらず、①と②でイラストのタッチが異なってしまいました。追加で6枚画像を生成しました。

⑦でようやく、①とタッチの近い画像が出てきました。顔の部分は少し違う気がしますが、ここまででもすでに画像を7枚も生成しています。仮にスライドやブログで画像を10枚ほど使うとなった場合、最初の1枚を生成し、その後の9枚はタッチを統一するために各7枚ずつ生成する必要があります。トータルで64枚の画像を生成する必要があります。しかも、例で出した雪だるまを作る女の子のような細かい設定がある場合、細かくプロンプトで指定する必要があり、大変面倒です。

そもそもAIを使ってない

ここまでAIで思った通りの画像を生成する難しさについて記述しましたが、そもそもAIを使ったことある人が少ないのではないかと思います。デザイナーやエンジニアなどの新しい技術トレンドに敏感な方は当たり前に使ったことあるかもしれませんが、私の周りではあまりAIを役立ててる人は少ないイメージです。おそらくそういう人は画像をAIで生成したことがないと思います。

これらのことからフリー素材サイトがいまだ使われている理由に納得しました。

きっかけ②

私はブログを書いたり、スライドを作成する際に普段よく以下のフリー素材サイトを使わせていただいています。フリー素材サイトの先輩として先輩呼びさせていただきました。

他にもundraw先輩や、ソコスト先輩、私がXやZennのアイコンとして使わせていただいている黒猫のフリー素材を扱っているぴよたそ先輩とかもよく使わせていただいています。
https://hiyokoyarou.com/

有名どこのフリー素材サイトは結構使わせていただいている気がするんですが、全体的にゆるくて可愛い系のイラストに偏っているイメージがあります。なので、書き込み量多めのわりかししっかり系のフリー素材サイトがあればいいなと思いました。

ハッカソン + 継続開発

開発の経緯で書いたきっかけ①ときっかけ②の考えが自分の頭にある状態でサポーターズさん主催の技育CAMPハッカソンに出ました。そこで開発メンバーにこの考えを伝えたところAIで生成した画像でフリー素材サイトを作ろうということに纏まりました。チームメンバーにAIで画像生成をやっていて詳しいという方がいたので画像制作はその方に任せることにしました。きっかけ①で自分がネックにしていたイラストのタッチを統一することに関する難しさに不安感はありましたが、私はサイト開発に専念しました。

画像生成

Stable Diffusionを用い、のべ15435枚の画像を生成しました。その後3人でチェックをしてタッチの揃った画像だけをピックアップし最終的に216枚をサイトに掲載することになりました。

私の当初の懸念通りタッチをバシッと揃えることは容易ではありませんでした。また、右側二枚のようにタッチが揃っていてもイラストとしてバグってしまっているものも多数ありました。

しかし、画像生成班のメンバーが効率的に画像生成を行い、チェックするフローを構築したおかげで、画像の生成と選別を比較的スムーズに進めることができました。ハッカソン後もさらに画像の枚数を増やしています。

サイト制作

非常にシンプルな構成で作成しました。

サイトはSSGで作成しており、かなり良いパフォーマンスだと思います。しかし、視覚的な読み込み速度が1.5秒と遅く、改善の余地があります。

また、ハッカソン時はVercelのHobbyプランにてデプロイしていたのですが、商業利用できず、Adsenseを申請できないため、Netlifyに移行しました。microCMSはHobbyプランでも商業利用できるようです。
https://help.microcms.io/ja/knowledge/free-plan-for-ads

SSGを採用しているため、ビルド時間にも注意を払っています。NetlifyのHobbyプランでは月に300時間のビルド時間が無料で提供されており、現在問題はありません。しかし、今後画像の枚数が増えることが予想されるため、webpackからturbopackへの移行や並列処理などの最適化を進めています。

どうやらCloudflareのHobbyプランも商業利用無料可能で、Netlifyに比べて月のビルド時間が500時間と200時間も長いため移行を検討しています。

まとめ

拙い記事でしたが、最後まで読んでいただきありがとうございました。自分のふとした疑問や思いがきっかけとなってハッカソンでそれを形にすることができ、リリースに至れました。開発期間も短く、サービスとしてもまだまだだとは思いますが、よかったら普段のスライド作成やブログ執筆時などに使っていただけると開発チーム一同嬉しく思います。また、お問い合わせフォームを通じてご意見も受け付けているので、フィードバックなどいただけるとありがたいです。

Discussion