web-dev-qa-db-ja.com

スパイラルスクリプトに相当するスクロールバーに相当するものは何ですか?

私の友人の1人は、内側かららせん状に読み取られるスクリプトを使用する人々についての架空の物語を書いています。彼らは柔軟な素材の長いコイルに書き込み、長いテキストはコイルをらせん状の経路に送る機械装置に送られます。ハンドルを回してらせんを回転させ、テキストを進めることができます。

明らかに、それらはコンピューターを搭載できるほど技術的に進歩しており、私の友人は、コンピューターが私たちのコンピューターとはどのように動作するかを理解するのを手伝ってほしいと思っています。私たちは、長方形の画面ではなく円形の画面を使用することを決定しました。さまざまなユーザーインターフェイスのメタファーをどのように適用するかについては、多くの興味深いアイデアがありました。

とにかく、ページスクロールのしくみを理解するのに苦労しました。つまり、1つの画面に表示できる以上のテキストがある場合、テキストのさまざまな部分を表示するには、どのようにスクロールする必要がありますか?

私はデモを作成しましたスパイラルで表示されたテキスト(英語ですが、そのように設計されたスクリプトでそれを想像してください)方法)ページの上部に水平方向のスライダーがあり、スパイラルを内側または外側に回転させることができます。 (これが animated demo です。

screenshot of spiral text

これの問題は、水平(または垂直)スクロールバーがスパイラルテキストの悪い比喩であることです。らせんの周りに円形のスクロールバーを使用することを考えましたが、それが使いやすさの点で優れているかどうかはわかりません。

私はまた、円を描くようにクリックしてドラッグし、反時計回りにスパイラルを内側にスクロールし、時計回りにスクロールして外側にスクロールすることも考えましたが、これはテキストの距離を示すものではありません。とにかく、円形のクリックとドラッグが良いアイデアかどうか確かめてください。

スパイラルテキストはどのようにスクロールする必要がありますか?

17
Peter Olson

enter image description here

22
Roger Attrill

2003 Ubisoftビデオゲーム Beyond Good&Evil では、プレイヤーはスパイラルインターフェイスを使用してテキストを入力します。

Screenshot from BG&E

これがビデオです: http://www.youtube.com/watch?v=euquOpUmUyk

このUIに関するいくつかの観察:

  • 文字は常に直立して表示されるため、読みやすくなります。しかし、これらの人々は、さまざまな角度で読むために最適化されたスクリプトを設計する可能性が高いので、問題ではないかもしれません。
  • 文字は、遠くにあるか、近くにあるかに関係なく、同じサイズのままです(図に示すように)。これは読みやすさにも役立ちます。
  • 各アイテムは単なる文字である必要はありません(「消去」および「検証」オプションで示されています)。これはユーザーインターフェースですが、スクリプトとして、この人々のスクリプトのグリフは西洋の言語よりもアジアの言語のように機能する可能性があることを示唆しています。たとえば、1つのグリフはコンテキストや向きによって意味が異なります。 (つまり、テキストをスクロールすると、単語の意味が変わるということですか。そのように機能するスクリプトを適切に記述できますか。ループ内のどこで他のグリフに関連しているかによって、単語が組み合わされて異なる文が形成されますか? )
  • らせん状のループができるので、一度上に到達すると、再び下に戻ります。これは入力に最適です。それは読書にとって何を意味しますか(そしてそれは現実の世界では物理的に可能ですか?それはデバイスのコイルがどのようにループバックするかに依存すると思います)
  • 「スクロール」はなく、適度に一定の速度で前後に移動します。これはおそらく、目には見えないでしょう(人間にとって-これらの人々はおそらく、私たちとは異なる方法でデータを解釈するように進化したでしょう)スクロールバーのような正確なコントロールを使用するよりも、読み取り専用ではないnot読み、代わりにスキップしたい過去のものをスピードアップします。しかし、おそらくテキストをスキップする方法が必要でしょう。おそらく、2番目のスイッチでコイルをより速く動かすことができますか?
  • 現在の選択が強調表示されます。理にかなっているUIのために、おそらくそれを読むためには、一種のブックマークとして役立つでしょうか?

BG&Eが8年前のゲームでこのUIを提供しているにもかかわらず、私が知っている他のどのゲームもそれをコピーしていません。ただし、驚くほどうまくいきました。それがいくつかの有用である質問を見てうれしいです!

10
Rahul

他の人が示唆しているように、これらの人々は、クランク、サムホイール、またはノブなど、連続的な円運動を提供する入力デバイスを持っている可能性があります。

etch-a-sketch

Flickrのfimoculous からの画像。

人気のある子供のおもちゃの基礎を形成するかもしれないが、彼らはおそらく私たちのマウスを非常に不自然だと思うでしょう。 :-)

ドキュメントのどこにいるかを示すには、スクロールバーを取り、それを円の外側に巻き付けるのが理にかなっていると思います。

良いインスピレーションの源は Tony FadellのNest Learning Thermostat で、ノブと丸いタッチスクリーンで構成されています。

