福岡で笑おう!
福岡のお笑いライブの情報をまとめたWebメディアの制作
- 木村円香
- Keywords:comedy, Website
- 福岡で笑おう!(プロトタイプ)
概要
これは何?
福岡のお笑いライブに行ったことがない人向けに行き方や魅力を伝えるためのWebサイト
背景と目的
福岡では日常的にお笑いライブが開催されている。私自身、よく足を運んでおりお笑いライブを見ている時は笑うことに集中するため日常の煩わしいことを忘れることができる。笑うことは健康効果をもたらすことから、悩みの多い学生や新社会人にお笑いライブを観てたくさん笑ってほしいと思った。しかし、福岡でお笑いライブを観に行く人は少ないことがアンケート調査でわかった。また、「いつどこでやっていて、誰が出ているかわからない」という理由で足を運んだことがない人がいることもわかった。そこで、授業終わりや仕事終わり、週末に遊びに行く場所の候補としてお笑いライブに行く選択をしてもらうきっかけを作りたいと考えこの研究を行うことにした。また、社会人芸人のインタビューを掲載することで、福岡で活動する芸人さんに対して親近感を持ってもらい大手の劇場だけでなく福岡のお笑いライブ全体に興味を持ってもらうことを目指していきたい。
コンセプト
福岡のお笑いライブに足を運んでみて感じた「ワクワク感」とお笑い芸人の「かっこよさ」を感じられるWebサイトを制作する。シンプルな色使いでスタイリッシュなイメージを表現。また、アニメーションをつけることで視覚的に見ていて楽しいものにする。
成果物の仕様
- Webサイト(HTML)
- 劇場への行き方動画(YouTubeに掲載)
- インタビュー映像(YouTubeに掲載)
制作ツール
- Webサイト制作
- Figma
- Visual Studio Code
- Github
- チャットGPT
- インタビュー
- スマホ2台(撮影・録音)
- 三脚
- カメラ(写真撮影)
- Googleドキュメント(文字起こし)
- 質問カード
プロジェクトの期間
2025.04.11 - 2025.12.26
まとめ
現状
- プロトタイプの制作(終了)
- 社会人芸人へのインタビュー(3組終了)
今後
- Figmaでワイヤーフレームの制作
- チャットGPTを用いてコードに落とし込む
- 楽しさが伝わる人間味ある文章にブラッシュアップ
- インタビュー(あと3組に実施予定)
調査
現状調査
Instagramのフォロワーを中心にアンケート調査を行った
(回答者の78.1%が大学生、18.4%が社会人)
お笑いに興味のある人は63.2%と半数以上いる(1:はい・・・5:いいえ)
劇場に行ったことのない人は65.8%
福岡の劇場に行ったことのある人は17.8%にとどまっている
※ここでいう「劇場」とは吉本興業が運営する常設の劇場のことを指している。研究の目的としては吉本興業の劇場に限らずさまざまなライブに足を運んでもらうことであるが、日常的に通うとなると高い頻度でライブを行なっている常設の劇場に行くことが多くなるためよしもと福岡の劇場を中心に調査を行った。
以上の結果から、福岡の大学生、社会人はお笑いに対する関心度は高いが劇場に行ったことない人も多く存在すると言える。よって今回の研究では劇場に行ったことのない人に向けてアプローチしていきたい。
先行事例
- お笑いライブについての記事
お笑いライブのすゝめ
- 人間味のある文章=良いものだと伝えたい熱量を感じる
- 「すすめる理由」が始めにある=タイトルと伝えたい情報がマッチしている
お笑いライブの楽しみ方って?
- 東京でお笑いライブを見に行くのに必要な情報がまとまっている
- Webサイトの表現について参考にしたいサイト
ワラパー
- 記事を開いても常に両サイドに枠があって世界観を保っている
NIIリクルートサイト
- 動的でスタイリッシュ
- YouTubeの再生画面が表示されるまで2段階構成で世界観を損なわない
- カラフルだけど白背景で引き締まって見える
技法・技術情報
Webサイト
- Visual Studio Codeの中のAIを使って繰り返しの指定ができる
- メタタブにキーワードを盛り込んで「お笑い」以外について調べた人の検索結果にも出てくるようにする(福岡_イベント、福岡_観光 など)
プロジェクト管理
スケジュール
Notion
ToDo
「パッチワークパンダ」インタビュー
文字起こし
写真選定
イラスト
確認
- 公開
「ミチエダ」インタビュー
- 文字起こし
- 写真選定
- 確認
- 公開
「ケイソウ」インタビュー
- 文字起こし
- 写真選定
- 確認
- 公開
「田島将」インタビュー
- 文字起こし
- 写真選定
- 確認
- 公開
- 「PICKUP」の更新(適宜)
- 「ブログ」の更新(適宜)
- 「お笑いライブのいろは」の文章練り直し
- インタビュー映像(編集・公開)
- 劇場への道順動画(撮影・編集・公開)
- 概要集作成
- 卒展準備
ToDo Archive
- ダナブルーインタビュー
- サイトマップ
- ロゴの制作
- プロトタイプの制作
進捗記録
2025.06.20
相談メモ
- 「劇場に足を運んでもらう」ためにWebサイトはどんな雰囲気にするのか?
目指すイメージ
- お笑いライブの「ワクワク感」が伝わるもの
- ポップなイメージ
- スタイリッシュなイメージ
- 芸人さんに親近感を持ってもらう
- 「お笑いはテレビで見るもの」から「観に行きたい」にする
- アマチュアお笑いのアングラなイメージを払拭
イメージを実現させるためのアイデア調査
- 必要なパーツ
- PICKUPライブ:劇場みたいな枠
- お悩み解決動画:テレビみたいな枠
- 道順動画:矢印みたいな枠
- サンパチマイク
- メニューの文字をロゴっぽく
- 参考:「OYOGE」
- キャッチコピーが最初に出てくると目を惹く
- 線のみのイラストが控えめに動く
- 「#〇〇〇〇」でテーマを伝える
コンセプトの練り直し
- 気づいたこと
- 色の数もう少し増やす?寒色系だと楽しさ伝わりにくい?
- 緑色のロゴは「楽しさ」「ポップ」な印象与えにくい?
- 漫才=サンパチマイク/コント=暗転明転
- Webサイトのイメージ
- お笑いライブの「ライブ感」
- 次なにが起きるかわからない「ワクワク感」
- お笑い芸人のかっこよさ=スタイリッシュなイメージで伝える
- 見出しやタイトルは短くインパクトのあるものに(〇〇?/〇〇!)
- Webサイトで「ワクワク感」を表現するにはどんな方法があるか
- 動きをつける
- 「ケラケラ」「ワハハ」笑っているような動き
新コンセプト:福岡のお笑いライブに足を運んでみて感じた「ワクワク感」とお笑い芸人の「かっこよさ」を感じられるWebサイトを制作する。シンプルな色使いでスタイリッシュなイメージを表現。また、アニメーションをつけることで視覚的に見ていて楽しいものにする。
2025.06.13
作業記録
- インタビュー
- 「田島将」
- 「ケイソウ」
- 「ミチエダ」インタビュー文字起こし
- ワイヤーフレームの作成
- ワイヤーフレームをチャットGPTに画像で送ってコードにする
- グレーボックスのワイヤーフレームから少しデザインを加えた
- ハンバーガーメニュー(画像から勝手に機能をつけてくれた)
- スマホ版とPC版のレスポンシブ対応するコードを書いてもらった
相談記録
- 劇場への道順動画の制作について:福岡よしもと劇場の道順動画はある。(こちら)甘棠館Show劇場とライブハウス秘密は道順動画無さそう。
2025.06.06
作業記録
- 動画の掲載方法のメモ
スクロールした画面上にすぐYouTubeのリンクが現れる形ではなく、Webサイトの世界観に馴染む表示から再生ボタンを押して初めてYouTubeの再生画面が出てくるようにしたい(技術的にどうしたら実現できるか相談する)
こんなイメージ
- 「ミチエダ」インタビュー文字起こし
2025.05.30
作業記録
- メインビジュアルのコンセプト
- 「福岡で笑おう!」というタイトルから笑っている様子が伝わるものにした
- お笑いの効能や社会的役割は「健康」であると考えてSDGsの目標である「すべての人に健康と福祉を」のカラーを選定した(#4c9f38)
2025.05.23
作業記録
- サイトマップ修正
- 「ケイソウ」インタビューアポ取り
- 「田島さん」インタビューアポ取り
2025.05.16
作業記録
- 「背景と目的」「コンセプト」練り直し
- パッチワークパンダ写真選定
→イラスト依頼
- 「PICK UP」更新
2025.05.09
相談記録
- 目的・調査・コンセプトに一貫性
- 足を運んでもらうためにどのように楽しさを伝えるのかをコンセプトに盛り込む
- プロトタイプからHTMLに作り替える時の変更点は?
- Googleサイトではできないレイアウトに配置する
ex.インタビュー記事のページで話者の写真アイコンから吹き出しが出てチャットで会話をしているようなデザインにすることで芸人さん同士の掛け合いを視覚的に感じられるものにする
作業記録
2025.05.02
相談記録
- 前期と後期の成果物
- 前期:ワイヤーフレーム(Figma)
ワイヤーフレームの画像からチャットGPTを用いてコードを生成するなら、試してみて可能であることまでわかった状態で前期の最終発表で述べる
- Webサイトをどのように拡散するか
- SEO対策について調べてみる
- メタタブにキーワードを盛り込んで「お笑い」以外について調べた人の検索結果にも出てくるようにする(ストレス解消、福岡_イベント、福岡_観光 など)
作業記録
調査
Webサイトでどのような表現ができるかの調査を行なった
サイトマップ
2025.04.25
作業記録
2025.04.18
作業記録
2025.04.11
相談記録
- HTMLはビジュアルの表現方法が自由自在だけど記事の更新が大変
- Visual Studio Codeの中のAIを使って繰り返しの指定ができる
作業記録