← ブログ一覧へ戻る

AucKit v0.2.45 公開:全機能サジェスト検索とアクセシビリティ強化

AucKit v0.2.45 公開:全機能サジェスト検索とアクセシビリティ強化

AucKit v0.2.45を公開しました。今回のアップデートは設定画面のUI/UX全面強化がメインです。

機能数が30を超えてきて「あの機能どこにあったっけ?」となる場面が増えてきたので、全機能を横断検索できるサジェストボックスと、サイドバー・カードの色分けで目的の場所に最短到達できるようにしました。

1.全機能サジェスト検索

設定画面の右上に検索ボックスを設置しました。

検索ボックスに「西濃」と入力するとドロップダウンが表示される様子

機能名・機能ID(英字)・説明文のどれにマッチしても候補に出ます。

たとえば「西濃」と入力すると、現在表示中のタブが「マイオク・出品画面」であっても、別タブ(取引・発送画面)にある西濃運輸カンガルー・マジックⅡ 連携がドロップダウンに表示されます。タブを行き来して探す手間が不要になりました。

マッチ箇所のハイライト

入力した文字列にマッチした部分はオレンジでハイライトされます。複数キーワードの該当箇所を視覚的に確認しやすくなっています。

クリックでタブジャンプ+ハイライト

候補をクリックすると、その機能があるタブに切り替わり、該当行までスクロールし、行が黄色いアウトラインで2秒間ハイライトされます。

クリック後にタブが切り替わって該当行がハイライトされた様子

キーボード操作

  • /キー: 検索ボックスに即座にフォーカス
  • ↓ ↑: 候補を上下に移動
  • Enter: 選択した候補にジャンプ
  • Esc: 検索をクリア

サジェストの中身

候補はタブ別にグループ化されて表示されます。一度に大量の候補が出ても見やすい配置になっています。

「入札」検索で複数タブの結果が表示される様子

検索対象は機能のON/OFF項目と、不要要素を隠す項目(全70件)の両方を網羅しています。

2.設定画面のアクセシビリティ強化

サイドバーの選択中タブが明確に

選択中のタブが白カード+左に青ライン4px+青文字+太字で強調されるようになりました。

サイドバーの選択中タブが白カードで強調された様子

これまでは選択中とそうでないタブの差が分かりづらく、複数機能を行き来する作業で「今どこを見ているのか」が一目で判別しにくいケースがありました。

機能カードのON/OFF色分け

機能のON/OFFが視覚的に明確になりました。

  • ONの機能: 青系背景のグラデ+左に青ライン3px +機能名が青文字
  • OFFの機能: 薄ベージュ背景+透明度を下げて控えめに表示

「今、何が動いているか」が一瞬で把握できます。

警告機能の強調

「出品取消の確認スキップ」など、誤操作リスクのある機能はオレンジ背景+オレンジライン+⚠アイコンで強調されます。便利だが慎重に使うべき機能を一目で識別できます。

3.西濃運輸住所フィールドの実文字数対応

「カンガルー・マジックⅡ」連携で住所を貼り付ける際、30字を超える住所が正しく分割できないケースを修正しました。実文字数(全角=1字、半角=1字)ベースで分割するロジックに置き換えています。

4.インストール・更新

Chromeウェブストアからの自動更新が順次配信されます。手動更新したい場合はchrome://extensionsで「更新」ボタンを押してください。

まとめ

項目変更
全機能サジェスト検索新規追加(/キーで即フォーカス)
サイドバーactive強調白カード+青ライン
ON/OFF色分けON=青系、OFF=薄表示
警告機能の強調オレンジ+⚠
西濃住所の文字数実文字数ベースに修正

設定画面を開いて/を押し、お試しください。ご意見・ご要望は@までお気軽にどうぞ。