このスライドについて書いた記事は https://blog.orangebomb.org/blog/2017/08/25/career-keynote/ こちら。

1. キャリアキーノート2017
川本圭太 / GMO Pepabo, Inc.
2017.05.11 新卒研修 キャリアキーノート (Update 2017.08.25)
迷い彷徨った先で見つけた
自分の進むべき道

2. キャリアキーノート？

3. 先輩の個人史 (キャリア) を紐解いてもらう
中で、その根底に一貫して流れる基本的な考
え方 (キーノート) を学ぶ場
提唱者：OKUMURA Takahiro ( @hfm )
キャリアキーノートとはなにか http://blog.hifumi.info/2016/06/20/career-keynote/

4. 個人史を軸に
僕の根幹部分を紹介します

5. タイトルにある通り
“彷徨った” 系なので基本蛇行です

6. デザイナー
川本圭太 @keita_kawamoto
ホスティング事業部ロリポップ！グループ
blog.orangebomb.org

7. 詳細
•1985年生まれ 長崎県大村市出身
•子供の頃から工作や絵を描くのが好きだった
•図工の時間がすごく楽しかった
•「道具」そのものも好きだった
• 工具フェチで、使いもしないのにホームセンターで小遣いを使って工具
を買ったりしていた

8. 詳細
•中学の時に球技が苦手であることに気づく
•高校で人工壁を使ったフリークライミングをやった
•ゲーム・映画が大好き
• 昔から観察が好きで、好きなものは何度も繰り返し見て観察していた
• 映画のアングル・カット、ゲームUI...
• メイキングを見るのも大好きだった

9. 遡ること、高校卒業時

10. 卒業してもフリークライミング
にだけ情熱を注いでいた

11. 楽しくてクライミングしかしたくなかった
•「適当に働きつつ本気でクライミングする」ことを目
的とし、安定性を狙い就職先を探した
•本気度が低く当然受からなかった
•学校に募集が来ていたとある製造ラインの会社に就職
した（目的がなかったので大学は選択肢になかった）

12. 本気の趣味と仕事との両立は難しかった
•何も考えない単調な仕事も楽しくなかった
•クライミングで伸び悩んだ
•中途半端なクライミングも楽しくなくなってきていた
•自宅でパソコンを触りネットするのが心地よかった

13. 地元のクライミング情報を
眺めるのが楽しい
[画像について] 長崎県山岳連盟のWebサイトより引用。この画像は長崎県山岳連盟の著作物です。

14. 刺激を受け自分もサイトを作った
•ネットで作り方を調べ、無料レンタルサーバーを借り
て、Windowsのペイントで画像編集をしてクライミ
ングのサイトを作った
•めちゃくちゃ楽しかった
•周囲の友人・知人が「見たよ！」と言ってくれるのが
嬉しかった

15. 仕事は…
•何も考えず奴隷のように働く仕事が嫌になっていた
•今作っているものは何の何に使われる部品なんだろう
•この装置は一体なんだろう
•聞くほどのやる気もなかった
•何のために生きているのかわからなくなった

16. あるサイトに心動かされた

17. [画像について] 2005年 日産自動車Webサイトより引用。この画像は日産自動車の著作物です。

18. 衝撃を受けた
•2005年ごろ、日産自動車のサイトを見て感動した
•広いディスプレイで見てるのになぜか左端に寄ってて、
しかも約正方形の中にコンパクトにぎっしりとコンテ
ンツが詰め込まれている
•ぎゅうぎゅう詰めなのになぜか整って見える

19. 「整頓」されていた
[画像について] 2005年 日産自動車Webサイトより引用。この画像は日産自動車の著作物です。

20. 今ならわかる
•優先順位別に強弱がつけられていた
•アクティブがカラー、非アクティブな部分はモノクロ
にしてあった
•このサイトが何が言いたいかが伝わって来た「この部
分は今アクティブじゃないよ」「宣伝バナーだよ」
「色がついたということは選択できるということだよ」

