デザインの細かいこだわりがすごい! こんな面白いアイデアはどこから生まれるんだろう? CSSやSVGでこんなこともできるのか! 次のプロジェクトのヒントになるような素晴らしいUXを堪能できるWebサイトを紹介します。 時間のある時に、じっくりお楽しみください!
Result jQuery$('a','nav').mouseover(function(){ $('span','nav').animate({ 'width': $(this).width(), 'left': $(this).position().left} ,'fast'); });cssnav a{ text-decoration:none; color:#333; } nav li{ display:inline-block; margin-left:2px; padding:3px; background:#eee; } nav span{ background:#666; height:2px; display:block; position:relative; width:50px; left:0; }html<nav><ul> <li><a href="#">menu0
Polymer Elements のカタログページ Site: Polymer Element Catalog Repo: Polymer/polymer-element-catalog Polymer は、これからの Web 標準の一角を占めるであろう Web Components のラッパーライブラリです。その Polymer で作られたコンポーネントのカタログサイトが公開されていました。 これまでも Core Elements や Paper Elements が Polymer のコンポーネントとして提供されていましたが、分類も新たにレパートリーが拡充されています。 Cart に入れて Download カタログには各コンポーネントのドキュメントやデモが載っていて、使いたいものをチェックして Cart に入れていきます。必要なコンポーネントを Cart に入れてダウンロードさせると
UIデザイン時の「ユーザーの使いづらい」には2パターンある。350万ダウンロードの家計簿アプリ「Zaim」が教える、UI改善の失敗談。 今回は350万ダウンロード突破、家計簿アプリの「Zaim」さんにお話を伺いました。ユーザーが伸びたタイミングや、UI改善の失敗談など。 ※株式会社Zaim 代表取締役 閑歳 孝子さん。 「Zaim」の近況について 「Zaim」のユーザー数は今どのぐらいですか? 閑歳: 2011年7月にリリースして、350万ダウンロードを超えています。OSで言うとiOSの方が多いですが、最近はAndroidも伸びています。今も広告費は使っていません。 今までに、ユーザーが大きく伸びたタイミングはありますか? 閑歳: 去年はダウンロード数がグッと伸びた印象があります。2013年の終わり頃から、スマホをみんなが本当につかうようになって、すごく高齢者と若年層が増えました。 データ
マイクロソフト、「デバイスはひとつでOK」の未来UIをチラ見せ2015.05.07 22:00 福田ミホ スマートフォンとかパソコンとか、コンピューター何台も持つ必要がなくなる。 今、スマートフォンはどんどん大きく、パソコンはどんどん小さくなっています。そしてマイクロソフトのビジョンによれば、それぞれの端末で使うソフトウェアにはまったく違いがなくなっていきます。それは、想像以上にラディカルなビジョンです。 マイクロソフトの開発者向けイベント「Build 2015」の中で、同社バイスプレジデントのジョー・ベルフィオーレ氏が、壮大なビジョンをわりとさらっと語ってくれました。それはWindowsのユーザーインターフェースに関するもので、特に去年発表されたWindows 10の機能Continuumが大きな役割を果たしています。 Continuumは、ユーザーがあるデバイスをスマートフォンとして使
ユーザーの本音を、効果的な改善へつなげる ユーザーテストサービス登場 -スマホUIテスター- 全てのアプリ・ウェブサイトに対応 製品やWebサイトの使いやすさを、実際のユーザーに使ってもらうことで確認する手法です。 ユーザーテストを活用することで ↓ 普段聞けないユーザーの本音が聞ける どこが使いづらいのか、なぜ使いづらいのか、etc… ユーザーの本音に基づいた改善施策を提供する スマホUIテスター ユーザーの本音を取り入れることで、一層深い分析サービスを提供いたします。 [実施イメージ] ・メニューが見づらく、 目的のページに辿りつけない ・使いづらい・・・ ●ユーザーは自宅でテストを実施 ●ユーザーにタスクを提示して、その操作内容(画面・指の動き)を観察 ●ユーザーは操作時に思った、感じたことを発話 サービスの問題・課題を見つけ出します!! ユーザーの操作内容を観察することで問題・課題
Using Intel.com Search You can easily search the entire Intel.com site in several ways. Brand Name: Core i9 Document Number: 123456 Code Name: Emerald Rapids Special Operators: “Ice Lake”, Ice AND Lake, Ice OR Lake, Ice* Quick Links You can also try the quick links below to see results for most popular searches. Product Information Support Drivers & Software
アニメーションするCSSのみのハンバーガーメニューアイコン Animating CSS-Only Hamburger Menu Icons Hamburger menu icons have become a staple in many websites and web apps, and whether you like them or not, they are becoming a familiar and recognizable UI action button. Users are associating this icon with the showing and hiding of menus, and its compact, space-saving nature makes it a desirable style, particularly on smaller
TOP > Design > webデザインを作り上げるのに参考にしたい フリーUIキット10種「10 Fresh And Free UI Kits For Designers」 ハイクオリティなデザインを手がけるのには、いろいろなデザインリサーチや構成の企画立てなど、たくさんの工程が必要になってきます。しかし時にはコスト面や納期面で困難な状況に陥ることも。今回はそんな時に参考にしたい、フリーUIキット10種「10 Fresh And Free UI Kits For Designers」を紹介したいと思います。 Dribbble – Freebie PSD: Flat UI Kit by Marcel Akiyama デザイン形成時に役立ってくれるUIデザインが揃っており、欲しいデザインや目的に合わせて選ぶことができるようになっています。 詳しくは以下 Download Flat
3D Bold Navigation A bold navigation that slides in when active, replacing the current content in a 3D space. Today’s resource is a strong approach to showing a website navigation. Bear in mind, though, it doesn’t have to be the “main” navigation. You could have, for example, a product gallery and you’d like to create a smooth transition while switching from one product category to the other. To i
次のようなアルゴリズムでコンピュータが自動的に判断しています。順に説明します。 SmartNewsで対象となる情報は、インターネット上で固有のURLについてユーザーが何らかのアクションを起こしているものです。その情報の内容がどの言語で記述されているかを判断します。その情報がどのカテゴリに属するか、カテゴリ分類します。その情報の類似判定をします。これは、多様性のある情報を届けるためで、同じような内容が重複しないようします。また、情報が重複している場合は、情報の早さや人によく見られているといったさまざまな要素を総合的に判断して一番良いと判断されるものを選定しています。さらに、そのなかで注目度判定を行います。注目度判定にもいろいろな指標がありますが、たとえば以下があります。ソーシャル上でどのくらい反応があるかSmartNewsで実際に配信したときのユーザーの反応たとえば、SmartNewsで配信
QWERTY配列からの脱却。スマホのために0から考えなおしたHEROキーボード2015.04.13 11:305,037 140年の歴史に終止符を。 私たちが普段パソコンでもスマートフォンでも使っているキーボード、実はQWERTY配列といってすごい昔からあるものなんです。どのぐらい昔かというとなんと1873年で、アメリカ人の新聞編集者がタイプライターのために開発したのがはじまり。その配列を今でもスマホで使っているってなんだか非効率でもっと工夫できるんじゃないか、という考えて誕生したのがiPhoneのHERO keyboardです。 このキーボードはまず英語において使用頻度が最も高い9つのアルファベットを抽出し、それらを真ん中に大きく持ってきて、しかも親指が動かしやすいように円形に並べるというように0からデザインし直したものになっています。なんだか斬新すぎてはじめは違和感を感じますが、なんと
世に出ている「デザイン原則」と呼ばれるものたちをまとめてみました。 ユーザビリティ関連からモバイルUX、サービスデザインにいたるまで、広い範囲のデザイン原則を網羅したつもりです。ただし、チェックリスト的にまとめたため、内容の詳細は記述していません。 出典や内容を紹介している外部リンクを張っておきましたので、詳細を確認したい方はそちらをご参照いただければと思います。 なお、この記事は有用なデザイン原則を見つけ次第、随時更新していきます。 更新履歴 2018/10/01: 「アクセシビリティの4原則」「Material Designの原則」「Android TV デザイン原則」「インクルーシブデザインの原則」を追加 2016/12/28: 「Microsoft デザイン原則」を「Windows UX デザイン原則」にアップデート 「Apple Watch デザイン原則」を追加 2015/10/
Introducing Sessions: the latest product from Waldo!
こんにちは。ユーザーファースト推進室の元山です。 みなさんはスマートフォンアプリケーションやWebサービスの開発・改善をするときにどのようなプロセスで行っているでしょうか?アジャイルやリーンなどの最近では一般的なよくある開発プロセスの中で、今やプロトタイピングは当たり前に行うものとなっていると思います。プロトタイピングを支援するアプリやWebサービスも数多くありますが、ただ闇雲にプロトタイプを作ればいいわけではありませんし、プロトタイプモックを作ること自体が目的化されては意味がありません。 クックパッドでもプロトタイピングを取り入れた開発プロセスを行っていますが、開発のフェーズであったり、または目的によってどのようなアウトプットとしてプロトタイピングするのかは変わってくると思います。今回はクックパッドで実際に行っているプロトタイピングについてフェーズや目的ごとにご紹介しようと思います。 コ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く