梁井英翔/卒業研究

Visual to Music

耳で聞いて、目で楽しめるアートワークの提案

• 梁井 英翔
• Keywords：音楽制作, AI, グラフィック,

概要

これは何？

• ビジュアルをもとに、複数のAI音楽生成モデルで生み出される音楽を比較できるWebサイト

背景

• 映像やグラフィックを学ぶ学生にとって、音楽制作は専門外であり、DAWソフトや音楽理論の知識が必要という印象から、手が出しにくい分野と感じられてきました。しかし、近年のAI技術の進化により、音楽制作のプロセスが直感的かつ視覚的な発想からも可能になりつつあります。

• 私自身も授業でDAWソフトを触れる中で「音楽はもっと自由でいい」と気づき、テクノロジーによって表現のハードルが下がる体験を共有できればと思い。この体験を出発点に、「映像やビジュアルから音楽が生まれる」ことを感じられればと考えました。
  
  

目的

• このWebサイトは、視覚的な素材をもとに、複数のAI音楽生成モデルで音楽を生成・比較することで、「音楽制作への入門やAIの進化」という体験を提供します。
  • 音楽に触れたことのない人でも、感覚的に制作プロセスを楽しめる

• 異なるAIモデルの出力を比較することで、多様性や可能性を理解できる(好みを知れる)

• 視覚から音楽へという新しい創作アプローチを発見できる
  
  

コンセプト

• 視覚情報を音楽に変え、聴き比べが体験ができるWebサイト
• AI等の技術に注目される展示
  
  

成果物の仕様

• Webサイト（ビジュアル8案）
  
  

メンバー

制作ツール

• illustrator
• Photoshop
• html
• figma
  
  

プロジェクトの期間

まとめ

• Webサイトでより楽しめるデザイン（アニメーションや演出）を考える必要がある。
  
  
  
  

調査

現状調査

• SOZO美術館
  • 音楽×AIを推進しているアートワークプロジェクト　
• フコウエアラタ
• 全編AIを使った映像作品
• パルコの広告制作
  • パルコをはじめとした大手企業の広告AI活用事例

先行事例

• Kórsafn
  • 気象情報をもとにAIで曲を制作
• Sihwa Park「YouTube Mirror」
  • リアルタイムで画像や音楽を生成するパフォーマンス
    
    

技法・技術情報

プロジェクト管理

スケジュール

ガントチャート

ToDo

2025.06.06

• figmaデザイン制作
• Wordpress
  
  
  
  

2025.05.30

• Web基礎構築
  
  
  
  

2025.05.23

視覚的要素による差別化の視点一覧
1. 色（Color）
色相（暖色／寒色、単色／多色）
彩度（鮮やか／くすみ）
明度（明るい／暗い）
色数（モノクロ／フルカラー／2色構成など）

2. サイズ・形状（Size / Shape）
要素の大きさ（小さなモチーフ／大きな塊）
面積の比率（空白 vs 図形）
形の鋭さ or 丸み（エッジの強さ）
対称／非対称性

3. 構成・レイアウト（Composition）
中央／左右／上下の配置
密度（スカスカ／密集）
バランス（安定／不安定）
視線誘導（動きの流れがあるか）

4. テクスチャ・質感（Texture）
手描き風／デジタル／写真風
なめらか／ザラザラ／ノイズあり
立体感の強弱（シャドウやハイライトの使い方）

5. エフェクト（Effect）
グリッチ、ブラー、発光、フィルターなどの加工
特殊効果（ノイズ、ハレーション、RGB分離など）

6. 文字の有無・書体（Typography）
テキストの有無（文字がある／ない）
文字の内容（抽象語／具体語）
フォントの種類（明朝／ゴシック／手書き風など）
文字の強調度（太字／斜体／装飾）

7. テーマ・意味性（Semantic content）
顔や人物の有無
自然／人工物
抽象画／具象画
感情を誘発するかどうか（例：悲しそうな顔 vs 笑顔）

8. 文化的／記号的意味
特定文化や時代を想起させるモチーフ（例：浮世絵、サイバーパンク）
宗教・政治的象徴の有無

2025.05.16

ワイヤーフレームPC

ワイヤーフレーム(Smartphone)

2025.05.09

試作はこちら

例:3.image-to-music-v2使用例

2025.05.02

• 1. Mubert AI (Image to Musicモードあり)
  • 内容：画像の内容やタグからBGMを生成
  • 商標不可　個人利用可能
  • 制限：無料アカウントでは一部機能制限。ログイン必須。

URL：https://mubert.com

• 2. Melobytes (Image to Song)
  • 内容：画像から音楽（またはボーカル付きの歌）を作る
  • 商標不可　個人利用可能
    URL：[https://melobytes.com](https://melobytes.com/en/app/image2song/](https://melobytes.com/en/app/image2song/)

• 3.image-to-music-v2
  • 内容：画像イメージから音楽を制作可能
  • 商標不可　個人利用可能
    URL 　:　https://huggingface.co/spaces/fffiloni/image-to-music-v2

• 4.TopMedia
  • 内容：画像の特性に合わせて音楽スタイルを選択可能。
  • 商標利用可能
    URL；https://jp.topmediai.com/ai-music/generate-music-from-image/

2025.04.25

• テーマ決定
  • ビジュアルからAIで音楽を生成し聴き比べできるアートワーク
• Webサイトにまとめ掲載

使うかもしれない技術

• Firebase
• Daisy Chain Studio>https://www.daisychainstudio.net/

2025.04.18

テーマの有力候補

• 声の波形を使ったデザイン
• 波形
  • 声を録音 → 波形を生成 → グラフィック素材にする
  • 聴覚は記憶に残りにくい→波形にして視覚化
  • アプリで声を集める→波形ギャラリー
• 作業工程表
  • 声を地図データのようなグラフィックに置き換える
  • 波形の色や形状で感情を表現
    
    
    
    

2025.04.11

テーマ案

• 視力が低い人が認知できるデザインの研究
• 心拍数や瞬きなどの身体から得る情報からノイズを生む
• 年齢によって感じる時間の流れの感じ方
• ゲーム内で学内ハザードマップのリアル体験
• 柄、材質に着目した触覚と視覚を感じれるアートワーク
• 声の波形を使ったデザイン
  
  

調査

• 音声波形
  • WaveVisual
• ゲーム×ハザードマップ
  • フォートナイトクリエイティブ
• メモ
  • 自分の声を「山脈」にして地形を生成。あるいは、都市の騒音データを地図に反映