TEA-WORKSのウェブログ tag:tea-works.com,2009-05-17:/weblog//1 2009-05-17T03:03:22Z デザインやコンピューター、及びティー・ワークスの業務に関連する事柄を綴るウェブログです。ご意見ご感想等ございましたらwebmaster@tea-works.comまでお気軽にお寄せください。 Movable Type Pro 4.24-ja iPhone向け産経新聞の気になる挙動 tag:120.29.185.238,2008:/weblog//1.44 2008-12-14T06:28:00Z 2009-05-17T03:03:22Z iPhone向け産経新聞。コンセプトは素晴らしいが、操作面で少し気になるところがある。拡大表示とページ送りのときの挙動が、他のアプリケーションと違うのはなぜか。また、読み進める方向はデジタルメディアを意識したものなのか。 TEA-WORKS http://tea-works.com/ iPhone OS向けアプリケーションで「産経新聞（www.sankei.co.jp/iphone）」というのがリリースされていますね。
これは、その日の朝刊をiPhoneで見られるというもので、アプリケーション、データともに無料（2008年12月14日現在）で提供されています。（図1）
この配布形式など、コンセプトは素晴らしいと思うのですが、操作面でいくつか気になったところがあったので、書いてみたいと思います。

紙面の拡大表示について

表示直後は全体表示。
その後は、Safariなど他のアプリケーションと似た感じで、ダブルタップで拡大できます。（図2）
ただし同じような感じではなく、「似た感じ」です。
Safariなどでは、ダブルタップした直後、にゅーっと滑らかに拡大してゆきますが、この産経新聞では、一瞬画面が消え、その後、大きさの違う画像が表示されます。
拡大しているというよりは、拡大された画像に切り替えている？といった感じです。

ページ送りについて

紙面を表示する際、各ページのサムネールを表示して、そこから選ぶこともできますが（図3）、開いているページを画面の端までスライドすることで、隣のページに移動することができます。（図4）
こちらも、標準搭載の「写真」などとはちょっと違い、フリックではうまくいきません。
ちょうど、ホーム画面のアプリケーションを隣りの画面へ移動するときのように、画面の端まで来ると、にょこっと移動します。

先ほどの拡大表示も、このページ送りも、他のアプリケーションと比べ、挙動が微妙に違うんですよね。
このへんの動きを他とあわせるというのは、難しいことなのでしょうか。
そもそも、開発環境にライブラリーのようなものが入っていたりしないのかな。
微妙な違いですが、少し残念なところではあります。

ページ送りの方向について

通常、新聞は、左のページを右へめくってゆくと思います。（右側から左へ向かって読み進めてゆく）
これは漫画などでも同じですね。
しかしこのアプリケーションでは、ページ送りは右へ進むようになっています。
横書きが基本になっているようなコンピューターの世界では、文字は左から右へ書いてゆきますし、ページも右へ向かって進んでゆくので、デジタルメディアとしては自然だと考えられますが、新聞として考えると少し不自然な感じもします。

これは憶測ですが、制作時、実際の新聞をシミュレートする意味でも、左へ向かって読み進めてゆくことも検討されたのではないでしょうか。
しかしおそらく、実際の紙をめくるわけではないし、画面の中では1ページ単位で区切られているので、デジタルメディアとしての自然さをとったのではないかなと。
ここは興味深いと思ったところでした。
もしかしたら、普段、毎日のように新聞を読んでいる方は、違和感を持たれるかもしれませんね。

さいごに

重箱の隅をつつくような、変だと思うところばかり書きましたが、冒頭にも書いた通り、コンセプトとしては素晴らしいと思います。
そんなアプリケーションを提供してくれた、産業経済新聞社（sankei.jp）ならびに産経デジタル社（www.sankei-digital.co.jp）に感謝。

関連リンク
iPhoneアプリケーション産経新聞の紹介サイト
iTunes Storeの産経新聞のページ（iTunesが開きます）
株式会社産経デジタルのサイト
]]>
図1: 産経新聞の紙面がそのままiPhoneの画面に！


図2: ダブルタップやピンチで拡大可能。


図3: ページ一覧から見たいページを表示できる。


図4: スライドでもページ移動できるが、通常のフリック操作では少し難しい。

]]> iPhoneにもExposéやSpacesのような機能がほしい tag:120.29.185.238,2008:/weblog//1.43 2008-11-14T13:20:00Z 2009-06-09T07:22:54Z iPhoneアプリケーションが増えると、ホーム画面の数が増え、移動がだんだんと煩わしくなってくると思います。iPhoneにも、ExposéやSpacesのような機能があれば、容易に移動できるかもしれませんね。 TEA-WORKS http://tea-works.com/ iPhoneにインストールしたアプリケーションが増えると、それに比例してホーム画面の数が増え、ホーム画面間の移動がだんだんと煩わしくなってくると思います。
しかし現状ではどうすることもできませんね。
そこで、iPhoneにもExposéやSpacesのような機能があればいいな、と思いました。

