自宅の温度や湿度、気圧を記録して可視化したいと思ったことはありませんか？
市販の温湿度計も良いですが、せっかくならスマホからいつでも確認できるようにしたり、独自の機能を追加したりしたいものです。
今回は、自作の温湿度・気圧ロガーのデータを可視化し、さらにデータからエアコンの使用状況（暖房・冷房）を自動判定するアプリを作成しました。
また、開発にあたってはGoogleのAIエージェント「Antigravity」を活用し、コーディングからデザイン、ビルドまで日本語で指示をして実装してもらいました。
この記事では、作成したアプリの概要と、AIを使った開発プロセスについて紹介します。
作成したアプリの概要
今回作成したのは「Insight MyRoom」というアプリです。
バックエンドに FastAPI、フロントエンドに Streamlit を使用し、Pythonのみで構築しました。
主な機能
- リアルタイムモニタリング: 現在の温度・湿度・気圧を表示し、不快指数(DI)から「快適」「暑い」「寒い」などを判定・ゲージ表示します。
- 履歴グラフ: Plotlyを使用し、過去24時間のデータをインタラクティブなグラフで確認できます。
- エアコン稼働判定: 室温の変化率と外気温との差分から、エアコンが「暖房」または「冷房」で稼働しているかを推定・可視化します。
- レスポンシブデザイン: CSSをカスタマイズし、スマートフォンでも見やすいカード型UIを実現しました。
システム構成
- Backend: Python (FastAPI)
- データベースからセンサーデータを取得
- 外部APIから外気温を取得
- データ分析・加工（エアコン判定ロジック）
- Frontend: Python (Streamlit)
- データの表示
- グラフ描画 (Plotly)
- 認証連携 (JWT)
- Database: MySQL (センサーデータ蓄積用)
エアコン稼働判定ロジック
このアプリの目玉機能である「エアコン判定」は、単純な温度の閾値ではなく、温度の変化率と外気温との関係を用いて判定しています。
具体的には、backend/analysis.py にて以下のようなロジックを実装しました。
def analyze_room_data(records):
# ...
# 30分間（3レコード分）の温度変化を計算
df['temp_diff'] = df['temperature'].diff(periods=3)
HEATING_THRESHOLD = 0.8 # 暖房とみなす上昇幅
COOLING_THRESHOLD = -0.8 # 冷房とみなす下降幅
for i in range(len(df)):
temp_diff = df.iloc[i]['temp_diff']
room_temp = df.iloc[i]['temperature']
out_temp = df.iloc[i].get('outdoor_temperature')
if temp_diff > HEATING_THRESHOLD:
# 室温が急上昇 かつ 外気より室温が高い（または外気が寒い）場合 -> 暖房
if out_temp is None or out_temp < room_temp:
df.at[df.index[i], 'ac_mode'] = "HEATING"
elif temp_diff < COOLING_THRESHOLD:
# 室温が急低下 かつ 外気より室温が低い（または外気が暑い）場合 -> 冷房
if out_temp is None or out_temp > room_temp:
df.at[df.index[i], 'ac_mode'] = "COOLING"
# ...
このように、「急激に温度が上がった・下がった」タイミングを検出し、それが自然な気温変化（外気温との整合性）と矛盾する場合に「エアコンによるもの」と推定しています。
判定結果はグラフ上に赤（暖房）や青（冷房）の帯として表示され、一目で稼働状況がわかります。
Antigravityとの開発プロセス
今回はコーディングのほぼ全てをAIアシスタント「Antigravity」に行ってもらいました。
指示の出し方
「温度・湿度・気圧のデータを可視化したい」「エアコンの使用状況を判定したい」といった要望を日本語で伝えるだけで、必要なディレクトリ構成やライブラリの選定（FastAPI + Streamlit）を提案してくれました。
特にデザイン面では、「スマホで見やすく、少しリッチなUIにしたい」と伝えると、Streamlit標準のUIではなく、カスタムCSSを注入してカード型のデザインにする提案をしてくれました。
/* AIが生成したCSSの一部 */
.hero-container {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 20px;
border-radius: 15px;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
/* ... */
}
苦労した点とAIのサポート
Streamlit上での認証機能の実装（URLハッシュからのトークン取得）などは少し複雑でしたが、JavaScript連携部分(streamlit-javascript)を含めてAIがコードを書いてくれたため、スムーズに実装できました。
まとめ
Antigravityとペアプログラミングをすることで、ロジックの検討や「どう見せるか」というデザイン部分に集中してアプリ開発ができました。
特に、データ分析ロジックとWebアプリの実装を同時に進められる点は非常に効率的でした。
今後は、エアコンのON/OFF判定の精度向上や、蓄積されたデータを使った電気代の推定機能などを追加していきたいと思います。