YKUCMR.COM

TEKUBI HIKARU

Apple Watchをペンライトとして使用できるようにするWebアプリ

概要

Apple Watchをペンライトとして使用できるようにするWebアプリです。
(Apple Watchでの表示に最適化しています。)

担当

  • 企画 / 構成
  • 情報設計
  • デザイン
  • マークアップ / アニメーション実装

制作背景

声優アーティスト(ラブライブシリーズ・アイマスシリーズなど)のライブに行くことが好きなのですが、自分も含めて多くの客はペンライトやサイリウム(以下、光り物)を持ち込み、演出などに合わせて、色を変えたりペンライトの振り方を変えたりするなどしてライブを楽しみます。
自分が参加するライブでの光り物は棒状のものが基本形態となっていますが、男性アイドルなどのライブでは棒状のもの以外にも、ウェアラブルな形態やBluetooth連動のものなど多種多様な光り物が存在しているようです。
個人的に今後は時代の流れからしても「ウェアラブルデバイス(Apple Watchなど) + アプリ」という、自身が所有している端末からアプリやサービスを操作することで端末を光り物として使用する形態が少しずつ増えていくのではと考察しています。しかし、現状では類似のサービスやアプリは見当たらなかったので、それなら先ずは自分自身で作ってみようと思い、簡単に公開まで至れるWebアプリとして制作することにしました。

制作目的

  • ライブで実際に使用する用途ではなく、ウェアラブルデバイス + アプリ型の光り物の可能性を探る

情報設計

  • 最低限の内容で素早く公開する事を最優先としたので、自分が頻繁に行くアーティストのライブで使用する配色を最初から設定

デザイン

  • 情報設計の段階でデザインツールでのカンプ作成は不要と判断したため、実装しながら細部を調整する流れでデザインを作成

実装

  • TwitterなどのWeb制作界隈で話題になっていたAstroを使用(Twitterで爆発的に認知が広がる前からキャッチアップをして使用した)
  • 色を切り替える部分は、実務でも使い慣れていたSwiperというスライダーを作成するためのライブラリを用いて実装

反省点 / 今後の課題

  • ユーザー側で配色を指定できるようにしたい
  • 光り物として使用するには常時点灯が必須のため、常時点灯に対応したApple Watchを用意する必要がある
技術スタック
Astro, Netlify