現状、隣りや、隣りの隣りくらいなら、ささっと移動できますが、一番左から一番右となると、8回スライドするため、少し億劫です。
しかしExposéやSpacesのような機能があれば、「全画面サムネール呼び出し→目的の画面をタップ」の2ステップで、目的のホーム画面へ移動できるのではないでしょうか。（図1）

どのようなカタチであれ、ホーム画面の移動がしやすくなる操作方法が、いつか搭載されるといいなと。
それがOSのアップデートで実現できればGood。

おまけ

ホーム画面の移動は、スライドさせることで可能ですが、アイコン群の最下部とドックとの間をタップすることでも可能です。（図2）
うまくタップできるようになれば、スライドより少し楽に移動できるかもしれません。

おまけ2

遊びで、ちょっと動きを作ってみました。（図3 ※要Flashプラグイン）
実装されたとしても、こんな動きになるかどうかはわかりません。

]]> [図1: ホーム画面をすべて表示して移動できるようになるといい。]
図1: ホーム画面をすべて表示して移動できるようになるといい。

[図2: アイコン群の最下部とドックとの間をタップすることでも、ホーム画面の移動が可能。]
図2: アイコン群の最下部とドックとの間をタップすることでも、ホーム画面の移動が可能。

図3: 遊びで、ちょっと動きを作ってみました。
※要Flashプラグイン

]]> NumberKeyの改善案と可能性 tag:120.29.185.238,2008:/weblog//1.42 2008-09-28T03:49:50Z 2009-06-09T07:18:48Z iPhoneやiPod touchをテンキーにしてしまう、NumberKey。それの紹介と、改善してほしいところや可能性などについて。 TEA-WORKS http://tea-works.com/ NumberKeyは、iPhoneやiPod touchをテンキーにしてしまおう、というもの。（図1）
ユニークでおもしろいアプリケーションですが、少し使ってみて気になったところがあるので、紹介がてらちょっと書いてみようと思います。

キーピッチを少しでも広くできたら...

物理的な制限があるので仕方ないことだが、ボタンが小さい＆キーピッチが狭いため、指を3本ないし4本並べて使うのは、なかなか難しい（手の小さいひとならそうでもないかな？）。
手の構造上、指は横に並んでいるため、横のトータル寸法を狭くすることはできない。
しかし指の前後にはジャマなものはないので、そちらはわりと融通が利く。
そこで提案したいのが、横モードの搭載。（図2）
これでもまだ、通常のキーボードより狭くなりそうだが、少し使いやすくなるのではないだろうか。

タップ時に振動もしてみては？

現在、タップすると音が鳴るのみ。
それに加え、振動もするというのはどうだろうか。
タップ検知で振動させるのが、技術的に可能なのかはわからないが、もし可能だとしたら、オプションとして用意されていれば、利用者するひともいるのではないだろうか。
例えば、なんらかの理由により音を聞き取るのが困難、また、静かにしないといけない環境にいる、など。

テンキーの先へ...

テンキーとしてリリースされているわけだけど、もしかしてこれ、キー入力以外の制御も可能なのではないだろうか？
例えばアプリケーションを呼び出すなど。
そこで頭をよぎったのが、Optimus Pultius。
これがどんなものか、詳細は割愛するが、要するに、テンキーのようなハードウェアの各ボタンに、アプリケーション起動のような設定ができるというもの。
これがNumberKeyでもできれば、低コストで同じようなことが実現できますね。（図3）

さいごに

こんなテンキーどうだ！というインパクトはもちろんあるのだけど、それ以上にすごいと思うのは、NumberKey Connect（Mac側にインストールするアプリケーション）というのを使って連携しているということ。
上記のアプリケーション・ランチャーのように、何かテンキー以上のものになる可能性を秘めていると思います。
なんにせよ、なかなかおもしろいアプリケーションなので、気になる方は試してみるといいかもしれません。
お値段も230円（2008年9月28日現在）と、おこづかい程度で買えちゃいますしね。

おまけ

入力する際、一般のテンキーのように置いて使うのではなく、携帯電話のように手で持って親指で入力すると、入力しやすいと感じました。
お試しあれ。

関連リンク
BALMUDA design - NumberKey（NumberKeyのサポートページ）
BALMUDA design（NumberKeyの制作会社）
App StoreのNumberKeyダウンロードページ
ディスプレイキーボードOptimusに15キー版 Optimus Pultius（Engadgetによる紹介記事）
]]> [図1: NumberKeyでiPhoneがテンキーに！]
図1: NumberKeyでiPhoneがテンキーに！

[図2: 横モードを搭載するのはどうだろうか？]
図2: 横モードを搭載するのはどうだろうか？

[図3: アプリケーション・ランチャーを想定して作成した画像。]
図3: アプリケーション・ランチャーを想定して作成した画像。

]]> iPhone 3G等では画像に設定されたリンク先URLを知ることができない tag:120.29.185.238,2008:/weblog//1.41 2008-09-22T11:08:10Z 2009-05-17T03:00:06Z iPhoneやiPod touchのSafariでウェブを閲覧しているとき、リンクの上でタッチし続けると、リンク先のURLを知ることができるが、画像にリンクが張られている場合、バージョンによってはURLを知ることができない。 TEA-WORKS http://tea-works.com/ iPhone 3GやiPod touchに搭載されているSafariでウェブページを閲覧しているとき、リンクの上でタッチし続けると、リンク先へ移動する前にそのリンク先のURLを知ることができる。※1
しかし、画像にリンクが張られているときは、URLを知ることができない。※2

