「点を頑張らないと、線につながらない」　“遅咲きエンジニア”が語る、アウトプットを積み重ねる重要性

最初のソフトを作ってる時に気づいたこと

山崎大助氏：僕の夢は本を出版することでした。夢を叶えるために、もう7、8年かかっています。「遅咲きエンジニア、やっと本に載る」みたいなタイトルですね（笑）。（スライドを指して）ここにある本には僕のすべてのアプリが載っています。

全部違う出版社のものです。同じ出版社もあるんですが、編集部が違います。例えば日経PC21や日経ソフトウェアなど、いろいろなところから「載せてほしい」と（連絡が）きたので載りました。

当時はSlackやSNSはない時代だったので、メールアドレスできていました。僕のソフトにはしっかりとお問い合わせ用のメールアドレスを書いていたので、出版社からメールがくるようになりました。全員のメールアドレスを僕が持っていたこと、実はこれが武器になってくるんです。

また、ここで気づきがありました。（スライドには）「私の勘違い」と書いていますが、すごいコードが書けて、誰よりも知識があって、スーパー（マン）であれば誰かが白羽の矢を向けてくれるだろうというのは、まったく違っていたんです。それは僕が目指しているものではありませんでした。

だけど、その「すごいコードが書ければ」という時期は絶対に大事なんですよね。そうじゃないと作れるようにもならないし、基礎がつかないから作る。なので、今の僕にとって大事な過程だったんです。気づかなければ今の僕はないので、7、8年かかっても気づけたのはいいんだと思います。みなさんは今見ているので、もう気づけたと思います。

すごいコード、知識。素人のお客さまは、そんなのはどうでもいいんです。使い勝手のよさ、おもしろさ、使う価値があるアプリかどうか。できあがったアプリですべてが評価されます。やっとそこに気づけたんです。本当に長かった。

そしてもう1つ気づきました。日本の人口は1億2,500万人。1万人に1人使ってもらえればいいんだということ時気づけたんです。つまり、1万人に1人ということは、1億2,500万人のうち1万人ぐらいに使われるということです。十分ですよね。1万ユーザーもついたらすごいことです。

僕は今ジーズアカデミーで教えていますが、この学校に入学してきた方には40、50歳ぐらいの方がけっこう多くいます。

その方の中で「山崎先生のソフトを使っていました」という方を、今までで3、4名は見てきているので、当時の僕と年の近い方だと思います。「やはり使ってもらっていたんだな」と実感する時がけっこうあって。みなさんの周りで誰もいいと思う人がいなくても、1万人に1人に使ってもらえれば、1万人に使われる可能性があるんだよということです。

早く極めれば先駆者的なかたちになる

2010年にiPadが発売されました。前回のアプリ（Adobe AIRのフリーソフト）の成功体験から「今やるしかない！」と思いました。先ほどのAdobe AIRのフリーソフトは、実は新しい技術が出て、1週間で作ったものだったんです。新しい技術が出てすぐに食いついて、誰よりも早くアップしましたが、それでも登録されたのは8番目でした。だけど早く極めれば、パイオニアというか、先駆者的なかたちになるわけです。

早さの大切さを1回体験していたので、iPadが出た時も「これをやるしかない」と思いました。当時のHTMLは、今はHTML5が標準になっていますが、HTML5が出始めたのがちょうど2010年です。初代iPadのSafariには、CSS3にアニメーションがあるじゃないですか。ローカルストレージもそうですし、JavaScriptでいうとcanvasとか、いろいろな機能がつき出した時でした。

フリーソフトのあとに作ったもの

ではどんなものを作ったかを見せます。

（デモ開始）

iPadで動きます。当時これは斬新でした。CSSにアニメーションが初めて（のった）。ブラウザーでもまだベータ版ぐらいの感じです。一番早くやれば、何かが始まるんじゃないかと思ったわけです。

「スタート」を押します。左上にアニメーションが出ていましたが、あれもCSSでやっています。文字と、戻ってくる時に少し奥行きがあります。CSSのtransformを使っていますが、当時これも最新でした。

画面に鳥を描いていきます。マウスがけっこう難しいですね。という感じで、iPadのブラウザー上で、子どもが（絵を）描けたらいいなと思って作りました。

