あともーしょん
ASMRというコンテンツを気軽に体験できる音声を用いたWEBサイト
- 田代爽乃
- Keywords：website , asmr , motion , sound
- あともーしょん
概要
これは何？
ASMRというコンテンツを気軽に体験できる音声を用いたWEBサイト
背景と目的
近年YouTubeなどの媒体を中心にASMRというコンテンツが流行している。比較的新しいコンテンツの為、化学的な研究が十分に進んでいないことや、一部の人々が性的な要素などを混合していることから誤解や偏見が生じている。
この状況を改善するために、初めてASMRというコンテンツに触れる人が気軽にASMRを体験する方法がないかと考えた。
コンセプト
初めてASMRを体験する人をターゲットに、キャラクターを取り入れ、動かすことで親しみやすく、視覚的にも聴覚的にも楽しめるサイトを作成する。
成果物の仕様
サイト
- 合計9つのGIFと音声を制作
- コーヒーを淹れる音
- 筆記音
- タイピング音
- パソコンのクリック音
- スライムで遊ぶ音
- ボールで遊ぶ音
- お化粧する音
- 電気のスイッチの音
- ページをめくる音
サイトのワイヤーフレーム
 |  |
サイトのアパート部分ラフ・配色
 |
GIF
 |  |
制作ツール
- Adobe Illustrator 2024
- Adobe Photoshop 2024
- Procreate
プロジェクトの期間
プロジェクトの期間｜2024.04.12 - 2024.12.20
調査
現状調査
- 主にYouTubeなどの動画配信プラットフォームに投稿・配信されている
- 比較的新しいコンテンツの為、誤解や偏見が存在している
- ASMRの効果や意義について科学的な研究がまだ十分に進んでいない
- 一部の人々がASMRを性的なものと混同している
先行事例
技法・技術情報
- OpenSquareJP
- ASMRの撮り方を紹介！ASMRの録音・配信・撮影方法やおすすめ機材を紹介
- 【徹底比較】ASMR用マイクおすすめ18選！(動画付き)with きつねASMR
- ASMR用マイクのおすすめ15選。人気メーカーの製品もラインナップ
- 1冊ですべて身につくHTML＆CSSとWEBデザイン入門講座(参考書)
- 1冊ですべて身につくHTML＆CSSとWEBデザイン実践講座(参考書)
プロジェクト管理
スケジュール
ToDo
テーマ決定調査サイトのワイヤーフレームキャラクターのラフ試作- GIF制作
- 録音
まとめ
中間発表から、どのような音を使ってGIFを制作するのかを考えるのにかなり時間を使った。最終的にサイト自体をアパートのようにしてアパートの住人の生活音という体で制作するGIFと音声を決定することができた。
マイクで音を録音してみて、音が小さいのと、イヤホンで聴いた時に迫力がないと感じたので、マイクを変更してみたり、音の出やすい工夫をして録音していきたい。
進捗記録
2024.07.19
マイクについての調査
マイクの種類
- ダイナミックマイク
- コンデンサーマイク
低域から広域までバランスの取れたサウンド、振動やノイズを拾いやすく単一指向性の場合が多い
ASMRに使用されるのはほとんどがコンデンサーマイク
全方向性と単一指向性の違い
マイクによって切り替えられるものがある
- 全方向性(無指向性)
マイクの周辺で発生した音を全て収録
空間を伝えることに適し、雰囲気や臨場感を収録したい際におすすめ
※周辺部の環境音を全て拾うため不要な音が入りやすい - 単一指向性
特定の角度から入った音を収録できる
全方向性マイク(無指向性マイク)に比べ不要な音が入りにくい
ノイズを抑えた収録をしたい場合におすすめ
※マイクから収録できる範囲が限られている
ASMRにおすすめなコンデンサーマイクの種類
- ガンマイク
- イヤホン型マイク
- ハンディレコーダー
- ダミーヘッドマイク
参考
2024.07.12
サイトの編集
マイクでの録音
- ボールで遊ぶ音
- スライムで遊ぶ音
サイトに使用するGIFの制作
発表メモ
- スケジュールの再考(もっと具体的に)
- マイク、編集ツールについての知識(どんなマイクか説明できるように)
- 動きを止めるのは難しいから、押したら別のサイトに飛んで流れるようにしてみては
- 研究の名前の由来
- イコライザーの知識を
- 心地いい音なのかもう一度考えてみる(電気のクリック音など)その定義
- キャラクターについての説明
2024.07.05
GIF内容決定
- コーヒーを淹れる音
- 筆記音
- タイピング音
- パソコンのクリック音
- スライムで遊ぶ音
- ボールで遊ぶ音
- お化粧する音
- 電気のスイッチの音
- ページをめくる音
GIFの案だし
- アパートの住人の生活音
- 料理を作る音
- コーヒーを淹れる音
- 筆記音
- タイピング音
- パソコンのクリック音
- スライムで遊ぶ音
- ボールで遊ぶ音
- おしゃれする音
- お化粧する音
- 電気のスイッチの音
- 窓拭きの音
- 炭酸ジュースを開ける音
- ページをめくる音
ワイヤーフレームの修正
- メニューを無くし、メインビジュアルにサイトについての説明を加えることにした
サイトのプロトタイプ制作
2024.06.21
相談メモ
- 使用する音の案
- バイノーラル録音ができるか > アパートの中で聞こえても違和感のない音 >...という限定していく分け方をする
- とりあえずマイクで音声を録音してみる
- プロトタイプまで制作(サイト全体の大きな構成、 押したら録音した音がなる)
- ジャンル分けしなくてもいいのでは?
2024.06.14
サイトのアパート部分ラフ・配色
2024.06.07
録音する音声の案出し
- バイノーラル録音ができる音声
- 苦手な人の多い囁きや、咀嚼音は加えない
2024.05.31
中間発表メモ
- 録音する音声の案出し・ジャンル分け
- バイノーラルとASMRどちらも使ったら分かりにくい
- GIFと音声を流し続けるのかを決める
2024.05.24
サイトのワイヤーフレーム
#image(): File not found: "wireframe.jpg" at page "田代爽乃/卒業研究"
試作
https://sayatuu.github.io/sotuten_shisaku1/
2024.05.17
サイトに使用するキャラクターのラフ
- 誰にでも親しみやすいキャラクター(シンプルに)
- ASMRに関連する物、モチーフを取り入れてみる
サイトに使用するGIFの試作
- どのくらいの長さのGIFにするか考える
- 何枚のイラストが必要か
2024.05.10
今週のToDo
- サイトの全体的なイメージ案(ラフ)の制作
- 試作制作
- JavaScriptの勉強
ASMRコンテンツの課題
- 比較的新しいコンテンツの為、誤解や偏見が存在している
- ASMRの効果や意義について科学的な研究がまだ十分に進んでいない
- 一部の人々がASMRを性的なものと混同している
先行事例2
- OpenSquareJP
- 猪本結衣/情報デザイン研究II
- 猪本結衣/卒業研究I
- 猪本結衣/卒業研究II-
- KETAKUMA Official | けたくま公式
- さっと ASMR
- 空想金融教室
- BRUTUS
2024.04.26
テーマの決定
ASMRというコンテンツを気軽に体験できる音声を用いたWEBサイト
試作
試作：画像を押すと音の鳴るサイト
使用した音源：効果音ラボ
2024.04.19
テーマ候補1
- WEBサイトにバイノーラル音声を使用することは可能か？
→使用できる形式だと可能 - WEBサイトに音声を載せることで音質は下がるのか？
→音質は変わらない - 1つ1つ出来るかの実験が必要
- レコーダー一体型マイクで録音するかコンデンサーマイクを使用するか
- Can I use
テーマ候補2
- キュートアグレッションを起こせるような可愛さの研究が必要
- WEBサイト(押したら変化する)
2024.04.12
テーマ候補1
- バイノーラル音声を用いたWebサイトの制作
先行事例
- ASMRの撮り方を紹介！ASMRの録音・配信・撮影方法やおすすめ機材を紹介
- OpenSquareJP
- KETAKUMA Official | けたくま公式
- ASMR motion
- さっと ASMR
- 【安い機材はどれ？】ASMR用マイクのおすすめ人気ランキング10選【バイノーラルマイクとは】
- 深江沙羅/卒業研究I
- 猪本結衣/卒業研究I
テーマ候補2
- キュートアグレッションをイラストで表現して、そのぬいぐるみやスクイーズを制作する
先行事例
- 可愛いと潰して破壊したくなる！？キュートアグレッションとは一体何なのか
- 原田朋奈/情報デザイン研究II
- すもも🍑 スクイーズ🍑 人肌のゲルでぷにぷにもちもち💛 作り方🍑 How to make squeeze💛 DIY
テーマ候補3
- 色んな猫の体の匂いをまとめたサイト
先行事例
- 猫からいい匂いがするのはなぜ？理由や匂いの違いも解説
- 猫を飼っている人にインタビューをする
- 猫カフェの店員さんに聞いてみる
- 牛の肉の部位みたいなイラストの匂いver
wireframe2.png
wireframe1.png
slime.GIF
ball.GIF
raf.JPG
mainvisual1.JPG
character1.JPG