画像の保存機能とURLの表示、どちらが大事だろうか？

OSが1.xのときは、リンクがテキストだろうが画像だろうが、タッチし続ければURLが表示された。（図1）
しかしOSが2.xになり、画像の保存機能が付いたせいか、挙動がかわり、URLを表示することができなくなった。
ウェブページ上の画像をタッチし続けると、リンクつき、リンクなしに関わらず、図2のような選択肢が現れる。（この図はリンクつきの場合）

ウェブページ上の画像を保存できるようになったことは、素晴らしいけれど、そのおかげでURLを表示することができなくなったのは、いただけないと思う。
そこで、こうなればいいんじゃないかなぁ？という案をちょっと考えてみた。

A案: 選択肢表示でさらにタッチし続けるとURLを表示

選択肢が表示されたところで、選択肢「リンクを開く」をさらにタッチし続ける、そうするとURLがポップアップ表示される、というのはどうだろうか。（図3）
1.xのときの、「タッチし続けるとURL表示」に近い形だけど、長時間のタッチ（といってもコンマ数秒ほど）が2度も必要なので、ちょっと煩わしいかな？

B案: 選択肢のボタンにURLを表示

リンクつき画像をタッチし続けたときに表示される選択肢の、「リンクを開く」のところに、URLを付け加えるのはどうだろうか。（図4）
これならタッチし続けるのは1度ですむので、操作感は1.xのときとそう変わらない気がする。
しかもダイアログボックスのおかげで、指を離してもURLを確認できる。

さいごに

リンク先URLの表示は、あまり重要じゃないと考えられているのかもしれないけど、私は、それなりの価値があると思っています。
また、以前はできたことができなくなるのは、やはり残念なことなので、なんらかの形で復活してほしいな、と思います。

※1 URLが表示されているといっても、すべて表示されるとは限らず、表示面積の制約上、長いURLは省略されてしまう。また、この記事では、画像へリンクしている図を使用しているが、通常のウェブページへのリンクでも同様。
※2 OSのバージョンが1.xのiPod touchなどではできる。

おまけ

ブックマークレットというのを使えば、リンク先URLを取得したり、また、もっと優れたことが実現できると思います。
JavaScriptわかるよ！という方は、挑戦してみるとおもしろいかもしれません。

]]> [図1: OS 1.xではリンクが張られた画像にタッチし続けるとURLが表示される。]
図1: OS 1.xではリンクが張られた画像にタッチし続けるとURLが表示される。

[図2: iPhone 3G等のOS 2.xでは画像にタッチし続けると選択肢が現れる。]
図2: iPhone 3G等のOS 2.xでは画像にタッチし続けると選択肢が現れる。

[図3: 「リンクを開く」をさらにタッチし続けるとURLがポップアップ表示される、というのはどうだろうか。]
図3: 「リンクを開く」をさらにタッチし続けるとURLがポップアップ表示される、というのはどうだろうか。

[図4: 選択肢の「リンクを開く」のところに、URLを付け加えるのはどうだろうか。]
図4: 選択肢の「リンクを開く」のところに、URLを付け加えるのはどうだろうか。

]]> iPhoneのテンキーのラベルについて考えてみた tag:120.29.185.238,2008:/weblog//1.40 2008-09-08T07:46:25Z 2009-05-17T02:58:31Z iPhoneのテンキーには、画期的な入力方法が搭載されているが、ボタンに描かれている文字以外を記憶するのが困難だ。そこでラベル（ボタンに描かれている文字）について少し考えてみた。 TEA-WORKS http://tea-works.com/ iPhoneのテンキーには、フリック（タッチ＆スライド）して素早く入力できる、画期的な入力方法が搭載されている。
例えば「ま行」では、左が「み」上が「む」右が「め」下が「も」（図1）と、時計回りに並んでいて、それぞれの方向にフリックすれば、長押しせずとも入力ができるという仕組み。

しかし、最初のうちは上下左右に何の文字が割り当てられていたのか、なかなか憶えられない。
そこで、判断が少しでも容易になるような案はないかと、ラベル（ボタンに描かれている文字）について考えてみた。

先頭文字のみではなく、ぜんぶ描いてしまったら？

iPhoneのテンキーは、例えば「ま行」では、図2-Aのように「ま」の字のみが描かれている。
大きくて見やすいので、「ま行」だということはすぐにわかるが、「み〜も」の各方向についての情報はゼロ。

そこで、図2-Bのようにぜんぶ描いてしまうのはどうだろうか。
こうしておけば、目的の文字が「み〜も」の中にあっても、どの方向にフリックすればよいのかすぐに判断できそうだ。

