木村天美/情報デザイン演習IIA

FiND MUSiC

CDジャケットから出会う音楽サイト

• 木村 天美
• Keywords：青, CDジャケット, アートワーク, 音楽
• http://artworkmusic.starfree.jp/

Overview

Introduction / What is This

CDジャケットから出会う音楽

Background and Purpose

近年、サブスクリプションの音楽ストリーミング配信が普及し、CDショップに行かなくても、スマホなどでいつでもどこでも手軽に音楽が聴けるようになった。それに伴い、CDの売り上げは年々下がってきている。CDジャケットから選んで聴く音楽から、アーティストやジャンルなどを選んで聴く音楽へと移り変わっているこの時代に、CDジャケットの魅力を知ってもらえたらと思い、このプロジェクトを企画した。

Concept

サイト上にSpotifyの埋め込みを並べ、気になったCDジャケットの再生ボタンをクリックすると試聴ができる。（※Spotifyのユーザーはフル再生可能）

Output

• Webサイト：FiND MUSiC
• URL：http://artworkmusic.starfree.jp/
  
  

Tools

• ハードウエア
  • MacBook Pro

• ソフトウエア
  • Chrome
  • Firefox
  • Safari
  • Spotify
  • WordPress
  • StarServerfree
  • FileZilla
  • Adobe X D
    
    

Term

2021.04.12 - 2021.07.19

Conclusion / Summary

頭に思い描いたとおりにWebサイトを仕上げることができた。このサイトを通して、ジャケット写真を目にするきっかけが作れたらよいと考える。

Survey

現状調査１ テーマ内容の先行事例

• predominant.ly
  
  

現状調査２ 表現形式の先行事例

• もしもアフィリエイトでの「商品リンク」の作成方法
• 音楽の共有に便利な、ホームページやブログにSpotifyの埋め込みをする方法
  
  

現状調査３｜時間軸（対象の歴史的知見）

• ディスクジャケットとは
• サブスク音楽配信サービスとは
  
  

現状調査４｜空間軸（対象の地理的知見）

• CDジャケットのサイズ
• CD・メディアの大きさ一覧
• CDジャケットに記載すべきマークや規定文について
  
  

現状調査５｜技法

• GitHubの使い方
  
  

Project Management

Schedule

-進行管理表

ToDo

-青色系のCDジャケットを探す
-掲載する曲数を増やす
-Webサイトの構成を整える

2021.07.12

今週の取り組み

• 成果発表を行った
  
  

アドバイス

• ジャンル分けしてみるとよいかもしれない
  
  

今後の課題

• 時間に余裕があれば、ジャンル分けをしてみる
  
  
  
  

2021.07.06

制作物の現状

• PLAY LISTは計4ページ
• 掲載楽曲数 160曲
  
  

今週の取り組み

• 青色のジャケ写を探してSpotifyのプレイリストに追加した
• Webサイトに掲載する曲を増やした
  
  

今後の課題

なし

2021.06.28

制作物の現状

• PLAY LISTが4ページ目に突入した
• 6/28時点での掲載楽曲数 124曲
  
  

今週の取り組み

• 青色のジャケ写を探してSpotifyのプレイリストに追加した
• Webサイトに掲載する曲を増やした
• 曲を掲載するページを増やした
  
  

今後の課題

• 掲載する曲数を増やす
• 青色のジャケ写を探してSpotifyのプレイリストに追加する
  
  
  
  

2021.06.21

制作物の現状

• 現在の体裁を保ちつつ、曲数を増やしている
• PLAY LIST 1ページにつき、40曲掲載するようにする
  
  

今週の取り組み

• 青色のジャケ写を探してSpotifyのプレイリストに追加した
• PLAY LISTページの右下にprevボタンとnextボタンを追加した
• Webサイトに掲載する曲を増やした
• 曲を掲載するページを増やした
  
  

今後の課題

• 掲載する曲数を増やす
• 青色のジャケ写を探してSpotifyのプレイリストに追加する
  
  
  
  

2021.06.14

制作物の現状

• PLAY LISTの曲並びを3カラムから4カラムに変更して曲を増やした
  
  

今週の取り組み

• 青色のジャケ写を探してSpotifyのプレイリストに追加した
• Webサイトに掲載する曲数を増やした
• 曲の並びを変更した
  
  

今後の課題

• 掲載する曲数を増やす
• 青色のジャケ写を探してSpotifyのプレイリストに追加する
  
  
  
  

2021.06.07

制作物の現状

• Webサイトは現在の体裁を保ちつつ、曲数を増やしている状況
  
  

今週の取り組み

• 青色のジャケ写を探してSpotifyのプレイリストに追加した
• Webサイトに掲載する曲数を増やした
  
  

今後の課題

• 掲載する曲数を増やす
  
  
  
  

2021.05.31

指摘された問題点

• 曲の種類を増やす
  
  

好評価を得た点

• Webサイトの完成度が高い
• 情報が綺麗にまとまっていて見やすい
  
  

その他

• 別ジャンルのジャケットが気になる
• 聞いたことがない音楽が気軽に再生できる
  
  
  
  

2021.05.17

Webプレゼンテーション

• プレゼンスライド
• FiND MUSiC ← サイトのリンク
• プロトタイプ評価シート　皆様コメントありがとうございました。
  
  
  
  

2021.05.10

今回制作したプロトタイプ

サイトのワイヤーフレーム


http://artworkmusic.starfree.jp
サーバーの動作確認 (プロトタイプサイト)

プロトタイプ制作の方法

• Adobe X Dにより、ワイヤーフレームを制作
• WordPressのテンプレートを利用
  
  
  
  

2020.04.26

アイデアの量産 ＞ 絞り込み

Webの公開方法

• GitHubPages？WordPress.comサービス？
  
  

Webの形式（分量とサイズ）

• マルチデバイスに対応させる？
  (レスポンシブサイト)
• PCベース？スマホベース？
  
  

Webの内容（素材ネタ）

• Spotifyの埋め込み
• CDジャケットの制作者情報
• アーティスト情報
• 楽曲情報
  
  

Webのネーミング

• Music To Find from CD Jackets 長すぎる？
• meet MUSiC
• FiND MUSiC
  
  

Webの構成

• Spotifyの埋め込みを並べる
  
  

Webの制作環境と方法

• HTML+CSS? WordPress?
  
  
  
  

2020.04.19

テーマ・概要に関する作業の報告

• タイトル：CDジャケットから出会う音楽
• テーマ採択の背景：アーティストの想いが詰まったCDジャケットの魅力を伝えたいと考える。

調査報告

• CDジャケットの画像は著作権を持っている人の承諾なしに掲載することは著作権法に違反する
• 一般社団法人 日本レコード協会 音楽利用について　Q&A集 インターネット編
  
  
  
  

2021.04.12

プロジェクトのテーマ候補

• 神社紹介
• 金魚の日常
• 選挙とは何か
• "青系"のCDジャケットから見つける音楽

参考リンク

• “選挙”ってなに？〔NHK選挙WEBより〕
• CDジャケット(水色)
• CDジャケット(青)