橋本 Hashimoto   Baku

橋本 Hashimoto   Baku

Tweak (Scratchpad)

This page is a personal scratchpad.

#Coinage

Tweeq に結実

普通にDirect Manipulationと呼ばれていることも多そう

反復的なクリックやキーボード入力を経ずに、一度のなめらかな入力で値を微調整(tweaking)する操作、またその機能

  • 制作ツールの多くは、数値インプット上を左右にドラッグすることで、値を連続的に調整することができる
  • 通常、tweakしている最中の値のアップデートはヒストリーに記録されず、tweak前後での値の変更が一度の操作として記録される
  • デザインにおけるパラメーターのチューニングを高次元空間上を移動しながら「よさ」の目的関数を最大化するものとして捉えて、空間の計量をデザイナーにとって探索しやすいものに作り変えていくために、UIを適切に構造化する必要gあある
    • HIDのアナログ量を活かす
    • クリックやモードの切り替え(ポップアップや異なるインプットの往復等)を最小化する
  • 「UIは探索空間の計量を規定する」
    • https://x.com/_baku89/status/1848878071585378521
    • フィッツの法則におけるコスト関数が「ポインティングデバイスで指したい領域を指すためにかかる時間」だとすれば、tweakが最小化したいのは「パラメーター空間上のある領域にデザインするオブジェクトを遷移させるためにかかる時間」

Photoshopのブラシは、コントロールパネル上のスライダーまでカーソルを移動させずとも、キャンバス上を Ctrl + Alt + ドラッグで半径とぼかしを変えられる。この場合、カーソルの2次元の移動量をつかって2つの値を同時にtweakしているとも言える。( 入力の並列化)

パラメーターを調整したいとき、その都度フォーカスし、値を消し、再入力してフォーカスを外すという動作を繰り返すのでは、試行に時間がかかる。一方、tweak機能には次のようなメリットが考えられる

  • 素早さ: ポインティングやクリックといった予備・予後動作を1つに集約することができる
  • 連続性: 「もう少しだけ大きく」といった感覚をそのままアナログにUIに伝えることができる

実装例

カラーピッカー

いちいちクリックししてポップアップ画面を開くのも面倒くさいし、常にサイドパネル上に表示させていおくのも邪魔だし、もう少し素早く操作できたら良いのに、と思っていた。「ちょっと明るくする」「ちょっと色相を回す」といった相対量での調整をより素早く行える。より厳密に調整したい場合は、クリックすることで見慣れたポップアップ画面を開くことも可能

関連項目