21. コンパクトな理由
•レスポンシブウェブデザイン（外観・操作方法最適化）
という用語がそもそもない時代、多種多様なサイズの
画面・ウインドウサイズでも同じように見られるよう
コンパクトに凝縮していたと思われる
•当時は、そんな理由など気づきもせず、ただコンパク
トにまとめていること自体に美しさを感じていた

22. 魅了され、自分も作りたくなった

23. 何も知らない問題

24. 作りたくて仕方なかったけど…
•サイトを作ることに不思議な魅力があった
•まるで図工の時間の気分だった
•が、どうすればいいかサッパリわからない
•いろいろやろうとしてみたが、ネットから拝借したパ
クリコードのHTMLとインラインスタイル（CSS）で
どうこうなるレベルではなかった

25. 「やり方を知らないだけ」という謎の自信
•Photoshopなどのツールの存在すら知らなかった
•すべての知識が付け焼き刃であり仕組みを理解してい
なかった
•ただ、何をどうすればこのような「見た目」が作れる
か、それは自分にもできると根拠のない自信があった

26. 「仕事に就けば学べる」
という思考だった

27. サイトを作る仕事がしたい
•作ることが大好きだった自分に、はじめてフィットす
るものを見つけたと思った
•でもどうすればいいかわからなかった
•近所の電気屋にあるパソコン教室で聞いてみた
• （今思えばなんでネットで調べなかったんだろう）

28. 「長崎市にヒューマンアカデミー
というのがある」

29. その電気屋の教室の先生に
このことを教えてもらえたのが
人生の転機だった

30. 止まらないワクワク

31. ヒューマンアカデミーに資料請求
•ヒューマンアカデミーは幅広い専門校
•Webコースの資料を見てワクワクした
•憧れたあんな表現こんな表現ができるようになるんだ
と興奮した
•キャリアプランなどなかった、ただ作りたかった

32. 師匠との出会い

33. 入ったWebクラスの担当講師
•「ツールを信じすぎず最後は自分の目を信じろ」
•先生が面白かった
•ツールの使い方よりもデザインに関するいろいろなこ
とを教えてくれた

34. そのうちのひとつを紹介
•四角い紙を用意（A4とか付箋とかでいいです）
•目測で正確に中央になるように点を打つ
•次に紙を十字降り（四つ折り）し、折り目により正確
な中央を示せるようにする
•そして開くと、目測で打った点の位置は…

35. “人間は本当の中央より
ほんの少しだけ上を中央と感じる”

36. さらなる面白さに触れた

37. １年経ち、無事卒業

38. Webデザイナーとして
働きはじめ…られない

39. 開幕すらできない

40. 八方を塞ぐ「実務経験必須」の壁
•「実務経験２年以上」という条件が9割ほどの確率で
求人に載っていた
•まず自分のデザイナー人生が開幕すらできないことに
ショックを受けた
•必死に探すこと…ようやく勤務経験なしで入れる会社
をみつけた

41. 独学と同じ状況・狭くなる視野

42. 社員は自分と社長だけ
•受注しサイトを納品する地元の制作会社で勤務
•極めて人数が少ない会社であり、デザイナーの先輩が
いなかったので、完全に独学だった
•学習の偏りが発生し、視野もかなり狭くなっていた

43. 熱は冷めていなかった

44. 心から大好きだった
•「いいデザインをしたい！」という気持ちは人一倍強
いと思っていた
•みんなが「すごい！いいね！」となるものを作りたかっ
た
•この会社を大きくするんだという情熱を燃やしていた

45. しかし、すべてが浅かった

46. 「なんとなく」
•このとき、作るものに「なぜそうなったか」という理
由を言語化できたことはなかった
•「いい感じでしょ？」
•しかなかった…

47. ３年、ひとりで戦った
•数々の案件をこなした
•と言っても、ヒアリング・打ち合わせ・やりとりは社
長がやるので与えられた条件・依頼に対し社長に提案
する経験しか得られなかった
•案件毎に「前回の自分を超える」というのがひそかな
自己課題だった

