分12手際よく値を設定したいパソコンやスマホのアプリ上で各種の値を設定することがありますが,スライダで細かい値を正確に設定することは困難です。Xの色設定画面のように0~255の数値を設定するだけの場合でもマウスで正確に値を設定するのは難しいので,図1のように数字を入力するテキストボックスが別に用意されています。数字を入力するテキストボックス秒単位で時刻を設定したいような場合は事態はさらに絶望的です。設定可能な値は24×60×60=86,400通りあるにもかかわらず,スライダのドット数は数百程度しかありませんから,1ドットスライダを動かすだけで値が何百も飛んでしまうことになります。このため,細かく時刻を指定したい場合は時間/分/秒を別々に指定するのが普通です。値を細かく設定したい場合がある一方,大まかな値をすぐに設定したい場合もあります。時刻を10時ちょうどに設定したい場合,前述のようなシステムでは時間を10に/分を0に/秒を0に設定する必要がありますが,このようなキリの良い時刻を指定したい場合でも分や秒まで細かく指定するのは面倒です。キリの良い値はもっと簡単に設定できるようになっていてほしいものです。このように,一般的なスライダやスクロールバーでは細かく値を調整したり大まかな値を設定したりすることが簡単ではないのですが,スライダやスクロールバーの挙動を工夫すればこういった問題を解決できる可能性があります。微調整のインターフェースGUIで値を微調整するためのさまざまなインターフェースが昔から研究されています。普通のスライダで秒単位で時刻を設定することが不可能なのであれば,微調整専用のインターフェースを追加すればよいでしょう。スライダやスクロールバーにボタンを追加し,ボタンを押したら最小単位ずつ位置を移動させられるようにしたものがよく使われていました(図2⁠)⁠。ボタンで微調整可能なスライダスライダのノブを拡張して,微調整を可能にしたシステムもあります。リックした位置によって微調整/粗調整を選べるようになっています(図3⁠)⁠。Sliderというシステムでは(図4⁠)⁠,スライダのノブ以外のバックグラウンドをクリックするとゴム紐のようなものが出現し,マウスでゴムを引っ張るような動きをすることによってノブ位置の微調整を可能にしていました。マウスカーソルがノブの近くにあるときはノブがゆっくり動き,遠くにあるときは速く動きます。FineSlideriPhoneの音楽再生アプリでは(図5⁠)⁠,再生時刻を指定するためのスライダをタップしてから指を下にずらしてスライドすると,ずらさないときよりも細かく時刻を調整できるようになっています。場所をおおまかに指定するキリの良い時刻を簡単に指定したり図形をきちんとそろえたりするためには,微調整とは異なる手法が必要です。図形を動かして隣の図形にぴったりそろえるような操作をしたいときは「スナッピング」というテクニックがよく使われます。スナッピングとは,ドラッグ中の図形が別の図形やグリッドの近くに来たときそこにぴったりそろうように移動するもので,ユーザが正確でない操作をしても意味のある場所に移動させることができるので便利です。スナッピングは図形編集ではお馴染みのテクニックですが,キリの良い値にパラメータを設定するような場合でも利用できます。10:00かっきりに時刻を合わせたい場合や,次の曲や次のチャプタに動画を移動させたいような場合にも使えます。音楽や動画を見る場合でも,次の曲やチャプタの1秒前から再生したいような場合,スナッピング機能で次の場所に移動してから微調整操作で1秒戻りたくなるでしょう。スナッピングのようなおおまかな操作の恩恵を受けつつ微調整も可能であるという巧妙なインターフェースが欲しいところです。SmoothSnap遠くに旅行する場合,目的地の近くの空港まで飛行機で飛んでから電車やバスに乗り,最後に徒歩で目的地まで行くことができます。このように,移動の必要があるときは,移動する距離によって移動の速度や粒度を変えることによってさまざまな場所にうまく移動できるようになっているわけですが,スライダやスクロールバーにおいても同様の方針が使えればいいでしょう。iPhoneの微調整機能もあまり直感的とはいえませんし,そういう機能があることに気付く表示もありませんから,この機能を知らない人も多いと思われます。単純に,現在と同じ方法で自然にスライダやスクロールバーを操作するだけにもかかわらず,おおまかなスナッピング動作や微調整を可能にするためにSmoothSnapという手法を開発しました。SmoothSnapでは次の方針で値や位置をコントロールします。Appleなどで働く。携帯電話に搭載される日本語予測変換システム『POBox』や,iPhoneの日本語入力システムの開発者として知られる。ユーザインターフェースの心理学』。2019」を開催しました。DAY1・DAY2の様子を注目セッションとともにお伝えします。LINEのエンジニア3名がイベントに先駆けて見どころを紹介します。コードの安全性・安定性を高める開発サイクル~テスト管理の効率を上げ,脆弱性診断を自動で行う~本連載では,連載「業務を改善する情報共有の仕掛け」を受けつつ,安全性・安定性を加えた開発サイクルについて考えていきます。若者世代から圧倒的な人気を誇るライブ配信&動画投稿コミュニティアプリ「MixChannel」(ミクチャ)の裏側(レコメンドシステムやサーバサイド開発など)について解説していきます。その他の連載CSS3アニメーションでつくるインターフェイス表現CSS3によるアニメーション表現を紹介していきます。その中でも,幅広い読者に応用してもらえるだろうインターフェイスを主なお題とします。MySQL道普請便り本連載では,MySQLを使ったアプリ開発・運用に関するノウハウをご紹介していきます。RecipeUbuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。JavaScriptセキュリティの基礎知識JavaScriptに関するセキュリティ上の問題はどこで発生し,どうすれば防ぐことができるのか?について解説していきます。〜システムをきちんと運用するための基礎知識システムは「作って終わり」ではなく,運用の中でさまざまな問題が発生します。問題の発生に備えて事前にどのような対応をしておくべきなのか,問題発生時に何をしなければならないのか,ポイントを解説していきます。きたみりゅうじの聞かせて珍プレーソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。Linuxのメンテナンスの傍ら,Linuxやオープンソースソフトと日々を過ごす著者が,その魅力とつきあい方を,エッセイ風味でお届けします。PRESS特別編集部員,さわやか笑顔のスーパーハカーはまちちゃんとネット大好き14歳わかばちゃんが,毎号,読者の皆さんから寄せられたおたよりを紹介します。皆さんの日頃の悩みにも答えちゃいますよ。]メールでのお知らせメールで次の案内をお送りしております。メールの配信を希望する方は,利用したい項目をチェックしてメールアドレスを入力し,[登録]ボタンをクリックしてください。UPDATES[ほぼ週間に1回]新刊メールマガジン[ほぼ週間に1回]電脳会議の各号案内[ほぼ1ヵ月半に1回]※変更する場合や停止する場合は,登録情報変更ページをご覧ください。※登録いただいたメールアドレスには,そのお知らせ以外,配信いたしません。Ltd.ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。