保存すると、ブラウザーに保存するためのローカルストレージ領域ができているということを初めて知り、画像の保存ができることを「すごい！」と思いました。

次のページに行くと保存しているデータを取ってきます。前に作ったものがまだ残っていましたね。こうやって自分が書いたものが子どもが触ったら動き出したら、おもしろいかなと思いました。これを1週間で作りました。

（デモ終わり）

念願の執筆依頼が届く

ここでなんと念願の執筆依頼がきました。僕も記事を書けるようになったんです。日経ソフトウェアで10ページの記事を書くことになりました。

なぜか。思い出してください。いっぱい本が積んでありましたよね。編集者さんのメールアドレスを僕は持っていたので、そこに全部に送りました。そしたらなんと日経ソフトウェアさんから1時間後にメールが返ってきて、「山崎さん、ちょっと10ページでこのアプリの作り方をやってみませんか？」ときました。「キター！」と思ったわけです。

「キター！」と思って。夢が叶った人生最高の時です。それで実際に書きました。これが僕が最初に本を書く出来事でした。

その数年後です。（スライドを指して）今度はこの写真を見てください。『レスポンシブWebデザイン』という本がありますよね。実は日経ソフトウェアの10ページの記事が、ムック本になりました。1年分のヒストリーをまとめた本が出たんです。

日経ソフトウェアのいろいろな記事をまとめたムック本が出て、その2年後ぐらいだと思うんですけど、それを見たソフトバンククリエイティブの編集者さんから「この本を書いてほしい」という依頼がFacebookにきました。

僕は面識もないし、1回もやり取りをしたことがないんですが、「こうやってソーシャルはつながっているんだな」と、ちょっとビックリしましたよ。こういうこともあるんだと。そして、実際にここで本を書くようになったわけです。論文を書いたことがある方はわかると思いますが、10ページの記事って難しいんですよ。けっこう大変じゃないですか？

ところが、今度は本なので、300ページぐらいあるわけです。最初は地獄でした。夢は叶ったけど、地獄が待っていたみたいなね。でも、この本のおかげで今度は私立の大学から「ぜひ教えに来てほしい」という話がくるようになりました。一つひとつ目の前にあるものを、ただ一生懸命にやってきただけなんですよね。

動かなければチャンスは絶対に来ない

まずはエンジニアになりたい。一生懸命にやりました。スーパーエンジニアを目指して、スーパーエンジニアになれば何でも手に入れられると思っていた。でも違った。途中でフリーソフトを作ったらなんかおもしろい。そのフリーソフトを作ることに熱中して、それが記事に掲載された。

また新しいデバイスが出たことによって、僕は新しいおもちゃを見つけました。そして、すぐそこに全力で向かった。躊躇せずにやりました。恥ずかしがらず、人になんと思われようとも出版社にメールを送った。自分が動いたことによって、チャンスがやってきたわけですね。

動かなければチャンスは絶対に来ない。向こうから来ることはありません。それは僕が最初に間違っていたことと一致しているんですよ。スーパーエンジニアになって、黙って会社の中で「俺はすごいんだ」となっていたら誰にも見えなかった。初めてフリーソフトを作って外に出ていったから見つけてくれる人がいた。今でいうアウトプットなんですよね。

アウトプットは非常に重要で、僕が教えている学校では基本的にアウトプットは必須なんですね。アウトプットをしないと、何もしていないのと一緒だよということなんです。アウトプットしなければ誰も知らないんですから。その原点が僕はここにあったわけですね。

成功体験の積み重ねから、毎年アプリを作るように

僕は小さな成功体験を積み重ねてきて、貪欲に動いていけば何かが起こるということを知りました。それがわかったので、毎年何かしらのアプリを作ってきました。

（スライドを示し）例えばなんですが、今表示されている左上のアプリは「Bootstrap Editor」と言います。それ実際の動きのデモします。

（デモ開始）

これは4、5年ぐらい前に作りました。BootstrapというCSSのフレームワークが出て、人気が出た時です。当時Bootstrapの記事をITmediaで書いていたので、ある県の第三セクターか何かでやっているセミナーに呼ばれ、Bootstrapの講師をしていた。100人ぐらい（参加者が）いましたが、全員パソコンが違う。エディタも、ブラウザーも違うんです。「どうやって研修したらいいんだ」と思いました。