48. そして退職
•実戦経験がないという最大の障害がなくなった
•視野の狭さも危惧していた
•様々な理由で、退職することにした

49. 就職活動

50. 福岡も視野に入れた
•長崎は狭い、人が多いところへ行きたい！
•デザイナーの仲間を増やしたい！
•もっと前線で活躍したい！
•様々な思いを胸に、就活用ポートフォリオを作り師匠
に見てもらった

51. 「ただのデザイナーは溢れてるから
企業は必要としてないんだよ」

52. 「君のポートフォリオは
５、６年前の手法だよ」

53. 打ちのめされた

54. なんとかしなくちゃならなかった
•このまま無職では上を目指すどころか生活ができない
•なんとか自分の最大の力を企業に伝えなくては
•あらゆる手を考えた
•自分を知ってもらうためにあらゆる準備をした

55. ペパボの求人に応募
•育てるのが好きだったのでぴったりの会社だと思った
•自分の力をちゃんと伝えることができたらしく、なん
とか拾ってもらえた
•はじめて仲間のデザイナーができた
•先輩から多くを学んだ

56. 根気だけはあった
•総合すると能力は低かった
•はじめてエンジニアと共同作業をしたら異世界だった
•コード周りでかなり遅れていたが、得意な画像編集と
レイアウトまわり中心に仕事はなんとかこなせた
•気の遠くなる大量の改修業務にも立ち向かった

57. どんどんあつまる情報
•大勢の仲間たちと仕事をすると自然と情報が集まる
•ひとりのときは見えなかった部分がどんどん見えるよ
うになった
•気づきの連続だった

58. ようやく見えた「デザイン」

59. 少しデザイナーらしくなることができた
•観察と研究、調査を繰り返すうちに、自分の作ったも
のも「なぜそうなったか」を言語化できるようになっ
てきた
•人と会話することで説明の機会が圧倒的に増えたのも
理由のひとつ

60. ディテールの向上
•先輩デザイナーたちと仕事をすることで「細部のディ
テール」によってクオリティが大幅に向上することを
知った
•正確には知っていたが、目のレベルが違った
•これまで以上に細部を見るようになった
•逆にそこがダメだと全然ダメだということも知った

61. そして天狗に…
•業務をこなしているうちに、同僚からプライベートな
デザインの頼まれ仕事を請け負うようになった
•喜んでもらえた
•気づかないうちに、天狗になっていた
•愚かなことに、師匠に打ちのめされたあの言葉もすっ
かり忘れて…

62. 社内制作イベントでの出会い

63. 初めてのプライベートプロダクト
•社内の制作イベント「お産合宿」があり、チームを結
成し参加
•会社のサービスではなく、仲間と生み出すはじめての
プロダクト
•会社のエンジニア、デザイナー、CSと参加

64. イベント後も作ったものを有志で育てた
•エンジニアと様々な意見交換・議論をした
•ぶつかり合い、喧嘩し、認め合った
•先入観を捨てる・俯瞰的に見る
•古臭い固定観念が生まれてしまっていれば除去する
•素直さと冷静さが大事

65. 様々なものを得たがそれでも
このときもまだ

66. 漠然と「いいデザイン」を
追い求めているにすぎなかった

67. 作ってばかり問題

68. まだ具体的な「どうなりたい」がない
•このときもまだキャリアプランなどなかった
•呑気
•いいデザイン？言語化などできていない
•いい設計をし、いい見た目を作り、数をこなせば、そ
のうちすごいものを作れるようになると思っていた

69. 迷い・悩み
•デザインに関して悩みを抱えることが多かった
•「何が一番いいのか？」迷うことが多かった
•社内で起こっていた議論のことばかり考えていた
•社内しか見てなかった
•そんなとき、かなり年上の先輩からこのような言葉を
もらった

70. 「社内のことなんて
どうでもよくない？」

71. 「視野が狭いよ。
世の中に目を向けなさい」

