ニュース・トレンド

すべてのクリエイターのために【日刊デジタルクリエイターズ】

デジタルメディアで活躍する現役クリエイターたちのコラムで構成されている本格派。総発行部数約16000! 真のクリエイターを目指している方からデジタルに関わる方まで、すべてに向けて発行中!

全て表示する >

日刊デジクリ[#4264] 緊張しているあなたに

2017/01/17

 
             《無料で使えます》

■装飾山イバラ道[192]
 緊張しているあなたに
 武田瑛夢

■crossroads[41]
 GitHub Pages+Jekyllを使ったwebサイトの作り方
 若林健一

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■装飾山イバラ道[192]
緊張しているあなたに

武田瑛夢
http://blog.dgcr.com/mt/dgcr/archives/20170117140200.html
───────────────────────────────────

昨年末に大学の卒業制作審査会に参加した。デザイン系の作品だけでなく、立
体や平面のアートもあった。基本的には一人ずつ作品の横に立って、持ち時間
の中でプレゼンテーションするスタイルだ。先生や同級生たちの前で行うので
みんな大変みたいだ。

人前で話すことに慣れていない学生の緊張感が、こちらにまで伝わって来る。
初々しいなぁと思ったけれど、こちらが心配してしまうほどガチガチだった人
もいて、どうしたらもっと楽にしてあげられるだろうかと考えた。

人は慣れていないものには緊張するけれど、初めてなので「慣れ」という技は
使えない。私自身も人前で話すことは苦手だし、また自分が何に対して苦戦す
るかは、体験してみないとわからないだろう。

そんな中で気がついた、今すぐにできる緊張に打ち勝つ方法は、不必要に恐怖
を増やさないことだ。

なんだかわからないけれど怖いものからは目を背けがちで、さらにその実態を
掴めないまま怖い状態から抜けられない。二つの方法で考えてみよう。

〈方法1〉いっそのことしっかり見てしまう
〈方法2〉別のことを考える

●〈方法1〉いっそのことしっかり見てしまう

私は大の虫嫌いだけれど、意識で増大してしまった怖いイメージって、自分が
最も嫌いなルックスと動きで巨大なものになっている気がする。直視してみた
らたいしたことなかったということも多いのだ。

もちろん、虫はよく見てみても大嫌いだけれど、虫だって生きるのが大変で、
暖かくて食べ物がある場所を求めている。以前ここでも書いたけれど、虫の生
態のテレビ番組で高解像度の“どアップ”で見てみると、虫に対するネガティ
ブなイメージをきれいで繊細な魅力へ移行できるかもしれない。

発表中に自分を見ている先生と目があうのは怖いだろうけれど、何を言いたい
のか聞いてくれているだけなので心配することはない。友達も同じで、一人ひ
とりは普通にいつもいる人なのだ。

聞くときにうなづく人もいるだろうから、その人に向けて伝えれば良いと割り
切ってしまうのも手だ。大きなステージに立つ人であっても、具体的にあそこ
のあの人へ向かって話そうと決めている人も多いらしい。

●〈方法2〉別のことを考える

人がたくさんいてこちらを見ていることが怖いならば、時間のことに集中する
とか、意識を別の物事に移してしまう方法だ。発表前に「人」という字を手の
ひらに書いて飲み込むという昔からの方法も、その行為に意識を移している間
に少し気持ちを休ませることができるからではないだろうか。

怖いことのターゲットをずらすことも効果的だ。自分を見られる恥ずかしさよ
りも、しっかりとこの場を進める「責任」の方が大きいことに気づくと、自分
の態度の細かいことは気にならなくなる。

見ている人に理解してもらいたいなら、伝えたいことを絞って発言できていれ
ばいい。内容をどう思うかは見ている人次第なので、発表の最中には自分から
出て行く言葉に集中して良いのだ。

言葉や視線には矢印のような方向性があって、言葉を発している人から外へ向
かう矢印、聞いている人が見ている視線がこちらに向かう矢印、隣同志で話し
合う矢印などがある。

自分の順番になり発表が始まって名前を名乗ると、聞いている人の視線の矢印
が一気にこちらに向かって飛んでくるような気がする。これが慣れていないと
なかなか強い力に感じてしまうのだ。

もちろん、その直前に名前を名乗ったから皆が見てくれただけなので、何も矢
で射抜かれたようにダメージを受ける必要はないのだ。注目してくれた人々は、
とりあえず仲間だと思うしかない。

緊張緩和法で観客をジャガイモだと思えばいいという人もいるけれど、発表中
にジャガイモだと思うのはやっぱりなかなか難しい。たぶん、うまくいった発
表の後で、見ていた人のことを思い出す時に「そういえばゴロゴロっといっぱ
いいたな」という程度のことを、人はジャガイモと言っているのだ。

結局は、目的に注意を向けると自然とそれ以外が消えるということだ。

発表の中身を吟味してきたなら、それを伝えれば十分なのだ。〈方法2〉の別
のことの中身を、本来のテーマで伝えるべきことにできるのが一番いいと思う。
つくづく伝えたいと心から思えるまで考えておけば、くっついた熱意が離れる
ことなく、聞いている人にも伝わると思うのだ。

そして「緊張」そのものは恥じる態度ではないと思う。私たちって「緊張して
いる人」を見た時には、真面目に一所懸命にやろうとしていると感じるものだ。
「緊張しすぎる」とオヤオヤっと心配してしまうけれど、ほどほどの「緊張」
なんかは可愛いものなのだ。

初めての手汗の量、感じたことのないほどの鼓動、聞いたことのないようなト
ーンの自分の声。どれも初めてだと、何が起こっているのかわからないだろう
けれど、その体験がいかに素晴らしかったかは、ずっと大人になってわかる。

緊張を伴う発表の機会は、その時にしかできない貴重な体験なのだ。


【武田瑛夢/たけだえいむ】eimu@eimu.com
装飾アートの総本山WEBサイト"デコラティブマウンテン"
http://www.eimu.com/

鳥インフルエンザで休園していた東山動植物園が再開されたというニュースを
見ていて、テレビに一瞬ゴリラが映った。「あっ、シャバーニだ。そうか東山
動植物園ってシャバーニがいるところだったんだ。」
私がゴリラの映像を見て、個体識別できたのは多分初めてだ。色々な動物を流
すように写していただけのシーンだったのに。やっぱり特徴として強くイケメ
ン感が脳裏に残っていたのだな(笑)。


━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■crossroads[41]
GitHub Pages+Jekyllを使ったwebサイトの作り方

若林健一
http://blog.dgcr.com/mt/dgcr/archives/20170117140100.html
───────────────────────────────────

こんにちは、若林です。

先週ラスベガスで開催されていた[CES2017]で発表されたもののひとつで、
HONDAの自立するバイクがかなり気に入ってます。人が乗っていても乗ってい
なくても自分で姿勢を保つことができて、人が乗っていなくても動くことがで
きる。

動画を観ていただけると一目瞭然ですが、人間の後ろを着いて歩くバイクの姿
が可愛い。バイクは人が乗る機械だということを忘れてしまいそうです。

Honda self-balancing Riding Assist tech keeps bike balanced
https://www.youtube.com/watch?v=Okf283Ct-NY

●webサイトを作り替えました

昨年末、ずっと放置していた「CoderDojo奈良・CoderDojo生駒」のwebサイト
リニューアルを行いました。

CoderDojo奈良・CoderDojo生駒
http://coderdojo-nara-ikoma.github.io/

これまでサイトの構築にはWordPressを使ってきたのですが、今回はコストが
かからないようにすることと、新しい技術を試すことを目的にGitHub Pagesと
Jekyllで構築。

昨年の8月に開催した「DojoCon Japan 2016」のwebサイトもこの組み合わせで
構築したこともあり、自分も扱ってみたいと思いつつなんとか年末に滑り込み
ました。

DojoCon Japan 2016
http://dojocon.coderdojo.jp/

実際使ってみるとそれほど難しくはないのですが、どんなことでも最初の一歩
はハードルが高いものなので(実際、私自身もそうでしたし)試してみようか
なという方のために、簡単に紹介してみたいと思います。

●GitHub Pagesとは

「GitHub Pages」とは、オープンソースのソースコード公開に使われているサ
ービス「GitHub」が提供している、webサイト公開機能のことです。

「GitHub Pages」でwebサイトを公開するために必要な手順は、

1)GitHubのアカウントを取得する。

