WEB先案内の自主開発記録

植物のデータを見るサイトに、成長日記とゲームを組み合わせる。Ivyの開発では、機能を増やすことと、使いやすい形に整えることを行き来してきました。ここでは、実際に見直した点と、その考え方を紹介します。

企画・開発・記録：WEB先案内 · 2026年9月28日までの開発内容

この開発で大切にしたこと

最初に考えたのは、何を見に来る場所なのか

観測データ、写真、植物のしくみ、ゲーム。見せられる内容が増えるほど、トップページに情報が集まりがちになります。そこで、写真は成長日記、読み物ははっけんノート、数値の変化は観測グラフへと役割を整理しました。

ヘッダーメニューから行ける場所を何度も大きく案内するより、トップではその場で見たい情報を優先する。開発では、このような掲載内容の引き算も行っています。

写真で植物の姿を見た後、その頃の観測データを確認したくなる。成長日記からグラフへ進む導線は、この行動を支えるものです。グラフを置くだけでなく、どこから、どの期間を見るのかまで考える必要がありました。

また、保存された観測データは現在の状態そのものではありません。記録の日時と表示の意味が混同されないことも大切にしています。

モバイルでゲームを全画面にするという要望では、周辺UIだけでなく、ゲームフィールドを画面いっぱいに表示することが求められていました。機能名が同じでも、期待される体験が一致しているとは限りません。

表示領域、背景の縦横比、プレイヤーの移動範囲を合わせて考えることが、操作感の改善につながります。画面が広がったように見えることと、実際に動けることは別々に確認します。

Garden Flightでは、ボスから分離した砲台が独立して攻撃します。その速度を調整する際、砲台が帰還し終わるフレームだけ、接触判定を飛ばしてしまう問題を確認しました。

移動の終点だけを見るのではなく、移動区間で接触を確認し、判定を終えてから本体に戻す処理へ修正しました。速度の数値を変更するだけで終えず、その変更が既存の処理に与える影響も確認する必要があります。

AIは案の具体化、コードの作成、関連箇所の調査、確認項目の整理を助けます。一方で、どんな体験にしたいか、何を削るか、どの難易度が楽しいかは、目的と実際の操作を踏まえて判断していきます。

開発を進める際は、既存の構造を読む、変更範囲を絞る、戻せる状態を残す、変更後の動作を確かめる、という手順を重視しています。AIの利用だけを品質の根拠にはしません。

Ivyは、画面と改善の過程を見られる自主開発の実例です。ご自身のサイトで実現したいことがあれば、「誰が使うか」「何ができると助かるか」からお聞かせください。