色で音を奏でるアプリ「Color Sound」

OVERVIEW

3年前期に行われる「3年プロジェクト」という授業で作成したアプリケーションです。「コンピュータと音楽」というテーマから作成しました。

YEAR 2018

概要

「コンピュータと音楽」というテーマの中で、絵を描き、絵の色に応じた音を流すアプリケーションを作成しました。公開はしていませんが、iPhoneXで動作することを確認しています。

制作期間:6ヶ月(2018年4月〜2018年9月)

制作人数:1人


目的

主目的は「幼児に気軽に音楽を楽しんでもらうこと」ですが、高齢者の認知症予防としても利用できるのではないかと考えています。


開発環境

  • Monaca
    • JavaScript
    • HTML5


詳細

想定する利用者が幼児や高齢者のため、機能はシンプルにしています。


  • 描画機能

Canvas, touchmoveを使用して実装しました。使用できる色は背景の白を含めた8色で、線の太さは細・中・太の 3 種類 から選べるようになっています。また、消しゴムや一括削除の機能も実装しました。


  • 演奏機能

audio, getImageDataを使用して実装しました。キャンバスをタップした際に色を取得し、その色と対応した音を流します。流す音はピアノ・ギター・ドラムの3種類から選択できます。ピアノは音階、ギターは弾き方、ドラムは各部位の音が色と対応付けられています。


  • 画面

初期の線の色は「黒」、線の太さは「細」になっています。