2)「アカウント名.github.io」という名前のリポジトリを作成する。

3)作ったリポジトリに、公開するwebサイトの内容(HTML/CSS/JavScript)を
Commit&Pushする。

この3つのステップだけ。

公開されるサイトのアドレスは、「http://アカウント名.github.io」。
私のアカウント"kwaka1208"なら、"http://kwaka1208.github.io/"となります。

GitHub Pagesの特長としては、以下の3点が挙げられます。

1)無料で使える、サーバーの管理をしなくていい

2)GitHubリポジトリの内容がサイトコンテンツとして公開されるので、バー
ジョン管理が楽

3)"github.io"というドメイン名がgeek(技術オタク)的にはちょっとカッコ
いい

詳しい使い方は以下のリンク先に説明がありますが、英語は苦手〜という方な
ら「GitHub Pages 使い方」あたりで検索してみると、詳しい説明が見つかる
と思います。

GitHub Pages
https://pages.github.com/

●Jekyllとは

もうひとつの「Jekyll」ですが、こちらはRubyで作られた「静的サイトジェネ
レータ」というシステムです。

Jekyll
http://jekyllrb-ja.github.io/

webサイトを公開するためにはHTMLやCSS、必要に応じてJavaScriptを書いて
webサーバ(もしくは、今回の場合であればGitHubのリポジトリ)にアップロ
ードすればいいのですが、HTMLやCSSを個別に作成すると、後々のメンテナン
スが面倒になります。