ということを思いつき、実際にグラフィックソフトで作ってみたのだけれど、どうもごちゃごちゃしてしまって、かえって使いづらいのでは？とまで思えてきてしまった...。
パッと見ちょっと気持ち悪いし。（笑）
実際に使ってみたら気にならないのかもしれないけど、ユーザーが変更できる部分ではないので、試したくても試せない。
この程度のアイディアは、おそらくアップル社内でも出ていると思うので、こうならなかったということは、やはりごちゃごちゃが原因なのだろうか。

ラベル表示が自動的にかわるのはどうか？

仮に、ごちゃごちゃが原因だとしても、ぜんぶ描いてあるのは、最初のうちはありがたいのでは？
しかし位置を記憶してしまったユーザーにとっては、ジャマかもしれないので、設定でオンオフできるといいだろう。
しかし設定項目を増やすと、こんどはそちらが煩雑になってくる。
もう少しスマートな方法はないか。

そこで、最初のうちはぜんぶ表示されていて、一定の回数、入力されると、徐々に表示されなくなる、というのはどうだろう？
それも五十音すべてが同時にではなく、よく使う文字だけが消えてゆく。
また、消えるのも、条件を満たしたら即座に消えるのではなく、だんだん薄くなってゆくとか。（図3）
それから、一度、消えた文字でも、久しく使っていない文字は復活してもいいのかもしれない。
あんまり色々やりすぎると、さらにごちゃごちゃな感じになるかもしれないけど、こんなキーボード、ちょっとおもしろそうだと思いませんか。

関連リンク
アップル - iPhone - 特長 - キーボード - apple.com/jp/iphone/features/keyboard.html
]]> [図1: 「ま」を長押しして「ま行」を展開した様子]
図1: 「ま」を長押しして「ま行」を展開した様子

[図2-A: iPhoneのテンキーには先頭文字のみが描かれている]
図2-A: iPhoneのテンキーには先頭文字のみが描かれている

[図2-B: 文字をぜんぶ描いてしまうのはどうだろうか]
図2-B: 文字をぜんぶ描いてしまうのはどうだろうか

[図3: 使用頻度により文字がだんだんと消えてゆく様子]
図3: 使用頻度により文字がだんだんと消えてゆく様子

]]> iPhoneのカメラで撮る楽しみを再認識 tag:120.29.185.238,2008:/weblog//1.39 2008-07-18T07:05:21Z 2009-05-17T02:57:17Z iPhoneのカメラは非力だと思われるかもしれないが、機能が単純なぶん操作がわかりやすく、撮る楽しみそのものを再認識させてくれると思う。 TEA-WORKS http://tea-works.com/ 携帯電話にカメラが搭載されるようになって以来、年々、高性能、多機能になっていっていますね。
そこで、iPhoneのカメラはどうなのかというと、日本製の携帯電話と比べると、かなり低スペックです。
ズームもなければ撮影モードもない、それにフラッシュもない。
できることと言ったら、起動して撮るだけ。
このスペックだけ見たら、このご時世になんという非力な...、と思うひとも少なくないでしょう。
しかし、この潔さは、わざとなんじゃないだろうか？と思いました。

撮る楽しみを与えてくれる

写真を撮るときに、残りのメモリー容量を気にして解像度を落としてみたり、きれいに撮れるよう撮影モードを考えたりと、機能があるとそのぶんいろいろなことを考えがちです（もちろん常にオートというひともいると思いますが）。

しかしiPhoneの場合は、考えることも許されず、ただただ「撮るだけ」です。
この、自分ができることを「撮るだけ」というふうに単純化したことにより、「きれいに撮る」ということよりも、とにかく「撮る楽しみ」を与えてくれている、そんな気がします。

もちろん、きれいに撮れればうれしいですし、きれいに越したことはありません。
しかし、生半可に凝ろうとしてけっきょくうまく撮れなかったり、何度も撮ってみたり、あげくの果てはシャッターチャンスを逃してしまったりと、そういったことも少なくないでしょう。

iPhoneでは、凝った撮影が強制的にできなくなりますので、割り切ることができ、とにかく写真におさめるということを楽しめると思います。

理由はどうあれアップルらしいシンプルさ

この低スペックカメラにしたのは、わざとなのか、はたまたコスト面での理由か、 それとも動作速度などの問題なのか、真相は知りませんが、とにかくこのシンプルなカメラ機能を見て、なんだかアップルらしいなぁと。
その昔、アップル純正マウスがまだワンボタンだったころを思い出しました。

ここでひとつ余談。私はWireless Mighty Mouseを使っていますが、左右どちらのボタンも主ボタンに設定しています（＝ワンボタンマウスと同様）。やはり使いやすい。

「ボタンが少ないと、できる操作は限られるが、初めてでも迷いなく使える。そのほうが大切なんじゃないだろうか。」
iPhoneのカメラには、そんな思いが込められているような気がします。

関連リンク
アップル - iPhone - 特長 - 写真とカメラ - apple.com/jp/iphone/features/photos.html
]]> [図1: ホーム画面の右上にあるカメラをタップすると起動]
図1: ホーム画面の右上にあるカメラをタップすると起動

