タグ

uiに関するB-daiのブックマーク (9)

  • iOS 7はもっさりか?比較検証してみた | TOKOROM BLOG

    今回の記事はUIデザイナの Morino氏 からの寄稿です。 iOS 7が正式リリースされました。既にアップデートを行って実際に試されている方も多いと思いますが、今回はUIに大幅な変更が加えられたために、まだ操作に戸惑いのある方もいるのではないでしょうか。 特にiOS 7にしてから重く感じる、もっさりしているという意見もけっこう多いようです。iOS 7をしばらくいじってからiOS 6の端末を触ると、たしかにiOS 6の方がきびきび動いているように感じます。 今回は半透明やぼかし、視差効果などの画像エフェクトをふんだんに使用しているために画像処理の負荷が高いことも確かでしょう。しかし、全てが端末の性能のせいというわけでもないことを、今回はご紹介したいと思います。 頻繁に操作を行う以下の4つのシーンについて、ちょっとした比較検証を行いました。 ロック解除してから、ホーム画面のアイコンが全て出現

    B-dai
    B-dai 2013/09/25
    古い端末と新しい端末でどのくらいもっさりに差があるのか比較してくれたのかと思ったiPhone4(無印)持ちのオレ。違った。
  • 文字を光らせるGlowイフェクトをJavaScriptで·jQuery Glow MOONGIFT

    ユーザに何かのアクションを起こさせようとする時にマウスオーバーでボタンを点滅させたり、色を変えるようなアクションを行うことがある。文字の色を変えるくらいなら簡単だが、ボタンを作成したりするのは面倒に感じてしまう。 光り輝く文字は相当目立つ だがユーザビリティを高くするには必要なことだ。開発者にとって楽で、かつユーザにとっても使いやすいサービスを目指してjQuery Glowを使ってみよう。 今回紹介するオープンソース・ソフトウェアはjQuery Glow、GlowイフェクトをJavaScriptで実現するjQueryプラグインだ。 Glowイフェクトとは文字の背後から光を当てて周囲が輝くようなイフェクトのことだ。jQuery Glowを使うとJavaScriptだけで実現できる。マウスオーバーした際に使えば、目立たせることができ、クリックを促せるようになるだろう。 こちらは緑 色は自由に設

    文字を光らせるGlowイフェクトをJavaScriptで·jQuery Glow MOONGIFT
  • 「サイトの横幅」再論:950px時代のウェブデザイン[絵文録ことのは]2009/01/14

    以前、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論[絵文録ことのは]2006/11/25で、「実際にサイトを閲覧している人のブラウザーの横幅と、ブラウザーによる印刷上の制約から、特に画像は左端から640ピクセルくらいに収まるようにした方がよさそうだ」という結論に落ち着いた。これには、一行字数が多すぎると読みづらい、という、紙媒体の扱いも多いわたしの経験的な見方もある。 もちろん、これにはリキッドデザイン主義者の方から「ページ幅を指定するようなデザインであること自体が悪」という反応があったり、「印刷用CSSを使おう」といった反応があったりしたのだが、「印刷時のことを考えれば640pxという制約がある」という結論は特に揺るがなかった。 その後、今まで約2年経った。閲覧者の環境も変わり、当時主流だったIE6にはなかった「用紙サイズに合わせて印刷」機能を備えたIE7ユーザーも増

  • ゲームの右と左 マリオはなぜ右を向いているのか - 最終防衛ライン3

    *ここでのゲームテレビ、ビデオ、コンピュータゲームを指す *長文なので、なげーよ!論点まとめろよって人は、味も素っ気も無いけど 簡略版 へゴー 島国大和のド畜生 物語の進行方向について(日漫画のメリットとか) 「チキチキマシン猛レース」は常に右から左に向かってレースをしているのだ。 物語は舞台の上手(かみて)から下手(しもて)、つまり右から左に進むのが洋の東西を問わず一般的。映画などでも、主人公は上手の右、敵役は左にいる。主人公は右から入場し左へと退場していく。つまり、物語は「←」と右から左へ進行する。縦書き右綴じな日漫画は「←」で右から左に物語が進むが、横書き左綴じの西洋の漫画は「→」と左から右に進む。日漫画は左右が映像のロジックと一致しており大変読み易いと言える。 しかし、ゲームは「→」と左から右へ進行する。スーパーマリオブラザーズを始めとする横スクロールアクションやグラデ

    ゲームの右と左 マリオはなぜ右を向いているのか - 最終防衛ライン3
  • Nitram+Nunca リアル・グラデーションの作法

    写真を撮る機会は実に多くありますが、特に結婚写真は一生の記念になる大事な写真ですので、できるだけ良いものを残しておきたいものですね。 結婚前は何かと忙しくなりますが、疲れが残らないよう、写真撮影の前にはしっかり休息を取っておきたいですし、エステなども利用して、できるだけきれいな状態で撮影にのぞみたいものです。 そして、結婚写真は挙式当日に撮影されるカップルも多いですが、やはり慌しいこともあり、せっかくの写真も表情が硬くなってしまったという経験をお持ちの方もいらっしゃるのではないでしょうか。 結婚写真は最近は前撮りでゆとりを持って撮影される方も増えているようです。 メイクや着付けも時間をかけられますし、時間にも余裕がありますので、より自然な表情で撮影ができるのもメリットです。 そして、式当日とは違う衣装を選ぶことができるのも良いですね。 スタジオ撮影はもちろん、ロケーション撮影などで屋外での

  • 気になる! itemズ サンワサプライの光学式フィンガーマウス

    「光学式フィンガーマウス(400-MA006)」の価格は3,480円。USB接続でWindows Vista/XP/2000/Me/98SEに対応する サンワサプライの「400-MA006」は、非常にユニークなポインティングデバイスである。便宜上、「光学式フィンガーマウス」と呼ばれてはいるが、使い方や形状は一般的なマウスのイメージからはかけ離れている。指の第1関節と第2関節の中間あたりにバンドを巻き付けて固定するという、ある意味ウェアラブルなポインティングデバイスなのである。 まるで巨大な指輪のようだが、この状態で指先をデスク面などに向けて動かすと、それに合わせてディスプレイ上のマウスポインタが動くのだ。マウス、タッチパッド、トラックボール、いずれとも異なる不思議な操作感が味わえるアイテムである。 製品を見るとフィンガーマウスという発想の物珍しさばかりが目立ってしまいそうだが、実は思った以

  • Life is beautiful: 本質的でないものを徹底的に排除すると美しくなる(「アップルのデザインの秘密」より)

    アップルの作る製品のデザインがなぜあれほどにすばらしいかを熱く語った文章を発見。一番気に入った部分を引用してみる。 "The businessman wants to create something for everyone, which leads to products that are middle of the road," says Brunner. "It becomes about consensus, and that's why you rarely see the spark of genius." "Critical to Apple's success in design is the way Jobs brought focus and discipline to the product teams," ­Norman says. "[Jobs] had a s

  • タッチスクリーンで映画『マイノリティリポート』は現実になる

    トム・クルーズ主演の映画『マイノリティ リポート』、覚えてます? オブジェをあっちにどけ、こっちに引っ張り、脇にうっちゃって欲しいものを取り出す…まさに乱暴な主人公の言いなり。あの「ありえない」インターフェイスがとうとう現実になりました! 開発したのはニューヨーク大学クーラント数理科学研究所のジェフ・ハン研究員(左)。 タッチ、ジェスチャー、それに圧力の程度まで読み分けてくれるUIで、まるで机の上に写真を引っくり返していじってるのと変わりません。ツリーの展開は指の動く通り枝がニョキニョキ生えてくようだし、3Dの球体や顔面も粘土いじりみたいに形を変えます。フォトショップとかに応用したらエラいことになりそ…。スクリーンの端から端まで写真をフリップするシーンは…もう、目の前で何が起こったのか…。唯一理解できるのは、どう見てもこの人たちはトム・クルーズじゃない、という事実だけです。 これはもう口で

  • Webデザイン エンジニアリング 第16回 ボタンを押させるテクニック:ITpro

    対象とするユーザーの“慣れや知識”によって,画面の構成を変えたほうが伝わりやすいとするならば,画面上の「ユーザー・インタフェース(UI)部品」の色や形状も,ユーザーに応じて変えるべきでしょう。今回は,代表的なUI部品でありながら,なかなか作り手の思うように押してくれない「ボタン」について考えます。 わかりやすいボタンの形状はユーザーによって違う まず,前回とほぼ同じ絵を用います。Webシステムの操作方法への「熟知度(PCリテラシ)」を縦軸,「提供したいサービスに対する知識」を横軸とします。そして,それぞれの「軸」に対して,受け入れやすいと思われる「ボタン」の形状を例記しました。 上図の【A】や【B】のタイプに当てはまるPCリテラシの高いユーザーは,ボタンの“ラベル”に「submit」と書かれていようが「GO」と書かれていようが,ボタンを認識することはさほど苦ではありません。 しかし,PC

    Webデザイン エンジニアリング 第16回 ボタンを押させるテクニック:ITpro
  • 1