たとえば、Blogのように日々記事が増えるようなサイトだと、新しい記事への
他の記事からのリンクの追加・更新や、ヘッダーなどの共通部分の変更が必要
となった時に多くの作業が発生します。

これをひとつひとつ人間がやるのは大変なので、テンプレートと記事本文を分
けて、自動的にHTMLファイルを作成してくれるのが「静的サイトジェネレータ」
です。

ここまでの説明だと「WordPressみたいなCMSと何が違うの?」と思われるかも
しれませんね。まぁ、だいたい似たようなものです。

WordPressの場合はアクセスの都度リアルタイムにページ生成を行いますが、
「静的サイトジェネレータ」は一回だけページデータの作成を行って、そのデ
ータを公開するだけという違いがあります。

このような違いがありますので、WordPressのような動的生成のCMSの場合だと
記事を検索する機能を作りこむこともできますが、静的サイトジェネレータの
場合はページデータは一回しか作らないので、サイト内検索機能を持たせるこ
とができないといった違いがあります。

一方で、「静的サイトジェネレータ」の場合は、利用者がアクセスした時にア
プリケーションが動くわけではないので、悪意のあるアクセスに対するリスク
が低いというメリットがあります。

●Jekyllのフォルダ構成

Jekyllでは、いくつかのファイルとフォルダの使い方について、決まりがあり
ます。

_config.yml

サイト全体の設定ファイル。サイト名などの情報をここに書いておくと、すべ
てのページで利用できるようになります。

_layouts

ページのテンプレートファイル。ページのレイアウトはこのフォルダの中に、
HTMLファイルとして作成します。レイアウトファイルなので、記事本文など実
際のページごとに変わる部分は変数として挿入しておきます。

JekyllのHTMLテンプレートで変数を使用する方法4種類
http://qiita.com/y_hokkey/items/a9948686b2264675c0a6

_includes

ヘッダーやフッターなど各ページ共通で利用するファイル。ヘッダーやフッタ
ー、ナビゲーションなど、全ページ共通の部分は単独のファイルで作っておく
とメンテナンスが楽になります。このフォルダにはそういった共通のファイル
を置く場所です。

このフォルダの中のデータを読み込むには、

  {% include header.html %}

のように指定します。

_posts

