概要
デジタルサイネージ向けの天気予報サイトです。
全国と各地区の代表都市の現在の天気と、都道府県内の代表6市町村の週間予報を表示します。
Points
テレビの天気予報を基準に、遠目でも直感的に把握できるデザインを意識して設計しています。 都道府県のSVGデータや天気アイコンには、視認性と精度を重視して品質の高い素材を採用し、 ライセンス表記を行ったうえで適切に使用しています。
外部APIへの過剰なアクセスを避けるため、OpenWeatherMap APIの呼び出しには Next.js の ISRを採用し、 リアルタイム性とコストのバランスを取っています。
デジタルサイネージ用途を前提に以下の点を重視しています。
- ・サイネージで表示したときの表示の見やすさ
- ・表示遅延を感じさせないスケルトンローディング
- ・スクロールやホバーによるナビゲーションの補助表示
- ・+αスマートフォンのニーズに先回りしたレスポンシブデザイン
Stacks
-
フロントエンド :
- Next.js、
- CSS(TailwindCSS、shadcn/ui)、
- 天気のアイコン(weather-icons by bas)、
- 都道府県SVG(japanese-prefectures)
-
バックエンド :
- Next.js、
- OpenWeatherMap(One Call API 3.0)
-
インフラ・その他 :
- Vercel










