3119057 松山竜也
青森大学 ソフトウェア情報学部４年

1 . はじめに （研究の背景,動機,目的）
2 . 具体的な内容（開発環境,制作内容）
3 . 利用アンケートの集計
4 . 考察 （成果,改善点）
5 . まとめ
実際に作成したWebページのQRコード

•
鑑賞
演奏
作曲
[図] 音楽の三方面
（引用：音楽の定義 - 音楽の三方面）

•
図 ヤマハ音楽教室

•
⾳楽の知識を⽂字,画像,⾳声ファイルを⽤いて解説。
「⾒て・聞いて・楽しめる⾳楽学習サイト」を制作。

・⽂字が多くて理解しづらい
・文字の色を変えておらず
見づらい
・画像が少ない

•
•

使用PC： Apple 製 MacBook pro
使用コードエディタ： Visual Studio Code
画像,図,グラフ作成ソフト
：Numbers , PowerPoint
使用言語： HTML,CSS,JavaScript

図 ︓ HTML内のコード 図 ： CSS内のコード

図： 構想段階のイメージ
・ 全部で4ページ構成。
①トップページ
②⾳楽基礎編ページ
③⾳楽チャレンジ編（練習問題）
④アンケートページ
・ シンプルかつ⾒やすさを重視。

① トップページ 完成図 ② ⾳楽基礎編ページ 完成図

③ ⾳楽チャレンジ編ページ 完成図 ④アンケートページ 完成図

・ アンケート⽅法
▶ Google Forms
▶ 対象者 ⻘森⼤学に通う学⽣,知⼈
SNSも活用し外部の方へお願い
▶ 調査期間 令和5年1⽉16⽇〜21⽇

・

・

・

・ 成果
① 「音符の種類」や「楽譜の読み方」など楽しく学べるサイト
② 画像や⾳声データを⽤いて⾒て聴いて学べるサイトの実現
③ Webサイト全体の⾒やすさに対する評価

・ 問題点・解決策
▶ ⽂字の読みづらい
▶ 画像が⾒づらい
▶ 不適切な改⾏が多い
レスポンシブデザイン（スマホサイズ）を意識して作成

・ 「文字を読む」「画像を見る」「音声データを聴く」
音楽学習サイトの制作
・ 基礎編ページで学び、練習問題（クイズ）を解いて復習し
分かりやすく見やすいサイトの実現
・ アンケート結果 ➡ 内容を理解した利⽤者・・・多い
学習意欲が上がった・・・多い

ご清聴ありがとうございました

質問１ Webサイトを閲覧した環境は以下のどれですか？
質問２ Webサイトを利用した方の性別を教えてください
質問３ Webサイトを利用した方の年齢を教えてください
質問４ 音楽を最後に学んだのはいつ頃ですか？（授業で習ったことも学んだことに含む。）
質問５ （学んだことがある と答えた方）具体的に何を学んだことがあるか覚えている範囲で構いませんので教えてください
質問６ Webサイトを利用して良かった点として当てはまるものを選んでください（複数選択◯）
質問７ 具体的に良かったところ,またはその理由を記入してください
（質問６の回答項目以外にもあった場合の記入◯）
質問８ Webサイトを利用して理解できた・分かりやすかった項目を選んでください（複数選択◯）
質問９ このサイトを通じて音楽についての理解度はどれくらい
ですか？
質問１０ このサイトを利用して音楽についてもっと学びたい（学習意欲）と思いましたか？
質問１１ よくなかった部分や改善点などあれば記入してください