ブログ記事のデータを置くフォルダです。実際には、このフォルダ以外のフォ
ルダにブログ記事を書いても処理されるのですが、運用としてこれに従ってお
くと分かりやすいと思います。

このフォルダの中に新しいフォルダを作って記事データを置いても構わないの
で、年ごととか自分で分かりやすい単位でフォルダを作って記事を管理すると
いいでしょう。

_drafts

記事の下書きファイルを置くフォルダです。このフォルダの中のファイルは、
ページデータとして生成されません。

_site

生成された全サイトデータが保存されるフォルダです。この中のデータは
Jekyllでサイト構築するたびに作り直されますので、このフォルダの中のファ
イルを直接編集してはいけません。

これらのフォルダ以外に、任意のフォルダを作ってCSSやJavaScriptなどのフ
ァイルを置くことができて、それらを組み合わせてJekyllがサイトを生成して
くれるという仕組みです。

●GitHub PagesでJekyllを使う

GitHub PagesはこのJekyllの機能を持っていて、先に書いたルールでデータを
作ってGitHub Pages用のリポジトリにCommit&Pushすると、サイトを生成して
公開までをやってくれます。

ただし、実際に公開するまでどんなサイトが出来るのかわからないのでは困る
ので、自分のPCの中にJekyllをインストールして、公開する前に確認できるよ
うにしておくといいでしょう。

全体の流れは次のようになります。

1)Jekyllのフォルダの中にページデータを作成

2)自分のPCのJekyllを起動してサイトを生成して見え方を確認

Jekyllにはwebサーバーの機能も備わっています。ページデータが置いてある
フォルダで、"jekyll serve"を実行するだけでサイトの生成とwebサーバーの
実行までが行われます。デフォルトでは、"http://localhost:4040/"が確認用
のローカルサーバーになります。

3)確認ができたらGitHubにCommit&Push

この時Pushするのは「_site」フォルダ以外のフォルダです。「_site」の中身
はCommit&PushしなくてもGitHub Pages側で生成してくれますので、
.gitignoreで管理しないフォルダとして指定しておきましょう。

●メリットとデメリット

GitHub Pages + Jekyllでサイトを公開することの、メリットとデメリットを
まとめておきます。

◎メリット

・無料で使える

・静的サイトでGitHubのサーバーなのでセキュリティ上の心配をしなくていい

・記事をMarkdownで書ける(GitHubを使っている人なら慣れているはず)

◎デメリット

・データがGitHubのリポジトリに置かれるため、記事の下書きなども含めてリ
ポジトリからは見えてしまう

・サイト内検索や、訪問者ごとに表示する内容を変えるなどの動的サイトは作
れない

・デザインテーマ(デザインのテンプレート)は、WordPressなどに比べると
バリエーションが少ない

●個人のサイトにおすすめ

GitHub Pagesに自分で管理している独自ドメインを適用することもできます。
こちらのサイトも年末にWordPressからGitHub Pages+Jekyllに移行しました。

http://kwaka1208.net/

Jekyll用にデータを出力するWordPressのプラグインを使えば、記事データは
すぐに取り出せるので、移行にかかった時間は3〜4時間程度。

仕組みが理解できれば簡単に使えて更新も楽になります。コストも掛かりませ
んし、機密情報を取り扱わない個人のサイトにはおすすめです。


【若林健一 / kwaka1208】
http://kwaka1208.net/aboutme/

CoderDojo奈良・CoderDojo生駒〜子どもためのコーディング道場〜
http://coderdojo-nara-ikoma.github.io/

CoderDojo Japan公式ブック発売中!
Scratch(スクラッチ)でつくる! たのしむ! プログラミング道場
https://www.amazon.co.jp/dp/4800711517/


━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
編集後記(01/17)