[図2: カメラアイコンをタップした直後]
図2: カメラアイコンをタップした直後

[図3: 中央が徐々に開いてゆき数秒で撮影可能となる]
図3: 中央が徐々に開いてゆき数秒で撮影可能となる

]]> Safari 3対応のCSSを使ってデザインそのままに組み直し tag:120.29.185.238,2008:/weblog//1.38 2008-06-15T10:50:18Z 2009-05-17T02:56:02Z 当サイトのCSSに、Safari 3の独自拡張や先行実装を加え、以前と同様のデザインを実現してみました。その場合のメリット、デメリット。また、他のブラウザーではどのように見えるかなど。 TEA-WORKS http://tea-works.com/ 当サイトのCSSに、Safari 3の独自拡張や先行実装を加え、以前と同様のデザインを実現してみました。
box-shadowなどを試してみたかったということもありますが、もともと、レイアウト上いくつかの問題があったので、それらを解消したいという理由もあってのことです。

以前の表示状態

透過やボカシ影を表現するためにPNG画像を使っていたので、Internet Explorer 6（Windows）など一部のブラウザーでは、意図した表示になっていませんでした。
しかし、そのほかのメジャーブラウザーの最新版であれば、ほぼ、図1のように表示されていたと思います。（図1はOpera 9での表示）

マークアップし直しでほとんどの画像ファイルが不要に

いままで使っていた背景画像は、図2のとおりですが、今回、box-shadowやrgbaを使うことにより、これらレイアウト用の画像がすべて不要になりました。
もちろん、これで以前と同じように表示されるのは、現在はSafari 3のみになりますが...。

今回、書き加えたのは、例えば以下のようなものです。

  • -webkit-box-shadow: 6px 6px 20px #a0a0a0;
  • -webkit-border-radius: 6px;
  • background: rgba(240, 240, 240, 0.6);

それでは、これをSafari 3以外で表示した場合、どのようになるのでしょう？

書き直したHTML+CSSをSafari 3以外で表示した場合

それぞれ、-webkitではじまるものに対応していないのは当然だと思いますが、rgbaへの対応について、また、レイアウトについてはどうか、いくつかのブラウザーで確認してみました。

※rgba非対応では背景色すら反映されないため、手前に通常の"background: 色指定"を記述してあります。

Firefox 3（Mac）の場合

rgbaに対応しているようで、背景色の後ろにある画像が見えています。
レイアウトもSafari 3と同様で、ボカシ影がない以外は特に問題なし。（図3）

※今回使用したのはFirefox 3 RC3のため、正式版では異なる可能性があります。また、Firefox 2（Mac）の場合は、後述のOpera 9.5やInternet Explorer 7と似たような感じでした。

Opera 9.5（Mac）の場合

どうやらrgbaには非対応のようです。
透過がないと、のっぺりした感じになりますね。
レイアウトについては、Firefox 3同様、問題なし。（図4）

Internet Explorer 7（Windows）の場合

rgba非対応でレイアウトは問題なしと、Opera 9.5と似たような感じになりました。（図5）

Internet Explorer 6（Windows）の場合

rgba非対応に加え、PNGの透過部分が青くなってしまいます。（図6）
また、この画像では切れていて見えませんが、左側では一部、重なってしまっているところもありました。
以前はハックなどを使用してむりやり表示させていましたが、いずれバージョン7へ、さらには8へと、置き換わってゆくでしょうから、今回はそのままにしておきます。

Safari 3（Mac）の場合

当然、意図したとおりの表示であり、透過やボカシ影以外にも、border-radiusにより画像を使わず角丸の表現が可能となっています。
このほか、画面右側の画像にマウスカーソルを合わせると、まわりが光ったようになりますが、これもbox-shadowによるものです。（図7）

さいごに

Firefox 3のように、rgbaに対応しているだけでも充分ですね。
現状ではSafari 3とFirefox 3くらいなので、残念なところではありますが...。
しかしそれでも、苦労して、または無理やり、ボカシ影を再現するよりも、このままのほうがスマートで良い気がします。
ブラウザーによって見栄えの印象はかなり変わりますが、情報は伝わりますので。

この結果、画像が7つ不要になって7.3KBほど減り、さらにCSSファイル自体も2.3KBほど減ったため、単純に計算して約9KBのダイエットができました。
また、"CSSオン＋画像表示オフ"の設定にしている環境でも、画像表示オンとほぼ同様の表示を得られます。

メリット
画像ファイルの数と容量の削減
CSS容量の削減
空divの除去
画像オフ設定でも背景が残るためあまり見づらくならない
背景色の変更などが容易
デメリット
Safari 3以外では意図した表示にならない
一部の環境では文字などが重なってしまうところが出てくる可能性がある

以上のように、メリットのほうが多いように感じられるので、しばらくはこの状態にしておこうと思います。

ちなみに、Windows版のSafari 3でも、Mac版とほぼ同様の表示でした。
WindowsユーザーでSafari 3未体験の方、よろしければぜひ一度お試しください。

