制作記事 運用情報お仕事・制作日記SONY 一眼ミラーレスカメラを一覧にしてみた

SONY 一眼ミラーレスカメラを一覧にしてみた

まずは、成果物。
SONY α 一眼ミラーレスカメラ

なぜ作ったのか?

α7 IV の発表は待望していただけに嬉しい。でもそれと同時に気になる販売価格を知って、予想はしてたけど、なんだろう、個人的には手の届かないところに行ってしまった感は否めない。
この感覚はいつからどう感じるようになったのだろう。
現状の市場価格での購入は諦めるとして、自分軸の価格はいくらが妥当なのか見極めるために、このコンテンツを作ることにした。

何を作ったのか?

  • いつ販売されたのか
  • 初値の価格はいくらか
  • 最安値はいくらか

型落ちすれば、安くなるのは市場の原理だが、そのときの価格はいくらかは気になるポイント。

こだわったこと

  • シリーズごとの年表を用意する
  • シリーズごとに絞り込みできるようにする

年月を等間隔にすることで、視覚的にいつどんなカメラが発売されたのか分かりやすい。
また、シリーズごとに絞り込むことで、進化と価格の関連が分かりやすい。

どうやって作ったか?

全体としては、2日で実稼働は10時間ほどで仕上げることができた(仕様は以前に対応したことがあり、実装方法を調査する手間がなかったのと、デザインを最低限にしたことが影響している)。

企画

  1. どんな情報を表示するか考える(モデル名、発売日、初値、最安値など)
  2. 情報の優先度を考える
  3. 全体のラフスケッチを手書きで考える
  4. スマホでの閲覧も考慮する

この手書きは我ながらヒドい(笑)。もちろんこれは個人的なコンテンツで、誰かに説明する必要がない完全自分用。

でも、このラフスケッチがあるかないかでは全然違う。こんなのでもデザインの指南役となる。
作りながらあーだこーだと別案が生まれてしまうのだが、その迷いを払拭できるのだ。ちなみに、その迷いは2パターンに大別できる。何を見せたいかとその優先度がブレてしまう、もしくはこれがなければダメだという思い込みからの要件足し。これらは踏み込んでは決していけない領域。それでも踏み込むなら、企画からやり直すべき。

情報収集

  1. カメラを選定する(フルサイズのみかAPS-Cも含めるか、NEXシリーズも含めるか)
  2. カメラごとに取得するデータを決定する
  3. 価格コムの情報を取得する

* Googleスプレッドシートに情報を記載する

デザイン・コーディング

  1. Googleスプレッドシートの情報を取得して、jsonファイルを作成する
  2. 全体をコーディングする
  3. データを当て込みながら、レイアウト調整する
  4. 絞り込み検索を実装する
    絞り込み用Formはハードコーディングで手抜き(苦笑)。言い訳としては、検索用の値は用意してたけど、ラベル名をAPIに含めていなかったので、対応表を用意するなら、今回はハードコーディングで済ましてしまうという選択。
  5. データを読み込むまで、ローディング表示する
  6. 微調整して仕上げる

というわけで、完成したコンテンツはこちら。
SONY α 一眼ミラーレスカメラ

実装を見送ったこと

  • 個人的に気になってるカメラの性能の比較(公式サイトや価格コムで比較する)
  • Formエリアの開閉仕様(常時画面下に表示する)