TECHSCORE BLOG

クラウドCRMを提供するシナジーマーケティングのエンジニアブログです。

アゲカツとcopywork ~ 写経や100本ノックに代わる?プログラミング勉強法

エンジニアリングマネージャーをしています、小野寺です。 当社には能力開発のための学習を推奨する文化があり、私のチームでは自身の成長のために学習する活動、通称「アゲカツ」を行っています。これはチームのケイパビリティ向上のための「アップデート活動」に由来していて、「アップデート(=上げる)活動 → 上げる活動 → アゲるカツどう → アゲカツ」とメンバーが言い始め、今ではすっかり定着しています。

f:id:techscore:20200626161903j:plain:w80 小野寺 俊也(オノデラ シュンヤ)
2015年3月入社のエンジニア兼エンジニアリングマネージャー
岩手県出身 / コーヒーが好き

最近は在宅勤務しているので仕事前にコーヒーを淹れています。ケメックスというドリッパーとサーバーがくっついたようなものを愛用しています。豆はコストコのスタバシグネチャがコスパいいです。緑のほうがさっぱりしていてブラックでも飲みやすいです。赤は重めの味わいなので、アイスコーヒーやミルクと合わせるのがおすすめです。

学習時間を予算化して取り組む「アゲカツ」

「アゲカツ」という名前と取り組みは定着しているものの、その活動内容はチームで試行錯誤しています。2019年はいくつかのテーマに絞り、それぞれゴールを決めて計画的に取り組みました。1年間やってみて、チーム全体のベースアップをすることができましたが、課題も見つかりました。

  • テーマに決めたもの以外に取り組みたくなった
  • ゴールが成果だと取り組みづらい

ということで、2020年は次のように変更して取り組んでいます。

  • テーマは自由
  • ゴールを成果ではなく、学習時間の予算に変更

なぜ学習時間の予算を設定したかというと、理由は2つあります。
1つ目は、成果はコントロールできないためです。たとえば、ある能力を身につける目的と算段を持って技術書を読むとします。しかし、その技術書を読み終わっても期待していた成果にならなかった、ということもあるでしょう。
2つ目は、予算にすることで時間を生み出す工夫が必要になるためです。「20%使っていいですよ」から「20%使ってください」にすることで、「忙しいからできなかった、仕方がない」ではなく、「忙しいけどどうにか時間を作ろう」という能動的な状態になるのではないかと思っています。

運用を始めて半年が経ちましたが、いまのところ月1回の共有会で取り組みを発表しつつ、上手く時間を作りながら、技術書やビジネス書を読んだり、オンラインイベントに参加したり、各々取り組んでいます。メンバーの一人である東さんは、コピーワーク(copywork)という聞き慣れない方法でアゲカツに取り組んでいます。先日 copywork について東さんがLTをする機会がありました。ここからは東さんにバトンを渡し、LTの発表内容をそのまま紹介してもらいます。




copywork のすゝめ

f:id:techscore:20200701175110p:plain

エンジニアの東です。自己紹介は↑の通りです。
最近は TypeScript で React 書いたり Node.js 書いたりしています。
コロナの影響でずっと在宅勤務となり時間に余裕があるので、

f:id:techscore:20200709104113p:plain

10年ぶりぐらいに「鋼の錬金術師」というマンガを読みました。
仕掛けとドラマと中二病設定がいい感じにブレンドされててとても面白いので、ぜひ読んでください。 イーブックジャパンで全27巻、11,911 円です。

さて本題です。

f:id:techscore:20200701175119p:plain

今日は copywork のすゝめとおいうお話をします。
エンジニア向けの内容です。

copywork との出会い

ちょっと前に copywork という言葉を知りました。
今日は copywork とはどんなものか、
copywork は楽しいよ、役に立つよ、みんなでやろうよ、
ということをお伝えできたらな、と思っています。

f:id:techscore:20200701175129p:plain

この記事で copywork という言葉を知りました。
勝利への近道:copywork で React を学ぶ、とあります。
この記事は copywork という手法を使って React を学ぶ、ということを段階を追って説明していて、React に特化して書いてあります。でも copywork という考え方はReact 以外にも使えるんじゃないか、ソフトウェア開発、特にコード実装の部分のスキル向上に役立つんじゃないかと思います。

copywork ってなに?

f:id:techscore:20200701175137p:plain

これから少し copywork という言葉そのものについて見ていきます。
この記事の中で、正確にはこの記事が参照している記事の中なんですが、こういうことが書いてあります。

copywork は作家や画家が長年使ってきた技法です。
自分のスキルを向上させるために、既存の作品をできる限り厳密に再現するプロセスです。[筆者訳]