●今野敏「仁侠病院」を読んだ(2015、中公文庫)。「任侠」シリーズ第三弾
である。又もや兄弟分の組長から持ち込まれた面倒な案件に、阿岐本組が取り
組むという話だ。しかし、出版社のときも、私立高校のときも、たまたまラッ
キーな巡り合わせで何とか経営を立て直せたに過ぎない。今度は潰れそうな病
院を経営する財団法人ときた。組長は文化的事業が無条件に好きで、主人公・
語り手となる代貸の日村を悩ませてきた。「医は仁術って言葉を知ってるかい? 
そういう気持ちを忘れちゃいけねえと思うんだよね」。全然説得力はないが、
オヤジには逆らえない。組長が駒繋病院の監事に、日村が理事に就任した。

病院は外部の医療関連サービスで成り立っている。検査や滅菌・消毒、患者の
給食、寝具類の洗濯、院内清掃、コンピュータシステムなど多岐にわたるが、
すべて外注だという。そういうサービスを一括して請け負えるのは、総合商社
か極道である(ホントか?)。駒繋病院ではSMEという会社が、法外な手数料
をとっている。病院の赤字が膨らんだ原因のひとつだ。SMEはその利権を離さ
ず、病院の立て直しの邪魔をしている。バックにはやはりヤクザ、耶麻島組が
いて、病院から徹底的に搾り取り、終いは病院を潰し債権者となって設備や建
物の売却を狙っている。耶麻島組との対立を避けながら建て直しができるのか。

オヤジはSMEの営業担当に契約の見直しを申し入れる。外壁をきれいに清掃し、
待合室の天井の蛍光灯を取り替えた。それだけで病院の印象は変わった。耶麻
島組は病院にホームレスなどを患者にして、昼夜問わず大量に送り込むなど、
様々な妨害に出るがかえって院内の結束がかたまる。この病院の医師も看護師
も本当にたいしたもんだ。一方で阿岐本組は地元の暴力団追放運動の標的にな
っている。組織化しているのはデータ商事という不動産屋で、土地の買い占め
を狙っている。バックが耶麻島組だと判明した。これで耶麻島組と喧嘩する材
料ができた、相手はSMEではない。そう言って喜ぶ阿岐本。出来すぎた話だ。

仁侠ヤクザの落としどころは、やはり暴力団ヤクザとの抗争に勝つことだ。オ
ヤジと日村は耶麻島組の組長の呼び出しに応じて……というクライマックスを
経て、たった2週間で病院を立ち直らせることに成功する。病院には阿岐本に
も貫目負けしない腹の据わった事務長や、命の尊厳に関わる仕事に邁進する医
師、看護師たちがいる。人物造形が巧みである。だが、一個所、作家にあるま
じき大ミスを発見した。「ほんのサワリだよ」を、最初の部分という意味で使
っている。サワリとはみどころ、メインとなる部分を言う。わたしが読んだの
は単行本だ。文庫化されたときにそれが修正されていればいいが。 (柴田)

「仁侠病院」
http://www.amazon.co.jp/exec/obidos/ASIN/4122061660/dgcrcom-22/


●人前で話すのが苦手なので、よく読んでおこうっと。/着いて歩くバイクの
姿、ほんとにかわいい。

昨年、マンション内で行われたAED講習会を受けた。入居者からAED設置の要望
があり、理事会で承認。導入されたので、講習会やりますよ〜というものであ
った。

ALSOKの人が講師。使い方の説明に入るかと思いきや、状況の話から。まずは、
人はどこで心肺停止状態になるのかという質問。お風呂かな、トイレかなと
予測していたら、一番多いのはベッドの上で7割。次にトイレ、お風呂の順だ
った。

心肺停止とわかった時点でなるべくたくさんの人を集めろとのこと。外だと、
指示する時は、わかりやすいように「そこの青い服の方、救急車を呼んでくだ
さい」「赤い服の女の方、そこのAEDを持ってきてください」など具体的に。
続く。                        (hammer.mule)

規約に同意してこのメルマガに登録/解除する

メルマガ情報

創刊日:2000-08-22  
最終発行日:  
発行周期:日刊  
Score!: 99 点   

コメント一覧コメントを書く

この記事にコメントを書く

上の画像で表示されている文字を半角英数で入力してください。

※コメントの内容はこのページに公開されます。発行者さんだけが閲覧できるものではありません。 コメントの投稿時は投稿者規約への同意が必要です。

  • コメントはありません。