関連リンク
Safari - www.apple.com/jp/safari
当サイトの古いマークアップのサンプルページ（参考）
]]> [図1: 以前の表示状態]
図1: 以前の表示状態

[図2: いままで使っていた背景画像]
図2: いままで使っていた背景画像

[図3: Firefox 3での表示]
図3: Firefox 3での表示

[図4: Opera 9.5での表示]
図4: Opera 9.5での表示

[図5: Internet Explorer 7での表示]
図5: Internet Explorer 7での表示

[図6: Internet Explorer 6での表示]
図6: Internet Explorer 6での表示

[図7: Safari 3での表示]
図7: Safari 3での表示

]]> Opera 9.5でショートカット変更 tag:120.29.185.238,2008:/weblog//1.37 2008-06-12T14:17:08Z 2009-05-17T02:53:08Z Opera 9.5で、シングルキーのショートカットが廃止になったかと思いきや、初期状態では無効になっているだけで、環境設定で有効にすることができました。 TEA-WORKS http://tea-works.com/ Opera 9.5の正式版がリリースされたようなので、さっそく使用してみました。

とりあえずさわってみようと、いつものように操作してみたところ...、あれ？ショートカットがなくなってる?!
zやxでのページ移動や、1や2でのタブ移動など、キーひとつだけで操作できたのができなくなっている！どういうこと!!
あのサクサク感は、ある意味、Operaを使う醍醐味でもあったように思うのに。
まさか廃止などということは...。

そこで、ちょっと調べてみたところ、どうやら仕様変更があったようです。
以下、Opera.comより引用。

Opera 9.5 disables the following single-key shortcuts, which were enabled by default in Opera 9.2 and previous. To re-enable these shortcuts, check the box marked "Enable single-key shortcuts" in Preferences > Advanced > Shortcuts.

Opera Help: Keyboard Shortcuts

「Opera 9.5では、シングルキーのショートカットは無効になっています。9.2以前と同様にする場合は環境設定で有効にしてください。」
といったところでしょうか。
ともかく廃止ではなくてよかったです。
これで安心してOperaを使い続けることができます。

それと、これ以外にも、ショートカットキーの組み合わせが一部変更されているようです。

関連サイト
Opera Help: Keyboard Shortcuts（英語）
Opera（日本語サイト）
]]> [図: Opera 9.5の環境設定]
図: Opera 9.5の環境設定

]]> iPod touchはfixed非対応 tag:120.29.185.238,2007:/weblog//1.36 2007-10-06T08:19:16Z 2009-05-17T02:53:28Z iPod touchに入っているSafariは、現時点ではCSSのposition: fixedに非対応。iPod touchでの閲覧も視野に入れている場合は、注意が必要ですね。 TEA-WORKS http://tea-works.com/ iPod touchに入っているSafariは、どうやら現時点では、CSSのposition: fixedに非対応のようですね。

当サイトでは、ホームページ以外のほとんどのページで、ナビゲーション部分にposition: fixedを使っており、いくつかの最新のウェブブラウザーであれば、画面をスクロールしても、その部分は固定されたままになります。（図1）
しかし、iPod touchのSafariでは、画面といっしょにスクロールしてしまいます。（図2）
また、backgroundのfixedにも非対応のようなので、背景画像を固定している場合も、スクロールしてしまいます。

fixedを使用する際、iPod touchでの閲覧も視野に入れている場合は、注意が必要ですね。
また、iPodアップデートなどで対応してくれることを期待しています。

一部、隠れてしまって、読めないこともあるかもしれませんが、いまのところ対応の予定はありません。iPod touchで閲覧されている方、ご了承くださいませ。

関連サイト
アップル社サイトのiPod touchのページ - www.apple.com/jp/ipodtouch
]]> [図1: 固定されたナビゲーション]
図1: 固定されたナビゲーション

[図2: 他の要素と一緒にスクロール]
図2: 他の要素と一緒にスクロール

]]> くぼみのある石けん tag:120.29.185.238,2007:/weblog//1.35 2007-06-16T05:10:00Z 2009-05-17T02:51:17Z 使っていて小さくなった石けんを貼り付けやすいよう、予めくぼみのついている石けんを、ご紹介いたします。 TEA-WORKS http://tea-works.com/ 石けんって、使ってて小さくなると、ちょっとじゃまくさくなったりしますよね。あんまり小さいと使いづらいし、かといって、新しい石けんに貼り付けようにも、すべって最初は貼り付けづらかったり...。

そこで、この石けんの出番です。（写真）

小さくなったのをうまいこと貼り付けられるよう、最初からくぼみがついています。
石けん派としては、これはうれしい出会いでした。

この商品は、無印良品で売っています。石けん派の方は試す勝ちありだと思いますね。

ところで、こういったものは無印良品でしか見たことがないのですが、他社は似たようなもの作らないのでしょうか。
数十年も石けんを作っているような老舗の会社だと、製作機械もたくさんあるだろうから、すべてを入れ替えるとなると大変なのかもしれませんね。
しかし、他社さんにもぜひ作ってほしい商品だと思います。

