ノンデザイナーのための配色理論「のどが渇いた」というユーザーに何を出す？ ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチYoshiki Hayama
Responsive Tables Demo
Code The approach I've presented here assumes you know the index of the columns to be hidden. This probably isn't always appropriate, and isn't all that semantic. Another option is to give the <th> and <td> classes based on importance level and code your CSS accordingly. <table> <thead> <tr> <th>Code</th> <th>Company</th> <th class="numeric">Price</th> <th class="numeric">Change</th> <th class="nu
直感的にスマートにモバイルアプリのUIが作れるモックアップサービス「fluid」
WEB以上にUIが重要視される、モバイルアプリ開発。当然情勢も刻一刻と変わっていきスピード感も求められます。今日紹介するのは直感的にスマートにモバイルアプリのUIが作れるモックアップサービス「fluid」。 ブラウザ上で、用意されたパーツを並べていくだけで簡単にUIを設計することができます。非常に直感的に操作できるようになっており、海外のサービスですが、説明やチュートリアル無しで制作していくことができました。 詳しくは以下 予めよく利用するパーツが取り揃えられれていますので、基本設計は用意されているパーツで十分行えると思います。 フリー版では1つのプロジェクトで10スクリーンまで、10MBのアップロード領域まで利用できるそうです。それ以上は、STANDARD、PROFESSIONAL、EXPERTと開発規模に応じて有料プランが用意されています。有料版の利用料金は料金は「Plans & Pr
Metro UIは「UXアプリ養成ギプス」 : 小野和俊のブログ
昨日、今日とWindows Developer Days(WDD)に参加してきた。二日間セッションに参加して感じたのは、「Metro UIは『UXアプリ養成ギプス』だ」ということである。 デザインの原則がある。 例えば原則のひとつに、”Content before Chrome”というものがある。これは、「コンテンツを主役にし、ツールバーやメニュー等のコンテンツへの没入を妨げるものは最小限にする」というものだ。 こうしたデザインの原則やガイドラインがきちんと決められている、ということは重要なことではあるが、それ自体はさほど驚くべきことでもない。先日ブログに書いたように、最近の主要なプラットフォームには、大抵UX/UIのデザインガイドラインが定められているからだ。 では私が何に驚いたかというと、Metro UIではこのデザインガイドラインが「半強制」されていることだ。 UX/UIに意識の高い
UX/UIデザインガイドライン : 小野和俊のブログ
このところ、アプレッソの中でも、MIJS製品技術委員会でも、自分たちのソフトウェアのUX/UIをブラッシュアップしていくためにどんなことができるのかをディスカッションしている。 UX/UIデザインガイドラインとして各社の推奨する指針をまとめたものがWebで公開されているので、プログラマーであれデザイナーであれ、ソフトウェアの画面設計に何らかの形で携わるのであれば、基礎知識として主要なものには目を通し、プログラマーがデザインパターンの用語で手短にコミュニケーションが取れるのと同じように、「ここは○○ガイドラインの△△パターンを使うのはどうかな？」というような会話ができるようにしていきたいと思っている。 ■ Apple ・アップル ヒューマンインターフェースガイドライン ・iOSヒューマンインターフェースガイドライン(PDF) ・iPadヒューマンインターフェースガイドライン(PDF) ■ M
フォントの基本的な選び方
フォントの基本的な選び方を、備忘録的にまとめてみました。 フォントをどう選んだら良いのかわからない、もしくは選ぶのに時間がかかるという初心者さん向けです。 フォントには、それぞれ書体によって特徴があり、ユーザーに与えたい印象によって書体を選ぶ必要があります。 （それに縛られすぎてもいけませんが…（あえてインパクトを出すために違う印象のフォントを組み合わせたりする）、基本的な選び方として知っておくと良いと思います。） 私は以下の順番でフォントを選んでいます。 恐らく他のデザイナーさんも、この順番だと思います。 1. フォントの系統選び 2. 選んだ系統から、さらに書体を選ぶ 3. 書体のウェイトを決める 4. 字間の調整 さらに具体的な手順を1つずつ説明していきます。 1. フォントの系統選び 日本では、和文フォントと欧文フォントの2つを使います。 また、和文フォントは、以下の4つに大きく分
小島屋オリジナルお手持ち袋 | これ、誰がデザインしたの？
ライター渡部のほうです。 ドライフルーツとナッツが好きだ。 渡部のドライフルーツ及びナッツの年間消費量は、米の年間消費量を上回るであろう（重量換算）。 と、いうわけで、贔屓にしているのがこちらのお店、ドライフルーツとナッツの卸問屋、小島屋 www.rakuten.co.jp/kojima-ya いかにも「問屋」然とした楽天のショップなのだが、ある日突然、「お手持ち袋」なる商品が追加され、スマートなページが出来ていたのであった。 商品紹介ページ http://item.rakuten.co.jp/kojima-ya/c/0000000696/ 不織布タイプ 180円 シルク印刷 かなり厚盛りなインク。 カーネーションのような花柄のパターン。 商品紹介ページに書いてあるが、両方とも4キロの商品がきっちりはいるしっかり者。 思わず商品を注文する前に、店長に問い合わせる。 「これ、誰がデザインした
Android Usability Seminar 2012
日経BP主催のAndroid Usability Seminar 2012というのに参加してきました。ホームページの開催のお知らせから内容を察した限りでは、Androidアプリを作成する際のUX的な内容かと思い参加したのですが、内容的にはちょっと自分の思ってた方向とは違ったものの、かなり面白かったので、簡単に紹介したいと思います。 1. アップルから学ぶユーザビリティ 山中俊治氏 Suicaの自動改札機のデザインを担当。Suicaに限らず電子マネーなど、いまでは常識となっているタッチするという行為を人々にどうデザインの力で認知させるのかという課題を解決する為に、ユーザビリティテストを行い検証を行った。 ユーザビリティテストを行う上で重要なこと 開発の初期段階で行う 少ない人数でも構わない(回数を多く回すことの方が重要) 周到に計画する(ユーザーを疲れさせない) クライアントを巻き込む とに
Android Interaction Design Patterns |
Add a pattern! Missing a pattern? We invite you to add your patterns. Read more This is androidpatterns.com, a set of interaction patterns that can help you design Android apps. An interaction pattern is a short hand summary of a design solution that has proven to work more than once. Please be inspired: use them as a guide, not as a law.
細かすぎて伝わりづらい! <br />iOS 5のデザイン変更点まとめ。
iOS 5のリリースやiCloudの開始、iPhone 4Sの発売と、ここ最近のAppleのプロダクトが一通り出そろった感じですね。 3GSを使っていて常々もっさりしていたので、早速iPhone 4Sに乗り換えたところ、画面の中をスケートをしているかのようにスイスイ動いてくれてとても快適です。 2年前に3GSを使っていたときは、なんて速いんだろうと思っていたわけですが…慣れとは恐ろしいものです。 さて本題ですが、ここ数日使っていた中で気付いた、細かすぎるデザイン変更点があったので前回のLionと同じようにまとめてみました。 細かすぎるデザイン変更点第2弾、今回も目を凝らしてどうぞ。 1.アイコンバッジ iOS 4のアイコンバッジのシャドウは濃いめのブラックで強めのシャドウになっていましたが、iOS 5ではグレーっぽく明るくなっています。 全体的に比較してみると、iOS 4のシャドウは浮いて
)
Windows アプリ アート ギャラリー
ご利用上の注意事項 (The Terms and Conditions of Use) Windows 8 および Windows Phone 向けアプリケーションを開発する際にご利用いただける、さまざまなイメージ素材および効果音をご用意しました。 みなさまのアプリケーションをよりリッチに表現するのに是非ご使用ください。以下の「ご利用上の注意事項」を必ずお読みになり、ご同意いただきました上で、素材のダウンロードおよびご利用をお願いいたします。 This is Windows Apps Art Gallery, which is created for developers to freely use the provided materials for their Windows 8 and Windows Phone applications. Please be sure to rea
云顶7610线路检测-欢迎点击
选择云顶7610线路检测，让您解决废气问题 为您梳理废气来源，分析污染物的特点，减少污染物排放 立即咨询：180-2057-9170
fladdict » スマホのUI考 〜 ボタンについて
SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ
画面レイアウトを行うときに便利なツール « Elegant Apps Developers
こんにちは。BoltzEngine 担当の伊藤です。 Windows 10 の最新版、April 2018 Update (バージョン1803、ビルド17134.1) が配信されました。このアップデートで、Windows 10 の Microsoft Edge でもウェブプッシュが使えるようになりました。 これまで Chrome や Firefox を別途導入する必要がありましたが、標準の Edge だけでプッシュ通知が実現できるようになったので、今後より利用しやすくなりました。 こんにちは！ 島根支社でウェブエンジニアをしているカナツです。 GW も終わり、現実と向き合う日々に引き戻されたみなさま、いかがお過ごしでしょうか。 次の大型連休は島根観光をオススメします。自然が豊かすぎる島根で非日常的な日々を過ごしたくないですか？ 前置きはさておき、みなさん、チーム開発時のソースコード管理って
Google Developer Day 2010 Japan :ここちよい Android - おもいやりの UI デザイン
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Tuts+
IDEA * IDEA
iPhone や iPad の画面サイズ早見表 : iPhone プログラミング
http://www.mobiledesignpatterngallery.com/index.php
mokk.me