ツールバーのメインボタンの動作

Issue #81 closed
MonthlySpecial created an issue

現在、

  • 左クリック: ツールバーの位置や表示形態の変更
  • 右クリック: グループ選択

となっていますが、

  • 左クリック: 選択やアクション。また、比較的頻繁な操作
  • 右クリック: プロパティなど。また、比較的まれな操作

という大まかな原則とは、どちらかというと、逆ではないでしょうか。

ツールバーの [テキストを表示する] にしていて、ツールバーのグループを頻繁に切り替えたいのですが、グループ名付きで表示されているメインボタンが「いまはこのグループを表示中で、クリックすると変更できるよ」と言っているように見えて、また、UI 上のオブジェクトとしての面積も大きいので、どうもついメインボタンを左クリックしてしまいます。


別 Issue になると思うのですが、包含されて関連するので書いてしまうと、

  • ツールバー上のメインボタン

    • 左クリック: グループ選択
    • 右クリック: ツールバーの位置や表示形態の変更
  • ツールバー上のランチャボタン

    • 左クリック: 実行
    • 右クリック: 現行のドロップダウンメニュー

で、ランチャボタンにはドロップダウン用の小さなボタンがないほうが、一貫性や操作性がよいのではないかと思いました。

Comments (10)

  1. sk ☃#QQ repo owner

    課題内容と関連内容をまとめて回答します。

    まず記憶も定かではありませんが時系列順にその時のノリを説明していきます。 (履歴を追うと内容が前後してるかもです)

    1. 右クリックについて。 右クリックメニューで表示されるコンテキストメニューでは 現在のコンテキスト≒グループの状態を選択させる認識でした。 まずこの認識で実装を開始しました。

    2. ランチャボタンについて(本節では以下 ボタン)。 ボタンを押下することによりボタンに紐付くファイルの起動処理を実装しました。 その次に欲しかった機能としてファイル一覧やパス関連の機能を実装するためにボタンにメニュー用の▼を付与しました。 なぜ▼でボタンのメニューを表示したかというとすでに右クリックはグループ変更用だったからです。

    3. テキストについて。 ランチャボタンにテキストを追加した際に文字列等が決まっておらず余っていたメニューボタンに現在グループ名を表示するようにしました。 グループ名を表示するようにした時に、指摘されているグループ変更処理をメニューボタンにテスト実装してみました。 実装して試したところグループ変更にわざわざカーソルを端っこまで移動させるのがだるかったのでオミットしました。

    4. ディレクトリアイテムの実装。 ▼でファイルメニューを実装していたので処理流用で▼とアイコンの間の区切り線が無いランチャーボタンとして ディレクトリメニューを実装しました。

    さて、このような事情で

    • 左クリック: ボタンの押下
    • 右クリック: グループ選択のコンテキストメニュー

    となっており、 (メインボタンはともかく)ディレクトリアイテムの実装でそのアイテムが 実行可能なものなのか展開するものなのかを区別するため▼の区切り表示は必要だと認識しており、 実装上ボタンの大きさはあえて同じにしているので▼はデザイン上の都合から外すことはできません。

    で、結局何が言いたいんだという話になってくるので結論を。

    • 右クリックはグループ選択にしたい(移動がだるい)。
    • ▼はあまり外したくない(デザインだけの都合)。

    ただメインボタンに対してグループ選択機能を(左クリックのメニュー展開時に)実装するのは可能です。

    要はただ単に私の慣れです。

  2. MonthlySpecial reporter

    経緯について説明していただいて、ありがとうございます。

    ただメインボタンに対してグループ選択機能を(左クリックのメニュー展開時に)実装するのは可能です。

    していただけると、たいへんありがたいです。

    (メインボタンはともかく)ディレクトリアイテムの実装でそのアイテムが 実行可能なものなのか展開するものなのかを区別するため▼の区切り表示は必要だと認識しており、 実装上ボタンの大きさはあえて同じにしているので▼はデザイン上の都合から外すことはできません。

    これについては、展開可能アイテムにだけ▼があるのではなく、どのボタンにも▼が表示されていることによって、肝心の「どれが実行可能で、どれが展開するものなのか」わからなくなってしまっているように思います。

    あと、横長ツールバーに実行可能アイテムが並んでいるとき、▼の左に区切り線があるので、▼が、その右のアイテムに所属しているのか、左のアイテムに所属しているのか、あいまいになっているように見えました。

    pe_buttons.png

  3. sk ☃#QQ repo owner

    ただメインボタンに対してグループ選択機能を(左クリックのメニュー展開時に)実装するのは可能です。

    していただけると、たいへんありがたいです。

    問題の切り分けとして#84を作成しました。


    あとは表示上の話ですね。

    UIに関して困ったときはOS標準。 桁違いのUX調査しているMSを盲信しましょう。

    IE-exp.png

    エクスプローラ(Win7)とIE11ですがようわからんですね。

    [☺|▼][␣☺|▼] ボタンの左側にちょっとpadding追加で見易くなるかもです。

    描画処理の改善で右下(⏌)を強調するのも良しです。

    深く考えずに回答するならこんなところです。

  4. MonthlySpecial reporter

    問題の切り分けとして#84を作成しました。

    ありがとうございます。

    ▼については、やはり、すべてのアイテムに付いていて役割を縦線の有無で区別するというのが無理筋に思えて、最初に記したとおり、右クリックが直下のアイテムのコンテキスト メニューになっていないという点に帰結すると思うのですが… しかし「右クリックはグループ選択」が前提という背景については、説明いただいたおかげで理解いたしました。

  5. sk ☃#QQ repo owner

    関連になりますが #41 により現状ボタンサイズがデブになりました。

    レイアウトを整えるためとはいえ▼が微妙に癌になってまいりました。

    padding.png

  6. sk ☃#QQ repo owner

    課題のclose権限を有するのは報告者ですが古い課題でまだ閉じられておらず、 追記も無いようですのでこちらでcloseさせていただきます。

  7. Log in to comment