web-dev-qa-db-ja.com

テキストエディターで同様の機能を提供する複数の方法

私は、強力でカスタマイズ可能な機能を提供するテキストエディター(Webアプリ)に取り組んでいますが、外観は最小(要件)です。

関数の1つは、「新しいスニペットを作成する」です。この関数を次のいずれかに適用したい:

  • 現在のドキュメント内の選択されたテキストのチャンク、選択されたテキストを含む新しいスニペットが作成されることを意味します
  • テキスト全体、つまり、現在のドキュメントに含まれるテキスト全体を含む新しいスニペットが作成されることを意味します
  • 空のコンテンツ、つまり、空の新しいスニペットが作成されます

(選択されたテキスト、ドキュメント全体、または空のコンテンツへの適用性に関して)同様の動作が必要な他のいくつかの関数があるため、スマートなminimalの一貫した解決策が本当に必要ですこの。

私の質問は、前述の要件を満たすために、可能な限り最も直感的で摩擦のない方法で、どのようなUIインターフェースを提供する必要がありますか?

私が検討しているいくつかの解決策(しかし、私は完全に満足していません):

  • ユーザーがテキストを選択(強調表示)すると、ツールバーがポップアップし(medium.comのものと同様)、選択したテキストに適用可能なアクションが(ラベル付きアイコンの形で)表示されます。次に、ユーザーは「スニペットの作成」というラベルの付いたアイコンをクリックすると、選択したテキストを含む新しいスニペットが作成されます。ユーザーがテキストを選択せず​​にキャレットの位置を変更する意図なしにテキスト内をクリックした場合(つまり、キャレットを1回クリックした場合)、前述のツールバーがポップアップしますが、ユーザーがラベルが付いた「スニペットの作成」をクリックするとアイコン、空のスニペットが作成されます。テキスト全体を含む新しいスニペットを作成するには、ユーザーはドキュメントのすべてのテキストを選択するだけです。 (このソリューションは、明らかに、ユーザーが自分の意図を伝える唯一のインターフェースとしてポップアップツールバーを使用しようとします。別名:ユーバーミニマル。これはプラスです)

  • 上記と同じですが、ユーザーがテキスト内をクリックするだけでツールバーがポップアップすることはありません。 「空のスニペットの作成」機能を提供するには、非表示のサイドバーにラベル付きの「スニペットの作成」アイコンを提供します。 (このソリューションは、さまざまなニーズに対応するために、ポップアップツールバーとサイドバーの2つのインターフェイスを提供します)

  • テキストの選択時にポップアップするツールバーを提供しないでください。代わりに、非表示のサイドバーに「マークスニペット」というラベルの付いたアイコンのみを提供します。クリックすると、カーソルアイコンが新しいアイコンに変わり、ユーザーがテキストのどの部分を選択する必要があるかを示します。 「新しいスニペットの作成」という別のアイコンも表示され、新しい空のスニペットが作成されます。 (このソリューションでは、ユーザーが意図を伝えるための唯一のインターフェースとしてサイドバーを使用します)


あなたの提案は何ですか?

「スニペット」の概念にあまり重点を置かないでください。ソーシャルメディアで「テキストの一部または全体を共有する」など、他の機能も必要です。

注:ポップアップツールバー(medium.comスタイル)は、最小限であるため(つまり、すべて表示されてエディターウィンドウが煩雑にならないため)とても気に入っています。時間)と、ユーザーのマウスポインターが配置されている場所の非常に近くに表示されるため、迅速です。その欠点はおそらく、新しいユーザーが見逃す可能性があることです(そして、ユーザーは何か新しいものの機能を発見することに忍耐力がほとんどありません)。

1
Alexandros

選択したテキストに基づいていること。

  • 選択なし=新しいスニペット
  • すべて選択=すべてのスニペット
  • 選択されたセグメント=選択されたセグメントのスニペット

右クリック機能をハイジャックしてメニューを提供するか、マウスオーバーで提供することで、セレクターを提供できます。ユーザーベースが慣れているUIパラダイムに応じて、タスクを実行するための少なくとも2つの手段が常に必要です。それがコア機能である場合は、メニューバーなどで使用できるようになります。

最小限のUIが理想的ですが、手頃な価格も望まれることを忘れないでください。アプリケーションのアフォーダンスが失われるほど設計を最小限にしたくはありません。

1
slyimperator