LogoMark.png

木村天美/情報デザイン研究II のバックアップソース(No.5)

#author("2022-10-20T22:54:00+09:00;2022-10-05T15:06:13+09:00","default:member","member")
*FiND MUSiC
ジャケ写から出会う音楽サイト

  
 
 　　　　　　　MainVisual
 
  

-''Ami Kimura''
-'''Keywords：color, music, jacket'''
-http://findmusic.php.xdomain.jp/

~


**Overview
***What is this?
//&color(red){これは何か・・を簡潔に};
気になる色を選んで音楽を聴くサイト
~

***Background and Purpose
//&color(red){プロジェクトの背景と目的};
~

***Concept
//&color(red){基本的な考え方、枠組み、視点など};
従来の音楽ストリーミングサービスとは違う角度から音楽を探す機会を作り出す
~

***Outputs
//&color(red){&small(成果物の形式・サイズ・時間尺等);};
Webサイト
~

//***Member
//&color(red){共同プロジェクトの場合のみ｜メンバーと役割分担を明記};
//~

***Tools
//&color(red){使用するツール｜ハードウエア・ソフトウエア};
''__Hardware  __''
:|MacBook Pro
~

''__Software__''
:|WordPress
:|FileZilla
:|Spotify
:|Safari
:|Chrome
:|Firefox
:|Adobe X D

~
~

***Term
//&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX };
2022.09.21 - 2022.12.21
~

***Conclusion
//&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。};
~
~


**Research

***Current Situation
//&color(red){プロジェクトのテーマに関わる社会の現状と問題の洗い出し};
~

***Precedent
//&color(red){プロジェクトのテーマに該当する先行事例の紹介、傾向分析など};
:|[[Predominantly>https://predominant.ly]]
:|[[SANKOU!>https://sankoudesign.com/]]
~

***Technology
//&color(red){プロジェクトの遂行に必要な技法・技術に関する調査};
&color(#FFFFFF,#1DB954){　Spotify　};
:|[[Spotify 高度な検索の仕方>https://smatu.net/2017/06/25/spotify-advanced-search/]]
~

&color(#FFFFFF,#21759B){　WordPress　};
:|[[絞り込み機能 プラグイン>https://www.conoha.jp/lets-wp/wp-search/]]
:|[[PHPとJavaScriptで複合検索>https://lindsay.chunk.jp/wordpress_customize/composite-search01/]]
:|[[フィルタリング>https://www.webdesignleaves.com/pr/plugins/filtering-component-with-css.html]]
~
~

**Project Management

***Schedule
//&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。};
[[スケジュール表>https://docs.google.com/spreadsheets/d/1DuZOAJgwMOBYngfUxDgBP8rT7qaLOjeZ1EfADWUr7FE/edit?usp=sharing]]
~

***ToDo
//&color(red){やるべきこと（タスク）を箇条書きにします。};
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」};
%%-制作環境の整理%%
%%-スケジュール表作成%%
%%-ワイヤーフレーム 作成%%
-コーディング
-作品一次提出準備
-中間報告準備
-最終報告準備


~
~
~

#hr
CENTER:''WORK LOG''
//&color(red){List the most recent information at the top.};
#hr
~
~


**2022.10.19
***作業メモ
-Spotify API セットアップ
Node.js インストール
~
~

**2022.10.12
***作業メモ
-技術調査
[[SANKOU!>https://sankoudesign.com/]]
[[絞り込み機能>https://www.conoha.jp/lets-wp/wp-search/]]
[[PHPとJavaScriptで複合検索>https://lindsay.chunk.jp/wordpress_customize/composite-search01/]]
[[フィルタリング>https://www.webdesignleaves.com/pr/plugins/filtering-component-with-css.html]]
~

-サイト編集
動作確認
小テーマ設定
Spotify埋め込み確認
ヘッダー&フッター編集
~
~


**2022.10.05
***作業メモ
-[[ワイヤーフレーム 作成>https://drive.google.com/drive/folders/1afmFbGBkXWqM5tGqu8OZWM7tYcI6A75l?usp=sharing]]
~

''__Xfreeでサーバー取り直し__''
:|http://findmusic.php.xdomain.jp/
~

''__ToDo項目記入__''
:|制作環境の整理
:|スケジュール表作成
:|ワイヤーフレーム 作成
:|コーディング
:|作品一次提出準備
:|中間報告準備
:|最終報告準備
~

-ツール項目記入

''__Hardware__''
:|MacBook Pro

''__Software__''
:|WordPress
:|FileZilla
:|Spotify
:|Safari
:|Chrome
:|Firefox
:|Adobe X D
~
~


**2022.09.28
***作業メモ
-研究テーマ確定＞＞FiND MUSiC ジャケ写から出会う音楽サイト
-[[スケジュール表作成>https://docs.google.com/spreadsheets/d/1DuZOAJgwMOBYngfUxDgBP8rT7qaLOjeZ1EfADWUr7FE/edit?usp=sharing]]
-先行事例調査
--[[Predominantly>https://predominant.ly]]
~
~

***テーマ案
''__Web__''
-[[FiND MUSiC>木村天美/情報デザイン演習IIA]] リニューアル
:|色を選択するとその色のジャケ写が出てきて再生ボタンを押すと曲が聴けるような仕組みを作る
~
~


**2022.09.21
***作業メモ
-赤文字部分非表示
-テーマ設定のための調査
~
~

***テーマ案
''__Web__''
-[[FiND MUSiC>木村天美/情報デザイン演習IIA]] リニューアル
-美容院のサイト リニューアル
~

''__Graphic__''
-投票済証のデザイン
~
~

***参考
-[[Predominantly>https://predominant.ly]]
-[[好きな色を選ぶだけでその色のジャケット写真を探してくれるサイト | block.fm>https://block.fm/news/predominant]]
-[[兵庫県知事選挙の投票済証明書がポップでかわいいデザインになってた | さんだびより>https://www.sandabiyori.com/p32001/]]
~
~