2時間でBootstrapを伝えなきゃいけないんだけど、エディターも違うし、操作の仕方も違うし。チューターさんもTAさんもいない、僕1人なので、「わからない」と言われるととまっちゃうわけです。

これは困ったなと、全員が同じ画面で学べたらいけるんじゃないかと思いました。そこで、Bootstrap Editorを1週間ぐらいで作りました。基本1週間なんです（笑）。

例えば、世界中にかっこいいテンプレートがあります。Chrome、Safari、Firefox、Edgeブラウザー。なんでもいいですが、Bootstrap Editorのサイトに行くとコードとスライドが出てきます。

テンプレートを何でも選べます。これは誰でも普通にJavaScriptでできます。スマートフォンの大きさにしました。「Landing Page」と書いてありますね。

みなさんはいつもVisual Studio CodeやDreamweaverなどいろいろ使われていると思いますが、このように、ブラウザーの中ですべてできる。さらにダウンロードができるようになっています。ブラウザーさえあれば誰でもHTML、CSSを学べて、JavaScriptも当然打てますが、そういったものを作ろうと思ったきっかけがありました。

（スライドを指して）こういうものをまず作りました。これは本当によくできています。例えば僕が講師でみなさんが受講生として画面をとおして学べるように、実はビデオチャット機能というのがついています。

今はカメラの接続ができませんが、今みなさんが見ている右側が、黄色になったり青くなったりしている。ここは実はリアルタイムにつながっています。例えば僕が打ったものが相手にすぐ反映されるし、向こうが打ってくると、こっちも変わるような仕組みも入れてみました。

これはFirebaseというGoogleのサービスを裏で利用して作っていますが、このようにすることで、1週間で作ることが可能になったわけです。使っている技術は、基本はHTML、CSS、JavaScriptだけ。あとはFirebaseという外部のAPIのサービスです。

（デモ終わり）

僕はビジネス面が若干弱いです。頭が弱いということじゃないですよ？　ビジネスが弱いんですが、みなさんは「ビジネスモデルキャンバス」とものを知っていますか？　またはLean Canvasというやつです。僕もそういう本を買って、ビジネスのフレームワークを学んでみようかなと思い、作ったサービスが次のデモのものです。

（デモ開始）

もうすでに登録しているデータがありますが、自分のアイデアをしっかり分けていくアプリケーションを作って、メモを取りたいと。Ajaxでデータを取りに行って、自分でやってみたり。

さらに自分のアイデアが本当に世界中にあるのかを確認するために、虫眼鏡マークがあって、これをクリックします。そうすると形態素解析といって、僕の文章を1回ヤフーの形態素解析のAPIに投げて、例えば述語や名詞などに分けて、データをXMLでもらってきます。

そのXMLの状態を、今度はMicrosoftのAI Search、Web Search、Googleのサーチ検索みたいなAPIがあります。そのAPIに名詞と何かだけを検索するようにして。これが取ってきたデータです。実は裏のロジックが複雑になっていますね。

（デモ終わり）

ベースは1週間で作りましたが、似たようなサービスを検索するところまでやるのには、さらに1週間ぐらいかかった記憶があります。こういったものを常に作り続けてきました。

他には、グラフィカルなものを投稿できるサイトを作ったりしました。JavaScriptでp5.jsというクリエイティブなものがありますが、それを投稿するサービスを作ってみたりもしました。他には、「BingMaps」という、Microsoftのほうのマップのサンプルサイトを作りました。

そのマップ、実は自分のアプリに組み合わせて作ろうとすると、かなりのコードを書かないと難しくて、けっこう大変です。（スライドを指して）これだとWebデザイナーの方には使いづらいなと思ったので、jQueryみたいに1行でマップが作れるライブラリを作りました。BmapQuery.jsというやつです。これは今GitHubに上げてあります。

あとはDBの設計をしたら、コードも書き出されるようなサービスを作ったりと、アウトプットをたくさんしてきました。

点を一生懸命やれば、いずれ線につながる

