feature image

2017年11月8日 | ブログ記事

Joy-Conを使って片手でひらがな入力

はじめに

こんにちは。mds_boyです。
この記事は、traP AdventCalendar2017の17日目の記事です。

Joy-Con

突然ですがみなさん、Joy-Conって知ってますか?
Nintendo Switchに付属している、本体に接続・分離が可能なコントローラーです。
(サムネ画像はJoy-Con(R)(公式サイトより))

このJoy-Con、PCでBluetooth接続出来ます。(参考)

ご覧の通り片手で入力できるため、これを使って文字入力が出来たら面白そうですね。
というわけで、Joy-Con(R)で文字を入力できるWebページを作ってみました。(リンクはこちら)
この記事ではそれについて紹介したいと思います。

注意

入力できるのはひらがなだけです。
また、Joy-Con(L)はボタン配置が違うため対応していません。

環境

使用した言語はJavaScriptです。
また、Joy-Conの入力を取るためにGamepad APIを使用しています。
GanePad APIを用いると、ボタンの入力、スティックの入力を取ることが出来ます。
ジャイロセンサーや赤外線センサー、HD振動といったJoy-Conの特徴的な機能は現時点では使えないようです。

操作方法

今回の目標

今回目標とするのは

これらを満たす入力方式にすることです。

Joy-Conのボタン配置

まずはJoy-Conのボタン配置について確認しておきましょう。
公式サイトにこのような画像があります。

正面

body-switch03-front

側面

body-switch03-side

背面

body-switch03-back

この公式の表記に従ってボタンを呼んでいこうと思います。

ボタンと対応

ボタンと対応は下のように決めました。

Joy-Con(R) 対応
スティック 8方向移動
ZRボタン 決定
Rボタン 濁点等
Bボタン 戻る/削除
Aボタン 空白
SL/SRボタン 「わ」に移動
+ボタン ツイートする

入力の流れ

主にスマートフォンでの文字入力に採用されているフリック入力を参考にしました。

まず、デフォルトでは「な」の位置が選択されており、そこから8方向に向けてスティックを倒すことで「あ」~「ら」を選択出来ます。
「な」を選択したい場合はRボタンを押すかスティックを押し込みます。
「わ」を選択したい場合はSL/SRボタンを押します。
masu-2

四方に文字が出てくるので、選択したい文字の方向に倒すことでその文字を入力することが出来ます。
デフォルトの文字を入力したければRボタンを押すかスティックを押し込みます。
masu2-3

ここで選択する前後(ただし次の文字を選び始める前)にRボタンを押すことで濁点/半濁点/小文字などに切り替えることが出来ます。

このようにして入力していきます。
newAdC

問題点

無事入力方式を決定しましたが、いくつか問題点があります。

8方向への入力が失敗しやすい

Joy-Conのアナログスティックは小さいため、斜め入力しようとしても思った通りの方向に行かない場合があります。
元々8方向入力は誤入力の元になると思って4方向のみにして選択していたんですが、時間がかかってしまうため8方向の入力に変更しました。
ここは一長一短なので、どちらが良いとも言い難いですね。

親指が忙しい

Joy-Conをパッと見てみると、下の丸で囲まれた部分は全て親指でしか押すことが出来ないことがわかります。
joycon_oya

つまり、これらは同時に押すことが出来ないだけでなく、これらを多用してしまうと、親指を常に移動させる必要が生じてしまいます。
しかし、ボタン数の関係からA/Bボタンを採用せざるを得ませんでした。

慣れないと入力しにくい

これは仕方ないですね。
慣れてください。

まとめ

というわけで今回はJoy-Con(R)でひらがなを入力する方式を考え、Webページを作ってみました。
短時間で作ったため十分に検討しきれたとはいえず、より良い入力を考える余地があると思います。
まあでもやっぱりJoy-Con(R)で文字を入力するのは色々と厳しいですね…

最後になりますが、入力に限らずゲーム制作等全体で大切なのは、

ということだと思います。

明日はshanalさん、rencon_manさんの記事です。

mds_boy icon
この記事を書いた人
mds_boy

ゲーム制作や競技プログラミングをしています

この記事をシェア

このエントリーをはてなブックマークに追加
共有

関連する記事

2017年11月14日
IBIS2017参加報告
Keijan icon Keijan
2017年11月17日
そばやのワク☆ワク流体シミュレーション~MPS編~
sobaya007 icon sobaya007
2017年12月26日
RustでMCMC(Metropolis-Hasting)
David icon David
2017年12月13日
チズケ破壊論
whiteonion icon whiteonion
2017年12月1日
WaltZ
Double_oxygeN icon Double_oxygeN
2017年11月4日
文章をよしなに分散表現しよう
David icon David
記事一覧 タグ一覧 Google アナリティクスについて 特定商取引法に基づく表記