関連サイト
無印良品
無印良品ネットストアのバスソープのページ
]]> [画像: 無印良品バスソープのパッケージ]
無印良品バスソープのパッケージ

[画像: 無印良品バスソープのくぼみ]
無印良品バスソープのくぼみ

]]> 登録画面での半角カタカナのワナ tag:120.29.185.238,2007:/weblog//1.34 2007-03-19T12:12:08Z 2009-05-17T02:50:35Z とあるユーザー登録画面での氏名入力欄で、名前を全角カタカナで入力するものだと思い込んでしまい、登録できなかった。しばらくして、実は半角カタカナを要求していたということが判明。非常に分りづらい入力欄だと思った。 TEA-WORKS http://tea-works.com/ 先日、PASMO（パスモ）というサービスが始まった。これは、すでにあるSuica（スイカ）ような機能を持つもので、Suicaとの相互乗り入れを実現し、首都圏のJR、私鉄、地下鉄など、このカード1枚で乗り降り可能というサービスだ。私鉄ユーザーとしては、待ちに待った、という感じである。

さらに、いままでのSuica同様の使い勝手に加え、購入時に名前等を記入することで、インターネットで使用履歴などが見られるという。この機能にとても期待していた。

しかしそのユーザー登録画面で問題が...。

全角カタカナと半角カタカナどっち？

使用履歴などが見られるページをマイページと呼び、利用するには最初に登録が必要である。登録の際に入力するのは、購入時に入力した個人情報だ。

そこで、さっそくマイページのサイトへアクセスし、登録を試みる。しかし何度やっても登録できない。入力内容も間違っていないのに、なぜ？？？？

何度もやってみたり、時間をおいてまたやってみたりしてもダメ。注意書きもひととおり目を通したし...、と思ったら、思わぬワナを発見！

氏名の入力欄があるのだが、最初に「氏名（カタカナ）」とあるのに、名の入力欄のうしろ（右側）に、「（半角カタカナ）」とあるのを発見してしまった。（画像1）

結局、半角カタカナを入力したら無事に登録できたが、非常にまぎらわしい上に、一般にインターネットでは半角カタカナは非推奨とされているのに、どうしてこんなふうになっているのか理解不能だ。

半角カタカナを採用したのはプログラムの都合なのかもしれないが、そんなこと人間様には関係のないことなので、ちゃんとつくってほしいと思う。

理想は、ひらがな、カタカナ、半角カタカナ、どれでも入力可能とすることだけど、せめて、カタカナならカタカナのみと、統一してほしいところ。

PASMOのサイトは、ほかにもわかりづらいところが見られ、デザインレベルの低さがうかがえる。サイトもサービスもまだ始まったばかりだが、リニューアルに期待したい。

追記2007年3月23日: PASMOのサイト、加筆された？

PASMOのサイトのマイページの説明のページに、「こんなときどうすればいいの？」という見出しで、登録時の半角カタカナについての説明が入っていますね。たしか、この記事を書いたときには、入っていなかったと思いますが...。

この説明があることで、半角カタカナのワナにおちいってしまったひとが、多少は救われるとは思います。しかし、

  • 半角カタカナを入力させることに変わりはない
  • 登録画面での「氏名（カタカナ）」「（半角カタカナ）」という表記はそのままなので、上記説明を読まずに登録画面へ移動してしまったら、間違えてしまう可能性は高い。

というわけで、根本的な解決にはなっていませんね。やはりリニューアルに期待です。

]]> [画像1: PASMOのマイページ登録画面]
画像1: PASMOのマイページ登録画面

]]> ステキなデザインの透明急須 tag:120.29.185.238,2007:/weblog//1.33 2007-01-31T02:15:09Z 2009-05-17T02:49:19Z 視覚的にも機能的にもステキな、透明な急須を見つけました。 TEA-WORKS http://tea-works.com/ 視覚的にも機能的にもステキな、透明な急須を見つけました。

緑茶だけでなく紅茶などにも似合い、また、透明で中が見えるため、清々しい気分になりますね。お茶を飲むとき、目でも楽しめそうです。:-)

取っ手の位置が中央なので、右手でも左手でも持ちやすく、また、口が広く洗いやすいのも特徴。

関連リンク

]]>

]]> 情報が増えた歩行者用信号機 [その2] tag:120.29.185.238,2006:/weblog//1.32 2006-09-07T15:48:22Z 2009-05-17T02:48:36Z 歩行者用信号機に、また新たなものが登場。待ち時間のところが具体的な時間がわかるデジタル数字になっている。名古屋で2基設置されたそうだ。 TEA-WORKS http://tea-works.com/ 先日、お伝えした、歩行者用信号機に、また新たなものが登場した。今回は待ち時間のところがレベルゲージではなく、具体的な時間がわかるデジタル数字になっている。

実用化へ向け、名古屋の笹島交差点というところに2基設置されたそうだ。

