架空の自動販売機検索サイトになります。
URL
https://juicenavimikke.com/index.html
制作目的・背景
「安くて近い自動販売機で飲み物を買いたい」といった課題を解消するために開発した、自販機検索アプリコンセプトのサイトです。位置情報と商品情報を組み合わせることで、ユーザーが効率的に「ほしい飲み物を探せる」仕組みを意識しました。
ターゲット・ペルソナ
20〜40代の都心で働く会社員や学生/「出先で飲み物を買いたいけど、できれば安い自動販売機を見つけたい」
工夫したポイント・制作の過程
・距離による絞り込み（100m/300m/500m）も可能にし、現在地からの利便性を重視。
・視覚的にわかりやすいアイコンで商品の状態が一目で伝わる工夫をしました。
・見た目だけでなく、ユーザー行動に沿った機能をJavaScriptで実装。
担当範囲
企画・UI設計/デザイン/フロントエンド実装（HTML/CSS/JavaScript）/地図表示（Leaflet.js）やバッジ表示などのJS機能もすべて自分で担当しました。
使用ツール・期間などの補足情報
制作期間：約2週間（デザイン：2日、実装：10日、ブラッシュアップ：2日）
使用ツール・技術：Visual Studio
Code / HTML5 / CSS3 / JavaScript / Leaflet.js / レスポンシブ設計