つまり、copywork とは模倣であり、模写のことです。

作家や画家はすでに存在する名作といわれる作品をお手本にして、それをマネて再現することで、 その名作に使われている技法を学ぶということを昔ながらにやってきました。

もう少し調べてみます。

f:id:techscore:20200701175141p:plain

copywork で画像検索してみるとこんなものが出てきます。
書き方練習帳みたいなやつですね。うすく文字が印刷されててそれをなぞるとか。
つまり、copywork には、練習、手習いと言ったほうが僕はピンと来るんですけど、 そういう繰り返して練習するという意味もあります。

f:id:techscore:20200701175145p:plain

ということで、 copywork とは、既存のサービスを模倣して再現することを、繰り返して手になじませる、ということを通じて、 実装スキルを向上させる活動の一種です。

実装スキルを向上させる活動として馴染み深いものに写経とか100本ノックとかがあります。
copywork はこの並びに入るものなんですが、すこし守備範囲と言うか得意分野が違うかなと思います。

copywork をやってみる

f:id:techscore:20200701175149p:plain

さて、copywork は単純に既存のサービスを模倣するものなんですが、 次の3点を押さえておくと、効果的に効率的に copywork できると思います。

  1. 道筋に沿って実施する
  2. よく知っているサービスを選ぶ
  3. テーマを決めて、記録する

順に説明していきます。

f:id:techscore:20200701175154p:plain

copywork はこの3段階に沿ってやっていきます。
まず、ターゲットとなるサービスをよく観察して理解します。
次に、サービスの構成要素を分解して、どのように作るかを定義します。
最後に、実装して、ターゲットとなるサービスを再構築します。

f:id:techscore:20200701175157p:plain

この順番は一般的なサービス開発とそんなに変わらないので、当たり前の流れかと思います。

f:id:techscore:20200701175201p:plain

次に「よく知っているサービスをターゲットに選ぶ」ですが、 模倣するのは

  • 普段良く使っている
  • 挙動やできることをよく知っている

サービスにしてください。Twitter とか Gmail とか。
そうすれば、理解が速いし、その理解もぶれが少ないので、この理解の段階が、スムーズに進みます。

実際、やりたいことは実装スキルの向上なんですね。
なるべくなら上位よりも下位の段階の方に重心を置きたいです。
理解の段階は素早く、後戻りがないように抜けてしまいたい。
そのためにはよく知っているサービス、自分が使い込んでいるサービスを模倣のターゲットに選ぶのがいいかと思います。

f:id:techscore:20200701175204p:plain

3番目、コツの最後の「テーマを決めて、記録する」ですが、copywork を通じて

  • どんなスキルを獲得したいか
  • 何を試したいか

明確に決めて、記録するというのが大事だと思います。

テーマは小さいことでもいいんですが、漫然と作るのではなく、事前に何を学びたいのか、明確に決めてから始めるのが良いと思います。
また、作っているうちに次々とわからないことが出てきます。
それを1つ1つ解決しながら実装していくのですが、解決したことを記録するのが良いと思います。
後で振り返ることにも使えますし。

copywork は楽しい

f:id:techscore:20200701175208p:plain

写経、100本ノック、copywork を簡単に比較してみます。
写経、100本ノックはお手本とかテキストの教材が必要ですが、copywork は不要です。
ただ、写経、100本ノックに比べて copywork は多少のスキルが必要です。
そして、写経、100本ノックは実践的かというとうーんって感じです。
で、これ一番大事です。写経、100本ノックは楽しくないんですね。だんだん飽きてきて面倒くさくなっちゃうんですよ。
でも copywork は楽しいと思います。自分が普段使っているサービスを真似るのって結構楽しいんです。仕組みとかいろいろ想像するし。

f:id:techscore:20200701175213p:plain

さて、最後のスライドです。
copywork は既存のサービスを模倣して再現することです。
copywork は理解、分解、再構築の3ステップを意識して行なうといいです。
そして copywork は楽しい。
ぜひ皆さんやってみてください。やったら教えて下さい。

ということで以上です。ありがとうございました。


f:id:techscore:20200701175221p:plain

LTをやってみて

というようなことを実際に5分間の LT でお話しました。 zoom 越しのオンライン LT だったので、リアルタイムの反応は分かりづらかったのですが、後で「共感した」「やってみたい」などのコメントをいただきました。少しずつ copywork 仲間が増えていっています。

技術解説書を読んで理解したつもりになっていても「いざ実践!」となるとどうしていいかわからなくなったり、細かなところであれれとなることは多いと思います。copywork の考え方で来たるべき実践(実戦)の機会に備えましょう。