Ameba Ownd

アプリで簡単、無料ホームページ作成

劇団木霊

優しいWEBと優しくないブログ/『トランス』

2020.09.20 10:00

こんにちは。

劇団木霊67期、鏡原すずです。本公演『トランス』ではWEBを作るなどしています。

今回はWEBというセクションについてお話ししたいと思います。おそらく長くなってしまうのですが、がんばって書くのでがんばって読んでいただきたいです。

これは最近撮ったお気に入りの写真です。WEBとは何も関係がない。


さて、初っ端から話はズレるのですがWEBと演劇って関係あるの?みたいなお話から始めたいと思います。

というのもWEBセクションってよく分からない立ち位置にいるな〜と私が思っているからです。WEBは宣伝美術とは違って生活していたらふと目に入る、みたいなことがないんですね。わざわざ公演のことを調べないと人の目に入ることもないです。ぶっちゃけ公演のWEBサイトってなくても全然公演は成り立ちます。


じゃあなんでWEBサイトを作るのかというと、お客さんへの優しさじゃないかなと私は思っています。

WEBには文字制限もなく好きなだけ情報を載せられるので、公演のことを知りたいなと思って調べてくれた方に一度にたくさんの情報をお知らせできます。

それに、知らない劇団の知らないアトリエに行くのって結構怖いことだと思うんですね。

特に木霊アトリエ、住所が「早稲田鶴巻町538-12裏」なんです。「裏」。横浜生まれ横浜育ち(関係あるのかな)の私はびっくりです。住所ってそんなふわふわしていていいんですね。住所云々はさておき、よく分からないという不安感はしっかりしたWEBサイトがあると少し和らぐような気がします。

実際、少し気になって調べてみた場所や物のWEBサイトを見て少し安心したり、逆にずっと更新がされてなかったりして不安になる、みたいな経験あるんじゃないでしょうか?


あってもなくても良いけどあった方が安心する。WEBってそんな存在なんじゃないかなあと思います。



これは近所の自販機たち。

1番右の子は何があったんでしょう。



【WEBのお仕事について】

WEBセクションは大きく分けて通年でやる仕事と公演成立後にやる仕事の2つがあります。もちろん、WEBになったからといって両方やらなければいけないわけではありません。どちらか片方だけ、みたいなこともできます。

①劇団公式ホームページの更新(通年)

劇団木霊にはとても素敵な劇団公式HPがあります。ホームページを作った方はすでに退団されているのですがWEBサイトはどんどん情報を更新していく必要があります。これもさっき書いた安心感に繋がるお話ですね。

主に劇団の公演に関する情報、劇団員の出演情報、新歓情報などのページを作成しアップロードします。


劇団公式ホームページはこちら↓


②公演のWEBサイトを作成(企画成立後)

やっと他のスタッフブログで主に書いている内容にたどり着きました。結構読んだ気もしますが、がんばって読んでいきましょう。


①でお話しした劇団のHP更新は既にあるホームページに情報を書き足していくのですが、公演WEBサイトは土台的なものは何もありません。0からWEBサイトを作ります。

とはいえ、いきなり無から有を作りだしてくださいと言われても困ってしまいますね。少なくとも私はそんなこと言われたら諦めます。しかしありがたいことにWEBの作り方は結構たくさんあります。先人に感謝。


このWEBの作り方も大きく分けるとこのような2種類になります。

  • サイト作成ツールを使う
  • HTMLなどを使う

正直この辺りは私も詳しくないのでさらっといきますが、サイト作成ツールは専門知識がなくても作れるけどある程度規制があります。(広告がでたり、配置の制限があったり)

私が初めて作ったWEBサイトです。

studioという作成ツールを使っています。



逆にHTMLを使うとある程度の知識が必要になるけど自由に作ることができます。

『トランス』のWEBサイトです。

HTMLを使っています。



どちらの作り方をしても、見た目的にはそんなに変わらないんじゃないかなと思います。もちろん、出来ること出来ないことは変わってきますが。


サイト作成ツールの使い方などは使うものによってまちまちなのでここではHTMLの話を掘り下げたいなと思います。


▷そもそもHTMLってなに?

HTMLというのはWEBページを構成する要素を指定する言語です。これでWEBページを作って、サーバーにアップロードします。劇団木霊は独自ドメインなるものを持っているのでそういうことができます(多分)。


何度でも言いますがこの辺の私の理解、かなり曖昧です。原理はよく分からなくても炊飯器にお米と水を入れてボタンを押せばご飯が炊けるのと一緒です。

HTMLってこんなのです。

見たことあるような気もするけど、全く分からん!って感じではないでしょうか。


HTML、名前も見た目もなんとなく難しそうな感じがするのですが、そんなに難しくありません。

作りたいページの情報を機械側がわかる言葉を使って指示するだけです。すごく合理的なので語学によくある変な活用とかもしません。ありがたいですね。