Nest Learning Thermostat
(ソース: nestthermostat.net

8

この社会がスパイラルスクロールで進化した場合、おそらく彼らの歴史的テクノロジーに対応するユーザーインターフェースで進化しました。結局のところ、私たちは紙や皮膚の巻物で物事を読んでいたため、「スクロール」と呼んでいます。彼らにとって、彼らはコイルを読むので、アクションは「コイリング」と呼ばれ、インターフェースも同様に機能する必要があります。

直線的に読むためには、ステレオダイヤルやホイールの回転など、何らかのツイストインターフェースがあることを期待します。

あるセクションから次のセクションにジャンプするには、線の読みやすい部分をスキャンし、正しい場所にいることを示すマーカーが表示されるまで、らせん状に外側にジャンプすることを期待します。これは、ホイールをZ軸に沿って押したり引いたりするか、ジョイスティックのように動かして上下に動かすことで処理できます。おそらく、押したり引いたりするとドキュメント全体が拡大または縮小され、上下に移動すると行をジャンプできます。 (そしてツイストを使用すると、線がある場所から線を読み取ることができます。)1回転が全回転ではなく、設定された長さの線に等しくなるようにツイストをマッピングします。そうしないと、螺旋。

スパイラルのビューは、あなたが最初からどれだけ離れているかにコンテキストを与えます。テキストを遠くまで見ると、読んでいるテキストの限られたビューの中で、らせんの線が平行線のように見えます。このような社会で育った私は、曲率を検出することに対する人々の認識が鋭敏であることを期待します。曲線が多いほど、テキストの始まりを意味します。平行度が高いほど、テキストが深くなります。

また、各セクションの始まりを示すマーカーがテキストにインラインで表示されます。ズームアウトすると、中心を基準にしてマーカーが表示されます。どちらが前にあるかを正確に見つけることは、程度が異なる可能性があるため、簡単には識別できませんが、それは獣の性質です。

6
Taj Moore

いい質問だ。

スクロールバーのメタファーは、テキストがどの程度遠くまであるかを示しているので、まだ役に立つと思います。ただし、代わりにインタラクティブな「円グラフ」を使用してこれを行うことができます。パイの1つの「口」の端をドラッグするだけで、0%から100%の間になります。円グラフが100%完成すると、テキストの最後になり、0%になると最初になります。これが私の素早い汚い例です。 enter image description here

はい、これはスクロールバーが占める1行よりも多くのスペースを必要としますが、すべてがらせん状に行われている世界では、その制限内で作業する必要があります。

5
JonW

スクロールにはホイールを使用しますこのスパイラルテキスト。なぜなら、私にとっては、スライダーがスパイラルに対して配置されている場所の手がかりを得ることがより重要だったからです。

ホイールがあれば、好きな場所で掴むことができます。たとえば、北を掴んで、右に南に回転させます。スパイラルは、ステアリングホイールと同じ速度と同じ方向に動くと予想します。そして、より良い読みやすさを得ます。

(回転する)スパイラルは無限にあるので、テキストがどのくらい続くかについての情報は必要ないと思います。

5
FrankL

テキストをスクロールする代わりに、スクロールバーでテキストのサイズを変更して、より多くのテキストが表示されるようにすることができます。スクロールバーをさらに右、テキストが小さくなると、より多くのテキストを表示できるようになります。テキストが小さすぎて読めなくなった場合は、ユーザーに画面に近づくよう通知するだけです。また、小さい部分にズームインするズーム機能を提供できますテキスト。

3
Matt Rockwell

ここでの答えは、スクロールバーから離れて、マウスのスクロールホイールまたはラップトップのタッチパッドから借りることです。基本的に、インターフェイス上の位置は、タッチスクリーンが通常行うように、画面上の位置に1対1で対応していません。

私の考えは、らせん状のテキストはタッチスクリーン上にあり、それに沿って指をスライドさせると、物理的なホイールの場合と同じようにらせんが回転します。テキストのスパン/ズームは、回転するときに発生する可能性があります。このようにして、ユーザーはそれをスパイラルの任意の側でスクロールバーとして扱うか、手を円状に動かすなどできます。

マウスホイールのようなスクロールバータイプのインターフェイスよりも優れた点があり、指が画面上にある場合はテキスト内の位置とは相関しませんが、スクロールバーはそうであり、非常に正確な照準が必要です。テキスト。

3
Izkata

古典的なマルチタッチスクロール(非古典的な方法で使用)は、理想的な解決策のようです。より一般的には、テキストの「ドラッグ」を可能にするタッチベースのインターフェイスです。アイテムの「ドラッグ」をタッチまたはプルするだけで、まさにこのような「スパイラルスクロール」を使用する多くのビデオゲーム(特にWario Ware)を見てきました。たとえばWario Wareでは、画像がらせん状に歪んでいて、ユーザーが画像をらせん状に「引っ張る」ことで、画像が正しく形成されます。

これは、現在のマルチタッチのようにスクロールするだけで、テキストのスパイラルに適応させることができます。ページの「粒子」の有無。主な違いは、「グレイン」が上または下ではなく、スパイラルに沿っていることです。これは、トップダウン/レフトライトリーディングよりも計算がはるかに複雑ですが、そのようなテキストを操作する論理的な方法です。

2
Ben Brocka

らせん状のコンテキストでは、ズームと同じようにスクロールを検討できます。そう:

  • ポインティングデバイスの場合、一般的なズームボタン([+] [-])を使用できます(ズームインしてそこに移動するように)スパイラルの中心からさらに多くのテキストを表示します。別の方法として、ズームインアクションをスパイラルセンターにマップし、ズームアウトを外部ゾーンにマップし、マウスの近接を使用してテキストを移動することができます。

  • タッチデバイスの場合、ピンチジェスチャーを使用できますズームインおよびズームアウトします。

2
Pau Giner

以前の答えは技術的または正しいものだったかもしれませんが、同等のものを探すべきではなく、本を読むという目標を達成するための別の方法です。それがあまりにも馴染みがあるか、非常にiphoneyである場合、デバイスの独創性またはエイリアンエッセンスを殺します。私の答え:奇妙でありながら馴染みのあるもの、たとえば、機械式乳首やアイトラッカーのように機能するもの:リーダーが画面の中央を見るとテキストが戻り、リーダーを上に見るとテキストが前に進みます。また、以前のすばらしい答えのそれほどまとまりのない混合が機能し、機能的な正当性とエイリアンファクターを与えます。

2
alfa64