72. ハッとした

73. 問われたキャリアプラン

74. 問われても回答できなかった
•上長との面談で「どうなりたいか？」と問われた
•漠然としていた
•デザイナーとして高みを目指していきたい気持ちは固
くあった
•だが全くと言っていいほど言語化できなかった

75. 井の中の蛙
•「やろうと思えばなんだってできる」
•サイトの改修、リブランディング…全部任せて欲しい
•そんなことまで思っていた

76. 自分がなにをしたいのか
わからなかった

77. 自分はどこを目指している？

78. 何が楽しい？デザイン？
デザインって？

79. 「デザイン」を
広義に捉えすぎていた

80. エンジニアへの憧れ
•エンジニアのようなアウトプットが苦手だった
•デザインに関するブログ記事など書くテーマが見つか
らなかった
•流行り廃りの激しい事柄について追いかけるのは人と
同じことをするだけ…などと考えていた

81. エンジニアへの憧れ
•エンジニアが激しくアウトプットをし、多くのはてブ
を獲得し、影響を与え、社内で話題になる
•この流れが羨ましかった
•デザイナーもそういう挑戦のしがいがある課題があれ
ば…などと考えていた

82. そもそもデザインって
どういう研究テーマがあるんだろう

83. 社内イベントでチームを組んだ
エンジニアと話した

84. 晴れないモヤ
•インターフェイスとかインタラクションとか
•今あるものは認知科学者の人間中心設計の提唱によっ
て生み出されたものの延長線上みたいな感じで…
•うーん、作ったものの使い方わからんって言われるの
嫌だよねえ
•人間の仕組みとか興味あるんだよね

85. 晴れないモヤ
•会社で示されているデザイナーの分布図というのもあ
るけど、多岐に渡りまくってて
•んー究極に言えばじいちゃんばあちゃんでも難なく使
えるようなものを作りたい
•驚かせたいし、逆にスムーズすぎて気づかれないみた
いなのも最高

86. …ん？
•UI、それに伴う見た目、人間の仕組み…
•自分が好きなのって、これでは？
•「わからない」をなくしたい

87. 広義の「デザイン」から
ピンポイントで突き詰めていく

88. ようやくキャリアプランが

89. 自分がどうしたいか

90. なにをしたいか

91. 何が好きなのか

92. 自分の道が見えてきた

93. 見えたとたん

94. 好きなことに関する知識が
表面的であると知った

95. 人間の仕組みとか、UI論とか
見た目に関する知識とか
自分のやってきた範囲以外
全然何も知らない…

96. 底は見えないほど深い…

97. 自分の能力の位置の認識ができた

98. 準備したアウトプットの入り口
•ようやくブログ作れた
•自分の好きなことについて、とにかく自分の好きなよ
うに外に向けて発信していく場として定義した
•面白いのはこれからだ！

99. 天才じゃない問題
•クライミングも伸び悩み楽しくなくなってやめた
•デザインも自分に厳しくなければ能力も伸びず自己満
足で終わってしまう…
•でもデザインだけはやめたくない
•大好きなんだ

100. 自分の今後の課題
•好きなことの「強力な武器化」
•能力向上・実績積み上げ・経験値増加がまだまだ全然
•自分への甘さを克服しないといけない

101. まとめ

102. 「根幹にあるもの」

103. “いつだってどうなるかは自分次第”
•正直、大きく回り道をした
•もう30過ぎた
•でも”手遅れ"など存在しない
•これからどうなるか、あくまでそれは自分次第である

104. “つながりを広げ、視野を広げよ”
•ひとりでできることなどたかが知れている
•いろいろな人と接し、つながることで気づきも視野も
広がる
•学びも大きくなる

105. “本当に好きなことを貫け”
•自分が本当に好きなものは何か？
•モヤを晴らし、はっきりと見つめること
•それが好きだと胸を張ること
•そしてそれを貫くことを恐れないこと
•そして恥をかくことを恐れないこと

106. 成長とは
自分自身との戦いである