【7日間】完全初心者：超短期集中でオリジナルwebアプリケーションをつくる【第二弾】
今回は私が一からプログラミング学習をした際の具体的な方法について書いていこうと思います。
これからTech campを受講する予定の方は受講開始までの期間を有効に使うためにもこれからの記事を読んだ上で学習を進めてほしいです。
学習の流れをざっと把握する
まず「rubyってなんだよ」「htmlって聞いたことあるけどよくわからん」って人も多いのではないでしょうか？
初めにある程度わかっていないとこの疑問が残ったまま学習していては気持ち悪いですよね。
詳しく知る必要はありませんが、これから学習することになるものについてそれぞれの役割となぜ必要なのかから理解することが先決です。
Tech campで学ぶ内容は大きく分けて四つあります。
自分はそれぞれについてもう少し踏み込んで知ってから学習すると効率が上がると感じたので雑学的なものも含めて調べてみました。
得体の知れないものを学習するよりは、ちょっとくらい相手を知って臨みたいですよね。
ではそれぞれ見ていきましょう。
Ruby & Ruby on Rails
今回はruby & ruby on rails についてです。
ruby という言語はなんと日本人によって開発されたものです。開発者は ”まつもとゆきひろ” さん。
日本から世界レベルで認知される言語が開発されたという事実はとても嬉しいことですね。
では少しrubyについて知っていきましょう。
まず初めにruby と ruby on rails の二つは何が違うのでしょうか？
同じ"ruby"という単語が含まれていますがこの二つは全く役割が違います。
Ruby と Ruby on Rails の違い
Ruby と Ruby on Rails 名前が似ているので混同しがちになりますが両者は全く違うものです。
まずは、この点から始めましょう。
「言語」ですから、それ自体はソフトウェアではありません。英語や日本語と同じように、文法と語彙があるだけです。
文法と語彙は人間が勝手に決めたものですからパソコンにとってはなんのこっちゃ分かりませんよね。
そこでRuby で書いたプログラム（ソースコード）を、「Ruby インタープリタ」と呼ばれるソフトウェアで読み込むと、アプリケーションとして実行できます。
Rubyのルールに乗っ取って書かれたコードはインタープリタが「010100101010011110101010」といった、パソコンに理解できる文字列に変換する手助けをしてくれます。
つまりRubyを学習するということは本質的には英語の学習と同じことなんです。
Ruby on Railsとは
対してRuby on Rails は、フレームワーク(framework)と呼ばれるものです。
直訳すれば「枠組み」となりますが、ソフトウェアの世界では特別な意味を持ちます。
それは、ある分野のソフトウェアを効率的に開発するために揃えられたライブラリとツールの一揃い、を指します。
ライブラリは「部品」と言い換えてもいいでしょう。
ツールは、その部品を変形したり、組み立てたりするためのプログラムです。
Ruby on Rails は、Web アプリケーションという種類のソフトウェアを作るための基本的な部品と道具をまとめたものなのです。
webアプリケーションを作りたいのならその機能とかを実装することに時間を割きたいですよね。pcやシステムの奥深くでやらなければならないことはフレームワークを用いることで自動でやってくれるようになります。
Ruby on Rails は枠組み
実は、フレームワークの構成要件は、もう一つあります。
それが、アーキテクチャです。
建築用語では「建築様式」や「構造」を表しますが、コンピュータ用語では「基本設計概念」を意味します。
ソフトウェアの開発方法には常に改良が加えられています。
時々、革新的な開発方法を思いつく人がいて、その人の考えはアーキテクチャとしてまとめられます。
新しいアーキテクチャに従ってソフトウェアを作るには、新しい部品や道具が必要になります。
例えば昔は木材を組み合わせる時、金槌と釘を用いていたと思います。
しかし現在ではネジとドライバーという新しい部品とツールが考案され使用されています。
「螺旋状の溝を掘った金属棒を回転させれば木材に簡単に食い込み、かつ抜けにくい」そんな革新的な考えを実際に使えるものに昇華してくれたのが、ネジとドライバーです。
Ruby on Rails は ”まつもとゆきひろ”さんの 革新的なアイデアを誰もが使えるようにする部品とツールの集合体（フレームワーク）と言えます。
Ruby on Rails は、21世紀になって生まれた新しい工法で Web アプリケーションを作るためのフレームワークなのです。
結論
「Ruby語覚えたら、結構簡単にwebアプリ作れるらしい。」
ということでどうでしょう。
実際にRuby on Rails を使って作られているサイトを紹介しておきます。
次回はHTMLとCSSについての周辺知識を書いていきたいと思います。
【7日間】完全初心者：超短期集中でオリジナルwebアプリケーションをつくる【第一弾】
みなさんこんにちは。
日々webサービスを作りながらプログラミングを学んでいるりくです。
今は初めてのサービスを立ち上げるために一人で奮闘している毎日を送っています。
プログラミングと一概に言っても莫大な量の言語が存在します。
そこで今回はruby , ruby on rails , html , css といったwebサービスを作るのに必要な言語を学ぶ上で自分が行ったこと、反省点などをまとめていきたいと思います。
その中でも今回は技術的なこと以外のことを書いていきます。
本気で短期集中したいならTech camp
もしあなたが東京に住んでいてかつプログラミングを本気で身に付けたいならTech campをおすすめします。
本気でフルコミットしたい人には最高の環境が整っています。
プログラミング学習中はエラーが出てきてつまずくことが多々あります。
そんな時、独学で学習をしていると何時間も一つのエラーに向き合う何てことがザラにあるんですね。
学習のコツはとにかく手を動かすことです。すぐに何がエラーの原因なのかをメンターに質問できる Tech camp は常に手を動かし続けられる最高の環境です。
なんかTech campの回し者みたいな感じですが、というのも私は5/22〜5/29の間にイナズマコースという一週間でスキルを身につける爆速コースを受講してきたんです。
もう一度書きますが学べる言語はruby, ruby on rails, html, css, javascriptになります。はっきり言ってこれだけ身に付ければ大体のアプリケーションを作成することは可能です。
しかしここで注意して欲しいのはどれだけいい教材でもすぐに質問できる環境でもプログラミングは簡単ではないということです。
全くプログラミング経験のない人がお金を払ってTech campに通えば勝手にスキルが身についてくる、何てことはまずないです。
わかりやすい教材は落とし穴
Tech campにしても最近の良い教材は一からよく噛み砕いて説明しており非常にわかりやすいです。
しかしあることに常に気を置いておかないと逆に学習効率が悪くなってしまいます。
それは ”簡単なコードでも一回書いてみる”
なぜならわかりやすい教材を読めばコードやロジックの理解はできるんですよね。
そしてわかった気になってしまうんです。そのまま次へ次へと進めて教材が終わった頃には「あれ？まっさらからじゃ何も書けない」ってことになりかねません。
教材で実際に表示された画面をみて、あとはまっさらな状態からコードを書いてみましょう。
どれだけ頭に入っていないか驚くことになります。それでももう一度書いてみる。そうやって何度も書いていると複雑なコードでも書けるようになります。
落書き独り言プログラマーになる
これは単に僕個人の癖ですね（笑）
なんかよくわからなくてもとりあえず声に出して学習しています。
なぜか整理されて理解の速度が上がったような気がします。
それに追い討ちをかけるのは鉛筆で紙媒体にイメージを落とし込む事です。
ruby などのプログラミングを学習しているとなんかよく分からない概念が出てきたりします。
例えば
クラスが「型」で、その「実体」がインスタンスである
こんなこと書かれてもよくわかんないですよね。
でも安心してください。大体のわかりやすい教材は下の図のようなわかりやすいイラストと共に解説しています。
しかしわかりやすい教材ほど落とし穴があるんでしたね。
この図をみるとすぐに流してしまいそうですが、ここで一度紙に自分の手で図にしてみることが大事です。しかも関係性を口に出しながら。
「クラスは設計図みたいなもんだから〜たい焼きだったら金属の型で〜」とか呟きながら紙にガリガリ描いてください。たい焼きなんて丸で書けば一秒で書けます。
流し読みするのと全体で３０秒くらいしか変わらないはずです。でもたったこれだけで後々の知識の定着具合が劇的に変わってくること間違いなしです。
エンジニアな自分をイメージする
全くwebプログラミングなんてしたことがなかった頃一度、tech系のスタートアップのオフィスに行ったことがありました。
そんな時目に入ったのは
（※イメージ）
こんな画面でした。その頃は一体何をしているのか知る由もなかったですし、見渡す限りのエンジニア全員雲の上の存在でした。
でも正直こんな画面開いて場所にも時間にも縛られず仕事できるって考えたらエンジニアに憧れませんか？私は憧れました。
そしてその世界の入り口に立っている自分を常に意識して学習していました。
自分の考えたコードがきちんと動いてくれた時の達成感たるや。
確かに途中で投げ出したくなることもあると思います。youtube見てしまったり、twitter開いてしまったり他の誘惑に負けることもあるでしょう。
でも常に肝に銘じておいてください「その不毛な時間だけエンジニアの自分が遠ざかっている」と。
Tech campは受講開始の２週間前からカリキュラムをオンラインで自学することができます。私は受講開始の五日前に申し込んだので自学するタイミングが五日間ありました。はっきり言って受講開始まで余分に学習できるのにやらない理由がどこにもないですよね。
その頃の私のモチベーションは「Tech camp史上最短でカリキュラムを終わらせる」
その五日間本当にほぼ寝ずに学習しました。その結果受講開始１日目にカリキュラムが終了して残りの日はオリジナルアプリケーションの作成に当てることができました。
人間本気でやればできるんです。
あなたの本気は本物ですか？
次回は自分が五日間の間に行った、もっと具体的な学習の流れを紹介していきます。
【聴覚編】HMDとの併用でとてつもない没入感（バイノーラル録音）
みなさんこんにちは。
朝9時から夜11時までぶっ続けプログラミングに勤しんでいるりくです。
集中したら時間が5倍ぐらいで進むので１日２８時間くらい欲しい。
でも今日は次なるサービスリリースに向けての大枠を作ったのですがかなりいい感じで上機嫌です。
このテンションのまま「五感をハックシリーズ」第２弾行こうと思います。
本日は聴覚編ということで先日の視覚編に続き、巷で流行（？）しているテクノロジーをピックアップしていきましょう。
聴覚
ステレオ録音の副作用”脳内定位”とは
人間とは切っても切り離せないほど大事なもの、「音楽」
私も外に出かけるときは必ずイヤホンをして出て行きます。
みなさん「ステレオ録音」というワード一度は耳にしたことがあると思います。
現在世に出回っている音源のほとんどが「ステレオ」方式によって録音されているのですが一度その概要を掴んでおきましょう。
ステレオ録音とは、モノラル録音が一つのマイクからなのに対して、
二つ以上のマイクを使用した、録音を指します。
マイクが２本になることで音源からの時間差が録音され、上下左右に広がる立体的な音場が形成されます。
モノラルだと奥行きは再現されますが、左右の広がりは難しくなります。
ここで上の引用文をよく見てみると ”立体的な音場が形成されます” とありますね。
つまりLとRの二つのスピーカーで聞くことが前提としてあるのです。
実際、スピーカーでステレオ録音された音源を再生した際モノラルに比べてよりリアルな音場が形成されることがわかっています。ここでは詳しくは書きませんがこのことを前方定位といいます。
本来人間はその環境や前後左右などの方向情報が加わった聴覚情報をもとに音を認識しています。
ステレオ録音は前提がスピーカーによって空間に音場を形成することにあるため、それをそのままイヤホンで聞いてしまうと頭の中で定位ができてしまい脳内で音が響いているような感覚になってしまいます。
これがステレオ録音の副作用「脳内定位」というものです。
打開策はいつでもシンプル
ではどうすればイヤホンやヘッドホンでリアルな音を再現できるのか。
そこで出てきたのがバイノーラル録音です。
バイノーラル録音（バイノーラルろくおん、 英語: Binaural recording）とはステレオ録音方式の一つで、人間の頭部の音響効果を再現するダミー・ヘッドやシミュレータなどを利用して、鼓膜に届く状態で音を記録することで、ステレオ・ヘッドフォンやステレオ・イヤフォン等で聴取すると、あたかもその場に居合わせたかのような臨場感を再現できる、という方式である。
おそらく聞いたことのある方も多いと思いますが何個かサンプルを乗せておきます。
（※もちろんヘッドホン推奨）
バイノーラルマイクでいろんな音を録ってみた / Binaulal Various 3D Sounds
【10分耐久】しゅわしゅわ耳を煮る ASMR Sparkling, Boiled Sounds
どうでしたか？
予想通りとてつもないリアリティですよね。
でも原理は本当に簡単です。
イヤホンでリアルな音が聞きたい→鼓膜の近くにイヤホン音源がある→左右耳の中で録音したらいい
と文章にすれば当たり前といえば当たり前の方法です。
実際にバイノーラル録音は人間の頭部の形や耳を模したオブジェクトを用いて録音します。
こんな耳がついたマイクや
よりリアルにするためch数を増やそうとすればこんなカオスなマイクも出来上がります。
実は１つ目のマイクで三十万円以上の値段がします。
下のカオスマイクがどれだけの値をはるのか想像に難くありません。
バイノーラルマイクなんて自作できる
そんな値段を見ていると何か大事なことを見落としているような気がしますよね。
人間の頭を精巧に再現するから高くなるんです。
これ以上ない精巧な頭をみんなもっています。自分の耳の中にコンデンサーマイクでも突っ込めば数百円でDIY可能です。
興味がある人は自作してみても面白いかもしれません。
アニメ大国日本においての擬似感覚デバイスとは
昨日の記事 「五感をハックするシリーズ」（視覚編）ではVR HMDのOculus riftについてまとめました。
実はOculusが開発者向けSDK第二弾を発表した時、創設者のパーマーラッキーは日本へ最優先で発送すると公言しました。
それはなぜか、Oculusによると第一弾SDKを提供した際、購入分母に比べて実際にアプリをリリースした数とそのスピードが世界でも群を抜いていたからだそうです。
ラッキー自身初音ミクのファンであり、擬似感覚という分野と特異なカルチャーを持つ日本はとても相性がいいことの裏付けでもあります。
視覚と聴覚という二大感覚をハックできつつある今、この技術をどんなアプローチで社会に落とし込んでいくか考えなければなりません。
バーチャルな世界をリアルに作り上げる尖ったテクノロジーはこれからも日本で続々と生まれてくるでしょう。
今普及しているデバイスでどれだけおもろいことができるか。
誰もが持つイヤホンを使ってこれだけ表現力をあげたバイノーラル録音は素晴らしいですね。
今回の記事にまつわるワード（気になった人用リンク）
次回は五感をハックするシリーズ「触覚編」を書いていこうと思います。
では！
【視覚編】五感をハックする世界のテクノロジー最前線
Oculus rift、VR、ヘッドマウントディスプレイ、裸眼立体視.......
これらのワードを一度は耳にしたことがある方も多いのではないでしょうか？
頭につけるだけでバーチャルの世界に没入できたり、赤青フィルムのメガネをかけずとも画面からコンテンツが飛び出してくる。
理屈抜きに感覚が引き込まれてしまう、そんなテクノロジーをピックしていきます。
視覚
VR（バーチャルリアリティ，virtual reality） 「仮想現実」のことで、コンピュータなどによって作り出されたサイバースペースをあたかも現実のように体験する技術のこと。 CGや音響効果などを利用して、理工学的に作り出しユーザに提示する。
今回はみんなご存知 VR についてのtips書いていきます。
二年前、米Facebookが新興ベンチャーOculus riftを約2050億円で買収したのは記憶に新しい方もいるでしょう。
若干１８歳の青年がカリフォルニアのロングビーチにある自宅ガレージで制作したヘッドセット。
Vuzixや任天堂といった大企業が早くに参戦していた分野で一青年がブレイクスルーを起こす。まさにドンキホーテ、アメリカンドリームですね。
Oculus Rift- Step Into the Game by Oculus # Kickstarter HD
ヘッドマウントディスプレイの簡単な原理を説明すると.......
人間の目は左右離れてついてます。つまり両目に対して左右ちょっとずつ違う画像を表示すれば現実の視覚情報を再現できるって算段です。
小さい頃、絵が3Dに見える下敷きとかカードとか見たことはありませんでしたか？
詳しくは書きませんがあれはレンチキュラーレンズというかまぼこ型のレンズが表面をびっしりと覆っていて左右の目にちょっと違うものを見せている仕組みです。
たったそれだけ？っていうシンプルなアイデアこそ強力なんですね。
次はあんまり知っている人がいないちょっとしたOculusの工夫を紹介します。
個人的に一番Oculus riftで感心したのはレンズの収差を画像側をいじることで相殺しているところです。
（この文章で理解できた人はもう読まないで大丈夫です）
説明します。
実際のヘッドマウントディスプレイはこんな構造になっています。
構造上、眼球の数センチ先にディスプレイがくるので通常ではよっぽど寄り目が得意な人じゃない限り視界のピントがあいませんよね。
そこでレンズの登場です。そしてこれが厄介な問題を起こしていました。
レンズにはザイデル５収差というものがあります。（詳細）
わかりやすいものでいくと球面収差。
中学時代、理科の時間にレンズの焦点を定規でビシッと引いたと思います。
でもそこに現実との相違があったんですね。
机上の理想化されたレンズならまだしも、現実のレンズでは周辺部を通った光と中心部を通った光で光軸上を通過する位置が少しずれます。
軸上を交差している箇所は俯瞰すれえば点でも現実世界では絶対に有限なんですよね。
「点ってめっちゃ拡大したら点じゃないやん。点ってなんなん。」みたいな哲学チックな問題です。
実際に私は高校一年生の時に廃材でプロジェクターを自作したのですがこの収差という現象で一ヶ月ほど頭を悩まされました。
（稼働中は爆熱排出＆ブレーカー落としの達人）
どんなレンズを使っても投影画面が全体にピントがあってくれない。
中心にピントを合わせたら端がボケる、また逆も然り。
この収差問題、無視できそうで無視できないレベルの現象なんです。
で、例えば実際ディスプレイとレンズでどうなるかというと.......
（上図：５収差のうち樽型歪曲収差による）
この問題みなさんだったらどうしますか？
普通に考えれば
歪んでる→収差→レンズの問題→収差のないレンズ（高価）ってなりますよね。
でもここで彼らは一味違いました。
補正したレンズ高くね？→歪んでる分画像を歪ませたらよくね？ ってなったんです。
今回は例として歪曲収差と球面収差を出しましたがまだあと三つも収差はあります。
物理的なレンズの視点から考えてたら果てしない道のりだったでしょう。
ちょっと視点を変えて問題を見たらスッと解決できたいい例ですね。
（実際にはoculus riftは色収差というものも画像側で補正をかけています。調べたら面白いかも）
今トレンドのテクノロジー、一見難解で理解できなくても細かく丁寧に見れば随所に工夫が見て取れます。
是非、これを機に何か問題にぶち当たった時ガラッと視点を変えてみてください！
（今回の記事にまつわるワードたちです。気になった人用リンク）
レンチキュラーレンズ パルマー・ラッキー フレネルレンズ フレームシンセンス
次回は”聴覚”をハックするテクノロジーについて書きます。では！
