タグ

関連タグで絞り込む (155)

タグの絞り込みを解除

UIに関するmut00tumのブックマーク (297)

  • 優れたユーザーインタフェース(UI)を実現するチェックリスト36項目

    【img via tabletop assistant by MattHurst】 優れたユーザーインタフェースとは何か。どのようなデザインを「優れたユーザーインタフェース」と呼ぶのに相応しいのだろうか。 GoodUIというサイトに優れたユーザーインタフェースを実現するために確認しておきたい36項目をイラスト付きで解説していた。とても分かりやすく納得できる内容が多かったので、紹介しておく! 1.マルチカラムではなく、シングルカラム 複数カラムだとユーザーの目線が左右に逸れてしまう可能性があるため。 2.まずはギフトを渡してみる 最初から買うことを促すよりもまずはこちらから何かを与えることによってユーザーに喜ばれる。 3.似た機能や項目は1つにまとめて表示する 似た機能を分散させる必要はない。 4.ユーザーからの反応を載せる 実際に使っている「ユーザーの声」を参考に買い物をする人は少なくない

    優れたユーザーインタフェース(UI)を実現するチェックリスト36項目
    mut00tum
    mut00tum 2014/01/27
    UI?
  • 2013のトレンド Top10を振り返る - UI編

    今年の初めに2013年の予想記事 “2013年トレンド予測 カテゴリー別 Top3 | Tech / UX / Mobile / Online Marketing“を書いてからはや1年、気づくともう年末。振り返ってみると今年はインターネット・デザイン・スタートアップを取り巻くトレンドがめまぐるしく変化した一年となりました。その中でも最も進化が著しかったのがUI (ユーザーインターフェイス) と UX (ユーザーエクスペリエンス) です。今回はサイトや、アプリ、デバイスを利用するユーザーの使い易さと利用体験に直接影響を及ぼすUIについて2013年のトレンドをまとめてみました。 2013年のUIトレンドTop10 レスポンシブデザイン化が加速 フラットデザインの氾濫 タイポグラフィーの重要さが上昇 Flash終了のお知らせ 大きな画像を背景に利用 余白の有効活用 パステルカラーを積極的に採用

    2013のトレンド Top10を振り返る - UI編
  • UIアイコンの最適化 — 認識速度の向上をめざして | architexture.jp アーキテクスチャ — 情報をデザインする可能性の探求

    著者:アラ・コルマトヴァ(Alla Kholmatova) 翻訳者:浅野 紀予 インターフェース上のアイコンを、ただの装飾要素ではなく、その価値を高める要素にするのはどんなポイントでしょうか? 直感的であること、美的価値があること、記憶しやすいこと、それとも文化の違いを超えて知覚できること? 効果的なアイコンはそれらの特徴をいくつも持ちあわせていますが、私はあるひとつの尺度に注目したいと思います — それは認識速度、つまりそのアイコンをどれくらいの速さで発見し識別できるか、という尺度です。 単純な暇つぶしアプリなら、認識速度の違いは大した問題ではなく、体験全体を揺るがすほどの影響を与えはしないかもしれません。 でも、複雑なトレーディングアプリでは事情が異なるでしょう。その場合、アイコン表現に求められる要件は、一段とスピード優先の傾向を強めます。個々の要素の処理時間が、インターフェース全体

    UIアイコンの最適化 — 認識速度の向上をめざして | architexture.jp アーキテクスチャ — 情報をデザインする可能性の探求
  • UI変更批判バトルと複数のバージョンのウェブサービスを同時に配信することについて - hitode909の日記

    ウェブサービス,UI変えると,改悪とか,元に戻してとか,そういう意見が出る. サービス提供する側の立場では,新しいUIのほうが使いやすかったり,機能が増えたり,収益が増えたりするので,新しい方を多くの人に提供することに価値がある.使いやすいかとか,儲かるかとかは,リリースまでに調べておく必要があり,リリースの結果使いにくくなったり収益減ったりしたら,失敗ということになる. 一方で,ユーザーの立場からすると,前の方がずっと使ってて愛着があったとか,新しい方を覚えるのは手間とか,確かにという感じはする.また,ウェブサービスは最終的にユーザーの手元のブラウザで表示されて動くので,映画の結末が気に入らないから変えたいといった要望よりは,受け入れやすい.データ構造についての,サーバー側の処理についてのユーザーからの要望というのはあまりなくて,このボタンがどうみたいな,UIの要望が多いと思う. 全部置

    UI変更批判バトルと複数のバージョンのウェブサービスを同時に配信することについて - hitode909の日記
  • モバイルUIのデザインに役に立つUIパターンギャラリー集17選 - showrtpath - iOSブラウザ開発日記

    2013-12-23 モバイルUIのデザインに役に立つUIパターンギャラリー集17選 アプリの開発の時にUIのデザインに悩みますよね。 そんな時、モバイルUIのパターンギャラリー集が役に立ちます。 そのギャラリーサイトのサイトを集めてみました。 スクリーンショットを集めたものと、デザイナーの作品のものがあります。 Showrtpathブラウザを開発していた時はdribbbleをよく見ていました。 Pttrns - Mobile User Interface Patterns 優れたiPhoneサイトデザイン集 - iPhoneデザインボックス Mobile Patterns lovely ui Inspired UI - Mobile Apps Design Patterns [iPhone] Mobile Awesomeness Meerli · Featured Android Nic

    モバイルUIのデザインに役に立つUIパターンギャラリー集17選 - showrtpath - iOSブラウザ開発日記
  • Lightning Design System

    Lightning Design System
  • ビジネス向けモバイルアプリケーションのUIガイドライン、セールスフォース・ドットコムが公開。アイコンなどダウンロード可能

    ビジネス向けモバイルアプリケーションのUIガイドライン、セールスフォース・ドットコムが公開。アイコンなどダウンロード可能 先週13日に、SAPが業務アプリ用のJavaScriptUIライブラリ「OpenUI5」を公開したとお伝えしたばかりですが、今度は、米セールスフォース・ドットコムがHTML5でのビジネス向けモバイルアプリケーションのUIガイドラインやサンプルを多数公開しました。ビジネスアプリ用のモバイル開発環境はHTML5/JavaScriptで急速に充実してきています。 米セールスフォース・ドットコムは先月、新ブランド「Salesforce 1」を立ち上げ、モバイルへ全面的にシフトすることを宣言したばかり。このスタイルガイドは、同社のモバイルへの注力を示すものといえるでしょう。 これまでビジネスアプリケーション向けに、モバイル対応のしっかりとしたスタイルガイドが公開された例はおそら

    ビジネス向けモバイルアプリケーションのUIガイドライン、セールスフォース・ドットコムが公開。アイコンなどダウンロード可能
  • ウェブデザインのセンスを磨こう! 2013年洗練されたディテールのUIデザインのまとめ

    2013年、チェックしておきたいUIデザインをdribbbleから紹介します。 高解像度の.psdや.pngファイルをダウンロードできたり、動きをアニメーションgifで楽しめたりします。 2013年のデザインを振り返りつつ、来年はまたどんな素敵なデザインが生まれるのか楽しみですね。

  • https://planb.cd/about_growth_hacker

  • 2013年、この一年で大きく変わったウェブサイトのナビゲーションの5つのトレンド

    ウェブサイトに使用されるナビゲーションはこの一年の間に、大きく変わりました。スクリプトやスタイルシートを使い派手なアニメーションやインタラクションを取り入れることもできますが、最近のトレンドはよりシンプルで、すっきりしたデザインが好まれています。 最近のナビゲーションのトレンドを紹介します。 Up and Coming Navigation Trends 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。最近海外のブロガーから他ブログでの無断翻訳・転載の声を聞きます。 ナビゲーションの欠如 スクロールベースのナビゲーション ミニマルなナビゲーション サイドのナビゲーション サークル状のナビゲーション 終わりに ナビゲーションの欠如 最初にあげるナビゲーションのトレンドは、ナビゲーションの欠如です。これは二つの条件が揃えば機能します、一つは

  • GE社の重役が予測する「将来的に重要になる職業」はデータサイエンティストとUIデザイナー | ライフハッカー・ジャパン

    Gigaom:サンフランシスコで開かれた「Roadmap 2013」で、GE社のSVP兼CMOのBeth Comstockさんは、同社の「インダストリアル・インターネット」を展開するために「デザイン」が重要になると語りました。 GE社では、自社の産業機器、医療機器、家電製品をインターネットに接続し、ビジネスをネットワーク時代に対応させる上で、「ユーザーインターフェース」と「データ」を重視しているそうです。機械の修理工は、センサーから送られるデータと拡張現実(AR)を活用して、複雑な機械を遠隔で修理することになります。病院では、ロボットを用いて医療機器を制御し、医療従事者の負担を減らします。看護師たちは患者のケアに集中できるようになるでしょう。Comstockさんは、こうした変化により、「データサイエンティスト」と「ユーザーインターフェース・デザイナー」が重要な職業になると言います。 「適切

  • UIディレクションのカバレッジ

    タイトルでは「UIディレクションのカバレッジ」という表現をしましたが、今回はクオリティの高いUIを作るためにはどういう観点での品質管理が必要なのか、ということを自分なりにまとめてみたいと思います。 情報設計・レイアウト情報設計やレイアウトには無限に選択肢があるだけに、「どんなユーザーに、どんな接触態度で、どんな体験をしてもらいたいか」というマーケティング的な視点を持っているか否かで、アウトプットに大きな違いが出てきます。 ちなみに、初めにUIを設計する際には比較的このような視点を持ちやすいのですが、既にリリースしているサービスに対峙すると、どうしても既存のUIの延長線上で改善を考えてしまいがちです。そうならないよう、UIに関わる人たちは、常に提供したいユーザー体験の理想型を意識し、そこから逆算的にUIを考える癖をつけなければいけないと思っています。「なぜこれはこうしたのか?」と訊かれたら、

  • Creative Website Navigation Shouldn't Be Avoided

  • ナビゲーション/メニューのiPhoneアプリデザイン集22選

    FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ

    ナビゲーション/メニューのiPhoneアプリデザイン集22選
  • UXをみっちり基礎から教わることができた「モバイルUI/UXのキホン」って勉強会のレポート! 

    10/4に渋谷で開催された「モバイルUI/UXのキホン」 に参加しました。2011年からいろいろなテーマで開催されている歴史のある勉強会なのと、ディスカッションや意見交換を通じた双方向性を大切にしている、学びの多い勉強会でした! 今回は勉強会の中で特に参考になった点を書いていきます! 🍣 発表スライド発表の際に使われたスライドです。しっかりとした内容です! 発表スライドは「prezi」というサービスを使っているそうです。動きのあるカッコイイデザイン! 🎃 UI/UXは最近のバズWordデジタルガジェットでは特にいえることですが、市場が成熟してきて機能的な差別化が難しくなってくると、ユーザーの体験(UX)が重視されるようになってくるそうです。スマホアプリケーションは特にこういった要素が強く、ココ最近は『UI/UX』がバズWordになっているそうです。 🐹 UI/UX/IAの言葉の定義ま

    UXをみっちり基礎から教わることができた「モバイルUI/UXのキホン」って勉強会のレポート! 
  • 米国市場の高校サイトでは、今、何が起きているのか?

    ブログサービス「マーケター通信」をご利用の皆さまへ 平素はITmedia マーケティングをご愛読いただき、誠にありがとうございます。 当サイトではこれまで、関連ブログサービスとして「マーケター通信」を長年にわたり運営してまいりましたが、全体的な利用の減少を鑑み、2020年9月30日にサービスを終了させることになりました。 このような結果になり残念ですが、何卒ご理解いただけますと幸いです。これまでご利用いただきましたことに対し、あらためてお礼申し上げます。 尚、ITmedia マーケティングは従来通り更新を続けますので、引き続きよろしくお願いいたします。 サービス終了までのスケジュール、および、これまで登録していただいたブログ記事の取り扱いにつきましては、以下の記載をご確認ください。 スケジュール 2020年9月25日(金)

    米国市場の高校サイトでは、今、何が起きているのか?
  • Michaelis Boyd

    Michaelis Boyd, an architects and designers based in London and New York. We create spaces that are emotive, meaningful and thoughtful.

  • デザインの決定に役立つビジョンの共有

    9月24日 Samurai Startup Island で、久々に短めのプレゼンをしました。トピックは UX という広く浅いテーマということもあり、最初は登壇をお断りしようと思っていました。しかし、スタートアップとして奮闘している人たちと今まであまり接点がなく、他の登壇者の話に興味があったので、参加を決めました。参加者からの質問がたくさん出たパネルディスカッションも含め、よいイベントだったと思います。 作れば良いという時代ではない 昨年「スタートアップとデザインについて」という記事を執筆しました。当時と今では、状況は少し異なるところがあります。国内外問わず、インタラクションデザイン、インターフェイスデザインの質は向上していますし、そこへの投資(時間とお金)をしなければならないという認識も高まっています。 しかし、良いと思われるデザインを『導入』すれば品質向上につながるという誤解は未だに強

    デザインの決定に役立つビジョンの共有
  • Flat Rounded Square UI Kit

    Flat Rounded Square UI Kit Download for Free Return to the Article

  • デザインに立体表現を取り入れるときのセオリー×6 | ベイジの社長ブログ

    iOS7の登場で、フラットデザインへの関心はますます高まっていることでしょう。 ここではそんなトレンドは一切無視して、UIデザインにおける立体表現を行う上で、おさえておくべき大切なポイントをまとめてみました。これらをマスターして、時代に逆行するゴリッゴリの立体表現を行えるようになりましょう。 セオリー1:現実世界の「光源」の基ルールを守る 唐突ですが、この2つのボタン、立体表現としてどちらが正しいと思いますか? 左側、「A」のボタンには、以下のような光源の矛盾があります。 ボタン体の影は、右下に付いている。つまり、光源は左上。 へこんだAの影は、右上に付いている。つまり、光源は右上。 ドロップシャドウは、真下に付いている。つまり、光源は真上。 一方のBは、すべての要素の影が、光源が上の表現になっています。つまり、正解はBです。そしてこれが、現実世界での「光源」(=影)の基ルールです。

    デザインに立体表現を取り入れるときのセオリー×6 | ベイジの社長ブログ