やはりアウトプットをすると何かが起きます。これは最後の自慢話です。米国Microsoftの公式サイト「Bing Blog」というBingチームの公式サイトがあります。3年、4年ぐらい前になりますが、そこに僕のサービスと僕が載った記事を掲載しています。今でも載っています。世界中のMicrosoftの技術を使っている人たちが見るようなサイトに、日本人では初めて僕が載りました。

やはりMicrosoftの公式ページなのでいろいろ段階を踏まないと個人を載せられないんですよ。みなさんの企業もそうだと思います。一個人を有名な会社のサイトに載せるというのは難しい話なんだけど、そこに載れたのはなぜかというと、みなさんはわかりますか？

アウトプットですよね。そう、アウトプットをしているからそういう話がくるんです。しなかったら誰もきません。「誰ですか？　あなたは何を作ったんですか？」となるわけです。だから作らないといけない。出さなきゃいけない。いかに世に広める活動をしなきゃいけないかとも重要になってきます。

それに気づけたのが、10年ぐらい前に作ったフリーソフトでした。きっかけがすごい重要だったと思います。

一つひとつを一生懸命、目の前にあることだけをやってきて、その結果、今ジーズアカデミーで教えられることにもなっています。大学の先生にもなって、本も3冊出しています。さらに、自分の作ったサービスが世界で使われるようになった。つまり僕がエンジニアを目指していた時に、夢だったものはすべて今叶っています。十何年かかりましたが、諦めなければなんとかなるということですね。

一つひとつのチャレンジは単発です。それがどこにつながっているかなんてわかりません。その点を、線につなげればいいだけです。

今しか見ていないから、誰も気づかない。だけど僕もそうでした。点を一生懸命作っていたんです。でも振り返れば、それが全部つながっていた。だから線になったんですよね。

みなさんに伝えたいことは、点をとにかく一生懸命がんばらないと、線にはつながらないということ。継続することが一番大事と書いていいますが、点を一生懸命やらないと、線になっても大した線にならないということです。そんな人生甘くもないし、うまくもないと思うので、基本的にはやはり一つひとつ一生懸命やって結果を出す。できなかったら次で結果を出す。

その点が最終的につながって、自分の目指していたところになればいいと思うので、ぜひみなさんも諦めずに夢を持って継続してやってもらいたいと思います。

私はアプリ公開から人生が変わりました。小さな成功体験を積み重ねて、継続してきて今があります。みなさんにお伝えしたいのは、キャリアを変えるには、まずはアウトプットをしてください。僕はずっとアウトプットをして自分の人生を変えてきました。

プログラミング学習も、インプットだけでは何もなりません。アウトプットして初めてかたちになって理解できるので、すべてはアウトプットのためです。ご清聴ありがとうございました。

（会場拍手）

質疑応答

司会者：ありがとうございます。実は事前のアンケートで質問がきています。「継続をする秘訣はなんですか？」という質問です。

山崎：やらされていてはダメなんですよね。自分がやりたいこと、例えばゲームを作りたいのか、メモ帳を作りたいのか、自分専用のToDoアプリを作りたいのかなど、何か1つでいいんです。そこを一生懸命やることだと思います。「じゃあ君はじゃんけんを作ってね」と、ぜんぜんおもしろくないことを言われて作るとなると、継続は難しいと思います。

なので、僕は基本的にやはり作りたいものを作っていくというのが、モチベーションとしてありました。でも、最初はインプットしている時があるじゃないですか。インプットしている時というのは、最初は苦痛ですよね。if文や繰り返し処理などはつまらないじゃないですか。僕に教われば楽しいと思いますが、普通はつまんないんですよ（笑）。なんて自信なんだ（笑）。

やはり少し我慢しなきゃいけない時期みたいなものは当然あります。ただ、それは一気にやりきってしまえば1週間ぐらいで基礎は学べるものだと思うので、そしたらもう作り出すことです。

あとはわからないことだけを調べればいい。基礎ばかりをやっていたらつまらないので、とにかく基礎を1回バーンと合わせて、何か簡単なものを作る。それをずっと作り上げていくことで成長しやすくなります。

写真提供：G's ACADEMY