また、HTMLを使う時もHTMLの全部を理解する必要はありません。英語のエッセイ書くときに分からない表現は調べて書くように、HTMLも分からないことは調べると大体出てきます。最初に大体のルールを覚えてしまえばあとは調べながら作ることができます。WEB作っている時の私の検索履歴はだいたい「html 〇〇する方法」です。めちゃくちゃ分かりやすいサイトがいっぱいあります。


これは夜の道路工事の写真。

なんかかっこよくてわくわくしますね。


▷実際どうやって動くの?

ということでやっとWEBセクションの動きをお話ししていきたいと思います。長いブログもあと少しです。がんばっていきましょう。


とはいえWEBセクションは大体1人なので主宰・演出家との話し合いが主です。(トランスでは補佐がいます。やったー。)


1.主宰・演出家の要望を聞く

主宰や演出家とどんなWEBにしたいかを相談します。細かくイメージ図を描いてくださる方から情報がまとまってれば良いよ!みたいな方まで色々あります。

具体的なイメージがあればそれを作っていきますが、特に決まっていない場合は載せたい情報や作品のイメージなど根掘り葉掘り聞いていきます。


『トランス』のWEBイメージを聞いたときの雑なメモ。私も意味がわからない。


2.実際に作っていく

話し合いである程度イメージが固まったら早速作っていきます。WEBサイトを作るのはもちろん、画像の編集などもします。

作業中はこまめに主宰・演出家と連絡して随時要望を書いていきます。具体的には、実際見てみるとここがちょっと違うとか、技術的に大変で諦めたデザインのことを指摘されたり(これは圧倒的に私が悪い)などですね。


当たり前ですが、私の好きなデザインと主宰・演出家の好きなデザインは違うのでその辺りの意見もたくさん聞いていきます。


個人の感覚をすり合わせたりもします

(大体が杞憂)


そんなこんなで公開1週間前くらいには完成させます。出来上がった直後は「自分天才では?」みたいなメンタルなので、一晩以上寝かせます。そうすると結構見落としていたミスがみつかったりします。不思議。

そのあといろんな人に内容のチェックなどをしてもらってやっと公開!!になります。


大体こんな感じで公演のWEBサイトを作っています。

いやー長かったですね。ブログは死ぬほど長いですがWEBを作るのは案外簡単です。

ここまで読んでくださった方なら絶対に作れます。


それにWEBは公開するのが結構早い時期(公演1ヶ月前とか?)で公開したあとはほぼお仕事がありません。そして自分とパソコンさえあれば作業ができます。

なにが言いたいかっていうと、公演時期は忙しい…!みたいな人とかセクション色々やりたい…!みたいな人にとてもおすすめです。ちなみに私はトランスでWEBのほかにも3つくらいのセクションに入っています。

WEB、おすすめです。(ここだけの話WEBは常に人手不足なのです、、、)


まあ裏事情はさておき、もしWEBに興味ある人いらっしゃったらお気軽にお声掛けください。単純にブログ読んだよとかWEB見たよとかでもうれしいです。


前回の自称アホ長い音響ブログよりもめちゃくちゃ長いブログを書いてしまった気がします。全部読んでくださったあなたはすごい。



劇団木霊2020年本公演

「トランス」

主宰 | 菅原茉利奈

作| 弁象庵

演出| 弁蔵庵

   目黒ほのか

日時 | 

10/13 19:00~10/20 23:59

料金 | フリーカンパ制

当公演は、事前収録した映像の配信となります。

ご予約 |http://ticket.corich.jp/apply/108942/008/ (鏡原すずあつかい)

出演 | 内山泰輝 

    重村眞輝 

    菅原茉利奈 

    髙城由

    髙橋陸生 

    富樫萌々香 

    内藤響子 

    細谷天歩

演出補佐 | 井上陽氷 高嶋友行 福島未悠 

舞台監督 | 紫藤拓磨

舞台監督補佐 | 宮崎樹里愛 渡辺大成

舞台美術 | 田中香穂

舞台美術補佐 | 河合咲良 笹田レイ 紫藤拓磨

音響・操作 | 石原里衣子

音響補佐 | 香梨 前田朱音 宮崎樹里愛

照明 | 小川大河

照明補佐 | 鏡原すず 福島未悠 ユリアヤ

照明操作 | 青柳みなと

映像・操作 | 西村智翔

映像補佐 | 鏡原すず 濵瑞希 福島未悠 目黒ほのか

記録映像 | 宮崎樹里愛

記録映像撮影補佐 | 井上陽氷 河合咲良

記録映像編集 | 西村智翔 弁象庵 目黒ほのか 

衣装 | 目黒ほのか

衣装補佐 | 笹田レイ にいづま久実 

制作 | にいづま久実

制作補佐 | 井上陽氷 田中香穂

宣伝美術 | 河合咲良 深見莉子

宣伝美術補佐 | 鏡原すず 亀川ふみか 下野はな 髙城由 田中香穂 細谷天歩 渡辺大成

Web | 鏡原すず

Web補佐 | 紫藤拓磨

総合企画 | 重村眞輝

撮影 | 下野はな 渡辺大成