指ごとに練習できるタイピング練習サイトを作りました
生きることにこだわりを。魚住惇です。
2023年にClaudeと言う名前のAIを出会い、それまでChatGPTに課金し続けてきたのをやめて、ずっとClaudeを使い続けてきました。現在はProプランの年間払いの2年目です。特にClaude Codeというツールが素晴らしくてね。直接ローカルのファイルをいじってくれたり、今ではGitHubのリモートリポジトリを直接編集してくれて、別ブランチにコミットやプッシュをしてくれるので、ここ最近の僕の仕事はプルリクを見ながらマージするかどうかを判断するだけです。
さて、先週の3月19日が勤務校の終業式でした。そして昨日は新入生が保護者と一緒に来校する合格者出校日が行われ、春休みに入るものの新しい年度がすぐ始まろうとしています。僕なんかは合格者説明会で新入生の保護者に購入してもらうタブレット端末の説明を行う係なんかをやったので、もう緊張しまくりでしたよ。
先日、やっと勤務校でコンピュータ室を情報Ⅰの授業で使わせてもらえるようになりました。タブレット端末を1人1台持っていながら、どうやって学校のコンピュータ室を活用するのか。僕はここの大きなポイントは、フルサイズのキーボードだと思っています。GIGAスクールタブレットのキーボードはどれもキーボードが小さいんですよ。もう僕としてもこれが一番のストレスです。何が学習用端末だ。タイピングもまともにできないじゃないか。と思うのです。
コスト削減としては一番成功しているんですけどね。生徒らが持ち運びやすいように本体が小さくなり、でも安く作るために本体はやや分厚い。当然ベゼルは太い。こうして出来上がって一番影響を受けたのがキーボードです。
僕はね、タイピングに並々ならぬこだわりがあるんですよ。あれ?聞こえませんでした?この魚住、タイピングには並々ならぬこだわりがあるんですよ(2回目)。タイプライターが登場してから150年あまり経ちますが、この時代にもまだなくなりません。というか生成AIが登場したことで原点回帰したかのように、今まさにキー入力が重要になってきている感じを肌で感じています。タッチタイピングができないと、AIくんとまともにお話ができません。
タイピングが遅い原因のほとんどが、タッチタイピングが習得てきていないことです。タッチタイピングが習得できていないということは、どの指でどのキーを押すのかに迷いが生じたり、手元を目視で確認しながら入力することがあるということです。
これに何が問題かというと、まず入力を行うということは、文章を書くということに等しい行動です。文章を書くということは書く内容を頭で考えて、「よし書こう」と思った内容が頭の中にあるわけです。キーボードで入力している途中に「あれ、あのアルファベットはどこだっけん?」なんて思ってしまったら、その考えが頭を過ぎる分、脳に負荷がかかるんですよ。
ただでさえ文章を書くという行為には脳のリソースが必要だというのに、入力による負荷がかかってしまったら更にストレスがかかります。人はストレスを嫌うので、当初考えていた文章がそのまま入力できないとなれば、同じような内容で文字数が少ないものを入力することで、タイピングを終えようともします。
これが手書きで紙に書いていたとして漢字が思い出せないという場合があったとしましょう。この場合は感じが思い出せないのなら平仮名やカタカナで書けば済む話なので、書き続けることができるんじゃないかと考えられます。ただしタイピングはローマ字の組み合わせが分からなければ入力そのものができないわけなので、タイピングが速ければ速いほど全体的に有利になり得るのです。
正確にタイピングするための条件
では、正確な指でタイピングするためには何が必要なのか。これを順番に考えていきたいと思います。
指が正確に動かせる
何をそんなって思うかもしれませんが、意外とこれができない人が多いんだなというのが、現任校でタイピングを指導してみた結果、分かったことでした。
例えば、人差し指から小指までの4本の指が、それぞれ違ったキーの上にセットしてあるとします。さぁ今から押すのは「人差し指」だ!と頭でわかっていても、実際にキーを押した指が中指だったなんていう光景を多く見てきました。いやいや、どゆこと?だって人差し指を動かすだけなんでしょ?なんでそれで他の指が動くの?僕自身も未だに信じられません。ですが確かにいるのです。指の名前を間違えて覚えているわけでもなく、指の名前が通じないわけでもないのに、自分が思った通りに指が動かない人が意外と多いのです。
思えばゲームのコントローラとて、すべての指は使いません。主に使うのは親指・人差し指・中指が中心で、薬指や小指はグリップを握るために使います。ピアノなどの楽器を習わない限り、すべての指をまんべんなく制御するような場面は生活していてそうそうありません。だからこそ訓練が必要というわけです。
僕自身は小学校4年生ごろまでピアノを習っていたので、比較的小指を動かすことは苦労しなかったんだろうなと思っています。因果関係があるとは断定しにくいのですが、おそらく役には立っているんだろうなと推察します。
運指が身体化できている
学校から支給されている教職員用タブレット端末や生徒用タブレット端末の管理者権限のパスワードを、僕はぱぱっと入力することができます。ところが、そのパスワードを紙に書こうとすると、「あれ?なんだっけ?」となります。打てるけども書けない。そんな現象が確かに起こるのです。不思議な現象です。つまりは感覚ではそれができているが、言葉では説明できないようなことになっているのでしょう。
大学時代には、聴覚障がい者の学習支援ボランティアとして、PCテイクという活動をしていました。教授が話した内容を即座に入力して、PCの画面に表示させていました。タッチタイピングを競った人たちは口をそろえて「耳から脳を通して指先に信号を伝えるのでは遅いんだ。熟練者は耳から手に直接信号を伝える。大事なのはこの感覚なんだ。」と話していました。今思えばこれが身体化というもので、頭で考えなくともその動きができるようになるということを意味するのだと考えられます。
言葉よりも先に手が出ると表現すると聞こえが悪くなるんですが、タイピングに必要なことはむしろこれで、理想は思った瞬間にその内容が画面上に表示されていることです。僕は今、頭の中でしゃべっている内容が画面上に出ています。ローマ字入力であっても「指がしゃべっている」という感覚が自分にはあります。タッチタイピングができる人にとってその感覚が当たり前であるならば、それはタッチタイピングに必要なスキルであると思うのです。
指ごとの動きに特化した練習を行う
先ほどの2つの条件をまとめるとこうなります。
「指を正確に動かすことができて、それが身体化されている」
これってどうやって練習したら会得できるのでしょう。もっと正確に言うと、どのサイトやツールを使えば、そんな練習ができるのでしょうか。
僕がこれまで練習に使ってきたサイトやアプリは、過去にブログ記事で紹介したことがあります。
コンピュータ室で大活躍する無料タイピングソフト5選 - さおとめらいふ-魚住惇のブログ
そして、コロナ禍に出会った新たな選択肢として、プレイグラムタイピングというサイトが結構有益だなと個人的には思っています。
小学生から始める無料のローマ字タイピング練習アプリ | プレイグラム タイピング
どこかで話したかもしれませんが、このプレイグラムタイピングの作者の方とはクラブハウスというアプリで知り合った仲でして。そんなご縁もあって僕が杏和高校に勤務していた時代に記事にしていただいたことがありました。
愛知県立杏和高等学校様 | 導入事例 | Playgram Typing プレイグラムタイピング
ただどうしても、特定の指だけを練習するようなアプリというのが、現在気軽に使える状況にありません。一応選択肢がなくはないのですが、ちと初心者にはクリアするには難しく感じることもあり、これから1からタイピングを練習しようとする人の心が折れてしまうものがほとんどです。
また、寿司打をはじめとするタイピング練習サイトのほとんどは、単語や文章を打つというスタイルが多く、正確な指によるタイピングに重きを置いていません。これも僕としてはモヤモヤするポイントです。2つの条件を満たすための練習を行うアプリ、もしくはサイトが必要なのです。これが3つ目の条件だと思ったのでした。
さて、今はAIの時代です。サイトやプログラムを作ることが、以前と比べて格段に楽になりました。そう、ないものはね、作っちゃえば良いんですよ。作りました。ええ作りましたとも。今回もちょっとしたこだわりに、お付き合いください。
じょうほうらいふタイピング
「無いものは作ればいい」という実に工業高校らしい言葉がありまして。今回も作りました。指ごとの練習にフォーカスを当てたタイピング練習サイトです。mikatypeの影響も受けていて、横方向、つまり段ごとの練習モードも入れました。数字だけ練習したい、QWERの段だけ練習したいという要望にも応えました。あとはアルファベットAからZまでをひたすら打つのも用意しました。
そして左手の各指の練習モード、右手の各指の練習モード、両手の各指もそれぞれ用意しました。どの指がどのキーを担当するのかを練習するためには、それらの指でとにかく担当するキーを押しまくりしかないと思うんですよ。なのでとにかく担当する指でキーをひたすら押すためのモードを作りました。まさに「この指の担当する場所はここだよー」っていうのを指に叩き込むわけですね。
実際のゲーム画面がこんな感じです。これは太鼓の達人をイメージしました。6歳の息子がタイピングを楽しくできないか考えた結果、キーを押している時にリズムが生じて、打っているだけでタンタンタンとテンポが良いという感覚になってくれたら良いなという考えに行きつきました。要は練習している時の心地良さ重視ということです。
太鼓の達人と同じように、右から左にキーが流れてきます。指ごとに色が分かれています。画面下にはキーボードの絵柄があるのでそこを見ながら練習することもできます。ちなみにキーが流れてくる部分の真ん中にはタイミングを合わせる境界線がありますが、そこよりも早くキーを押してもパーフェクトとして判定されます。これが音ゲーだったら早いタイミングで叩くと良く無い判定になるわけですが、これはタイピングゲームなので「早く押せたということは良いことだ」という考えに基づいて判定されます。
その代わり、タイミング良く押せたり、境界線よりも早く押せた場合は、キーが出てくるタイミングが早くなります。これも動体視力や画面描画の負荷を考えて、キーが流れてくる速度そのものは変えずに、流れてくるキーの数、密度を上げることで対応しました。
ではキーがこの境界線を過ぎてしまうとどうなるのか。その場で全体の流れが止まり、キーが押されるまで待ってくれます。極力失敗させない。タイピングゲームが嫌なものだという思い出にさせないための最大限の配慮です。多少過ぎてしまっても、時間がかかっても、目的のキーが正しい指で押せたのならそれでいいんですよ。練習の段階ではね。いけないのは、早く打たないとと焦りながら担当しない指で押してしまうことです。
最初は誰もが正しい指で押せないんですよ。最初は全然遅くても大丈夫だから、それでも正しい指で押せるようになること。速度は後から勝手についてきます。世の中にあるタイピングゲームは、ユーザーを焦らせすぎなんですよ。ああ!これ打たなきゃ!早く打たなきゃ!みたいに焦らすから、正しい指で押すことの優先順位が勝手に下がります。そうじゃない。早くなる時は勝手に早くなるんです。でもそのためには一定期間は修行が必要で、その修行をどこまで簡単に、そして継続しやすくするのかを考えたんです。
そして、メインメニューには切り替えられるモードが2種類用意してあります。1つはに鬼モードです。この鬼モードをONにすると密度がMAXになり、最初からギチギチに敷き詰まった状態でキーが流れてきます。魚住の実力でも鬼モードランダムは途中で無理だなと思いました。もう1つがランダムモード。これはデフォルトがオンになっています。多くのタイピングゲームに組み込まれている設定をデフォルトとしたつもりです。指ごとの練習においても、そのまま始めるとキーがランダムに流れてきます。
ランダムをOFFにすると、段ごとモードなら左から順に、指ごとモードなら上から順にキーが流れてきます。要は指の体操です。次に指をどこに動かすのかが予測しやすいので、割と早い段階で指の動きが習得できると思います。ランダムをOFFにすると、例え鬼モードだとしてもクリアしやすいんじゃないかと思います。
指ごとのモードを実装して、実際に授業で生徒たちに使ってもらっていると、様々な改善案が出てきました。鬼モードも実はその1つです。タイピングをある程度習得している人にとって、初期の頃のじょうほうらいふタイピングはやっていて面白くなくて、かったるい感じだったそうです。そもそもターゲットが違うのでその感覚も正しいんですけどね。
なので彼らに「欲しいモードがあれば教えてくれ。追加しよう。」と声をかけてみたところ、「単語の一部のアルファベットが隠された状態でタイピングすると学習効果があるのでは?」という意見が出たので採用してみました。英単語モード実装の始まりです。単語を隠す度合いを3パターンに切り替えられるようにして、中学1年生から中学3年生までとミックスのモードを用意しました。単語は検索して出てきた単語リストなどを流用しました。ランダムで出題されるわけですが、動詞を必ず3割ほど入れるようにしたので、見たことがある単語が比較的登場するはずです。
細かいことで言うと、タイピングゲーム全体で流れてくる文字は大文字で統一していたんですが、単語モードだけは表示されるアルファベットを小文字にしました。こちらの方が視認性が上がると思ったので。画面下部にあるキーボードは大文字のままです。打つべき文字が小文字であっても、キーボードの刻印は大文字ですから。うちの学校に通ってくる生徒でも打つべきキーを迷わないよう工夫しました。
まだ頭の中には構想としてあるものの実装していない機能がいくつかあります。例えば熟語モード。「A piece of ○○」と画面に表示されてcakeと入力させるようなモードがあれば、ヒントを頼りに熟語を連想できて、それをタイプさせることができると思うんですよね。あとは日本語の単語や文章のモードもいつかは実装したい。ただこれは単語の登録がアルファベットのようにはいかず、ローマ字の組み合わせもいくつか判定できるパターンを用意する必要があるので、判定ロジックに工夫が必要だなと思っています。
僕の場合はこうしてタッチタイピングを無事習得でき、パソコンでメモを取ることにも抵抗がなくなりました。むしろタッチタイピングしている方が喋っている感覚で文章が画面に出てきます。生成AIとチャットしている時だって、画面上で口で話すよりも早いスピードで入力しているので人間と会話するよりも速いスピードで濃密な会話ができるんですよね。多分隣で見ていると気持ち悪いと思いますよ。いつか音声入力が当たり前になればキーボードそのものがレガシーになる、なーんて言われていた時期もありましたけどね。僕が見る限り、QWERTY配列のキーボードはまだまだ現役で、AIの登場によってよりタッチタイピングの需要が高まってるんじゃ無いかと確信しているわけですよ。
読み書きそろばんと同じように、タイピングはもはや必須スキルです。でも「慣れてきたら自然と速くなるから」とか適当なこと言ってる大人の、なんと多いことか。これは鉛筆や箸と同じ、訓練ですから。でもちゃんとできている人の割合が、本当に少な過ぎ。同じ情報の先生であっても、商業の先生であっても、工業の先生であっても、ちゃんとホームポジションを守って入力できている人を探す方が難しいのが現状です。
それから、自作キーボードのようにオーソリニアな配列のキーボードでの練習も推奨します。指の動きの感覚を身体化するためのタイピングですから相性は良いと思うのです。
どのモードにチャレンジしても、最後にはランク判定が表示されます。判定そのものは割と甘くしてあります。少しでも練習すればあっという間にSランクです。これも勤務校の生徒らが自己肯定感を少しでも上げてくれるための工夫です。Claude Codeを使って、自分が欲しいなと思うものをまた1つ増やしてみました。タイピング練習を通して少しでもコンピュータへの苦手意識がなくなってくれたら幸いです。
今回のnewsletterは以上となります。あーー、またこの世の中に、素晴らしいものを1つ作ってしまったわ。でもまだまだ完成には程遠いと思うので、もしじょうほうらいふタイピングに実装して欲しい機能などがありましたら、まずは応援の意味も込めて「いいね」を押していただいて、コメント等で教えてください。




