ショートカットキーが身につくアプリ Shortype の version 1.0.0 をリリースしました
はじめに
こんにちは、えにしテックの佐藤大介（AudioStakes）です。
現在参加しているフィヨルドブートキャンプの自作サービス課題として「ショートカットキーが身につくアプリ Shortype」の version 1.0.0 をリリースしました。
Shortype は「キーボードから手を離さず作業できるようになりたい」というモチベーションで開発してきました。
3週間前にプロトタイプをリリースしており、その作成過程は ショートカットキーが身につくアプリ「Shortype」のプロトタイプをリリースしました に記載しています。
この記事では、プロトタイプから磨きをかけてきた Shortype の特徴を紹介します。
Shortype とは
Shortype は、クイズに答えるだけで自然とショートカットキーが身につく Web サービスです。
※右下の黒いオーバーレイに実際にタイプしたキーを表示
動作環境として、ブラウザは Google Chrome もしくは Microsoft Edge、OS は macOS に対応しています。
操作はショートカットキーをタイプするだけ
出題内容にあったショートカットキーをタイプする（入力する）だけで、問題が次々に進んでいきます。正解したときはそのまま次の問題へ進み、不正解だったときは画面に表示された正解を入力します。
この繰り返しにより、自然とショートカットキーが身につく仕組みとなっています。
このシンプルな操作「Shortcut key を type する」はサービス名 Shortype にも反映しています。
公式ドキュメントのショートカットキーを完全網羅
練習できるツールは「Google Chrome」と「macOS の Terminal」の2つがあります。どちらも公式ドキュメントに掲載されているショートカットキーをすべて出題しています。
ツールの選択は「T キーを押す」もしくは「『ツールを選ぶ』ボタン」から行えます。
※ 正解判定できないショートカットキーは「自己採点」という形で出題しています。
身についていないショートカットキーの出題頻度が自動的に高まる
回答するたびに正解判定の結果がブラウザに保存され、その正答率をもとに「身についたかどうか」がショートカットキー単位で判定されます。全体としてどれくらい身についているか、円グラフと表で確認できます。
右の表は、円グラフをマウスでホバーすると表示されます。
「身についたかどうか」は、出題頻度の調整にも使われます。身についていないショートカットキーは出題頻度が自動的に高まります。
この仕組みにより、手間をかけることなく、苦手なショートカットキーを重点的に練習できるようになります。
※ 出題頻度の調整は、未回答のショートカットキーがなくなった後に開始されます。それまで、未回答のショートカットキーが最優先で出題されます。
※ 正解判定の結果はブラウザの localStorage に保存されます。
身につけたいショートカットキーに絞って練習できる
公式ドキュメントのショートカットキーの中には「すでに覚えている」「興味がない」といったものも含まれているかもしれません。
そのようなショートカットキーに対し、R キーを押して「次から出題しない」と設定できます。
これにより、身につけたいショートカットキーに絞って練習できるようになります。
「キーボードから手を離さず作業できるようになりたい」という方々に使ってほしい
Shortype は「キーボードから手を離さず作業できるようになりたい」というモチベーションで作り始めました。
僕自身が Shortype を使ってみた結果、たしかに「ショートカットキーが身についた」という実感があります。以前より、キーボードから手を離さず作業できるようになりました。
同じようなモチベーションを持つ方々に、使ってもらえたら嬉しいです。
これからやりたいこと
Shortype の開発は version 1.0.0 のリリースを1つの区切りとしています。しかし、より多くの方々に Shortype を使ってもらえるように、時間を見つけて改善していきたいと考えています。
今のところ、次のような改善案があります。
練習できるツールを増やしたい
VS Code や macOS のショートカットキーなど、個人的に普段の開発作業で扱うツールも練習できるようにしたいと考えています。
「出題しない」としたショートカットキーを個別に戻せるようにしたい
現状は、「出題しないリストを空にする」という機能で「出題しない」としたショートカットキーを一括で戻すことができます。
「個別に戻したい」というケースもあると思うため、対応したいと考えています。
最後に
Shortype の開発にあたり、毎日の朝会で進捗内容1つ1つに親身なフィードバックをくださった @darashi さんと @snoozer05 さん、丁寧なデザインレビューでアプリの見た目を見違えるほど良くしていただいた @machida さん、データ設計やコードレビューでとても勉強になる改善案を教えていただいた @yoshitsugu さん、進捗報告会や日報・Discord 等でコメント・リアクションしていただいたみなさま、本当にありがとうございます。
自作サービス開発にチャレンジしたことで、とてもたのしく、学びのある日々を過ごせました。
Shortype を使ってみて何か気づいたことがある方は、 GitHub の Issue や Twitter にご連絡いただけますと、励みになります。