今後の展開に注目したいところ。

]]> 情報が増えた歩行者用信号機 tag:120.29.185.238,2006:/weblog//1.31 2006-03-29T15:12:33Z 2009-05-17T02:47:36Z 最新式の歩行者用信号機は、青までの待ち時間だけでなく、赤までの残り時間もわかるというすぐれもの。信号機にカウントダウンメーターがあり、そのメーターが徐々に減っていくというものだ。 TEA-WORKS http://tea-works.com/ 地元のとある歩行者用信号機が、最新のものに取り替えられた。

以前、"使いやすさ研究所の使いやすさ日記: 291. 赤でも青でも残り時間のわかる信号"でも紹介されていたが、この歩行者用信号機は、青までの待ち時間だけでなく、赤までの残り時間もわかるというすぐれものだ。ただし、時間といっても「残り何秒」といった具体的な数字が出るわけではない。信号機にカウントダウンメーター（勝手に命名）があり、そのメーターが徐々に減っていくというものだ。

これにより、青になるまで待っていてイライラしているひとがいたら、少しは解消されるか、別のルートを検討する参考になるだろう。また、すでに青のときで、交差点まで少し距離がある場合、急げば渡れるかどうかの目安にもなる。

このように、いままで見えなかった情報が見えるようになるのは、生活にとても役立つと思う。このタイプの信号機がもっと増えてほしいところだ。

余談: 最新式はコストがかかる？

同時期に、同じ道の歩行者用信号機がもうひとつ設置された。ここは以前、横断歩道のペイントのみで、信号機はなかった。今回、新設されたわけだ。しかし、同時期にも関わらず、この最新式のものと違い、カウントダウンメーターのない一般的なものだった。かといって、既存の歩行者用信号機と比べると少しデザインが変わっているので、これはこれで最新式なのだろう。しかしなぜ、カウントダウンメーター付きではないのだろう？人通りがぜんぜん違うので、そのせいはもちろんあると思うが、カウントダウンメーター付きであるにこしたことはない。きっとコストがかなり違うんだろうな。

]]>

]]> 情報不足の箸立て tag:120.29.185.238,2005:/weblog//1.30 2005-11-04T06:27:41Z 2009-05-17T02:46:35Z とあるレストランで、外壁を不透明の銀色で覆われている箸立てに出会った。はたして、このままお目当てのものを引き当てることはできるのだろうか？確実に引き当てられるのは、おそらく箸だけだろう。 TEA-WORKS http://tea-works.com/ とあるレストランで、外壁を不透明の銀色で覆われている箸立てに出会った。

その中にはナイフ、フォーク、スプーン、箸が、ペンのように立てられており、それぞれ柄の末端4cmほどが顔（この場合はお尻？）を出しているという状態で、いかなるときもこのセットが食卓に運ばれてくる（図1）。

ここで問題なのは、使いたいものをどうやって簡単に選択するかということだ。この状態では柄の一部しか見えておらず、取り上げるまでナイフかフォークかスプーンかわからない（さすがに箸は分かる）。こうなるとクジ運にたよるしかない。ただ柄の形は微妙に違ったりもするので、何度も利用している人はわかるかもしれないが、それでも完全に当てるのは至難の技だろう。

そこでいくつか改善策を考えてみた。

改善策その1: 逆向きに入れる

逆向き、即ち食事にふれる先端の部分が天井を向くように入れる（図2）。しかしこれから食べ物をつつくところを指で触るのは気持ちのいいものではない。それにつかみにくいし、子どもなどはケガをするかもしれない。

改善策その2: 透明にする

底の部分を一部透明にする（高さ5cmくらい？図3）。しかしさわらないで当てるのにはまだほんの少し難しい（紐の先端に飴玉がついていて、それの束から一本ひっぱって当てる駄菓子よりは簡単？）。それではそれを発展させ、ほとんどもしくはすべてを透明にする。しかしこの箸立ての外壁に、奇妙な絵や柄が入っていたら、デザイン性が損なわれるかもしれない。

改善策その3: ナイフ等に名前

ナイフ、フォーク、スプーン、それぞれの柄の末端にラベル（名前）をつける（図4）。これならさわらずに取りたいものが判別できるので完璧だ！しかし取り上げるための手助けにはなるが、単体で見るとあまり格好の良いものではない...。取り上げたときにラベルが消え、容器に入っているときはラベルが現れる、そんな魔法のようなものがあればいいのだが。

改善策その4: 容器に名前

容器を区分けし、区分けごとにラベルをつける（図5）。ラベルの場所は、例えば容器内側の最上部など。これならば容器の外観デザインはそのままに、選択者に適切な情報を与えられる。ただし斜め上から見る関係で、手前内側が死角になってしまう。が、例えば見えているのがフォークならば残りはナイフかスプーンと、予測できることにより、クジの確率は最初の33.3%から50%に倍増。二種類見えていれば、さらに倍増して100%だ。

ひとつ気をつけないといけないことは、お店のスタッフが入れ間違えないこと。これを間違えると、情報がない以上にストレスを与えてしまうかもしれませんからね。

]]>
図1: すぐわかるのは箸だけ


図2: 先を上にして入れてみる


図3: 一部を透明にしてみる


図4: ラベルをつけてみる


図5: 容器のほうにラベルをつけてみる

]]>