サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
Holiday 事業室の多田です。先日 Elasticsearch の記事を書いた内藤と共に Holiday ( https://haveagood.holiday ) の開発を行っています。 Holiday は、去年9月に Web 版をリリースしましたが、よりおでかけを楽しくするために今年3月にiPhone アプリをリリースしました（ダウンロードはこちら）。 アプリの開発過程ではコンセプトや仮説を立て、その検証や実現のために作っては壊すことを何度も繰り返し行いますが、実現したい価値を提供するためには、出来上がったプロダクトの細部のインタラクションも重要になってきます。細かい部分に気を配り使い心地を良くしてこそ、本当に提供したい価値をまっすぐに届けることができるためです。逆に言えば、最後の最後で細かい部分がちゃんとしていないばかりにそれまでの過程が無駄になったらもったいないですよね。 今
a minimal,ui-focusedprogramming language for web designers clicking on ".try-it" toggles class "hidden" on ".info-box" TryIt Getting Started Insertuilang.js in your page, write someuilang as shown above in asimple <code> element and useCSS to show, hide and animate things. Download 1KBBuild InterfacesCreate popovers, tabs, galleries, overlays and more using a language specifically designe
By Lynn WallensteinAppleがiPhoneで切り開いたスマートフォン市場に、GoogleはAndroid OSで参戦し、現在ではiOSを圧倒するシェアを獲得するまでになりました。Googleが育ててきたAndroid OSの7年間の進化の歴史を、OSの画面表示とともに振り返るとこんな感じになります。 The history ofAndroid: The endlessiterations ofGoogle’s mobile OS | ArsTechnica http://arstechnica.com/gadgets/2014/06/building-android-a-40000-word-history-of-googles-mobile-os/ ◆Android 0.5(Milestone 3) 最初にAndroidが公式にリリースされたのは2007年1
It’s easy to see how designing forms can be seen as a chore that detracts from the time that could be spent on more exciting parts. Yet, if you think aboutit, the payment form is part of the checkout flow, the point at which a user is on the verge of committing to trusting you and your business with their vote of confidence. This experience should really be as great as possible, and using animati
モバイルアプリのUIデザインで難しいのはターゲットとなるデバイスの画面サイズに様々なサイズのものがあるということです。画面の大きさにはいろいろあっても人間の手や指のサイズはほぼ誰でも同じですから、どんな画面サイズであっても確実に押せるようなUIのサイズというのを把握してデザインしないと大変使いにくいものになってしまいます。 例えばiOSの「ヒューマンユーザーインターフェースガイドライン」では「タッチ可能な領域のサイズを約44ｘ44ポイントにしなさい」とし、サンプルとして電卓アプリの画面が紹介されています。 “Give tappable elements in your app a target area of about 44 x 44 points. TheiPhone Calculator app is agood example of fingertip-size control
ーーーーーーーーーーーーーーーーーーーーーーー schoo WEB-campusは「WEBに誕生した、学校の新しいカタチ」。 ＷＥＢ生放送の授業を無料で配信しています。 ▼こちらから授業に参加すると、先生への質問や、ユーザーとのチャット、資料の拡大表示等が可能です。 https://schoo.jp/class/344/room ーーーーーーーーーーーーーーーーーーーーーーー
https://plus.google.com/107002572043873162468/posts/4sBboJT6GMW http://blog.toshimaru.net/cool-ui/ この辺の話。正直こいつらただのバカだとは思うんですが、 Gunosy が多機能化したら不評だったので旧UI を別アプリで出した話FxCamera がSNS 機能追加したら不評だったので旧UI を別アプリで出した話 みたいなダサいことになるくらいなら masarakki さんの精神性を見習ったほうがまだマシじゃないかと思います。正しいと思ってやったことがユーザーからダサいと判定されたときは、「これが最高にクールなんだ！！！」と主張しつつしれっと不評な部分を直していくぐらいのほうがいいと思います。 そのほうが自分や開発者のプライドを防衛できるし、プライドの防衛というのはよいアプリケーションの
顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme
カラーのグリフタイプアイコン 色の欄に"原則" とカッコ書きしたように、一応カラーのグリフボタンも存在する。しかしこれは明確に "色" が必要な場所にしか使われていない。 色付きグリフボタン (Mail.app) ユーザにとっての違い 大きくは表に挙げたとおりである。これからソフトウェアの利用者の視点に立った違いについて少し掘り下げてみよう。 必要なスペース グリフタイプはカラータイプよりも必要とするツールバーのスペースが小さい。幅に関しては固定ではなくそのグリフアイコンの画像の幅に依存するのだが、高さは固定でグリフタイプを採用した場合のツールバーの高さは54pxとカラータイプの61pxよりも7pxも節約できる。実際のウィンドウで見たときの差はけっこう大きい。 ただ、カラータイプのアイコンには「Use Small Size」という選択肢がある2。これを使えばツールバーの高さはグリフタイプと
スマートフォンやタブレットなどのモバイルデバイス向けにUIをデザインする際には、タッチ操作に適したコントロール表現を追求しなければいけません。 タッチ操作に適したコントロール表現とは、前回書いたジェスチャもありますが、それ以前に、ボタンやリンクなどのUI要素を指で押しやすい大きさにすることが大切です。 パソコン画面のマウスポインターと違って、タッチスクリーンにおいて指でボタンをタップする場合、指がそのボタンを覆い隠してしまうので、意図した場所に正しく触れているのか分かりにくく、またボタン自体の視覚的なフィードバックも確認しづらいという課題があります。 またマウスポインターではピクセルレベルで画面上の座標を指し示すことができますが、指先ではそのような細かい操作はできません。 ですからタッチデバイスでは、ボタンやリンクが細かく密集しているようなデザインは大きなストレスになります。 最低限の大き
2013年01月20日UIの改悪がUXを改善させる場合 TweetGoodUI≠GoodUXUIとUXについてはその理解について多くの議論がなされてきた。たとえば、Googleの及川氏は「写真が語るUXとUIの違い」というエントリにおいてコーンフレークの例を元にUIとUXについて説明したが、その後、ERATOの渡邊氏が「1分でわかるUIとUXをわかりやすく説明する写真とお話」というエントリにおいて、ATMを例によりわかりやすい説明を挙げている（次の写真は当該エントリからの引用）。 この例ではたとえUIが素晴らしくても、そのATMは時間がかかるため、長い待ち時間ができ、結果としてUXが損なわれる場合を示している。 しかしながら、実際にはATMの劣悪なUIが悪いUXの原因となっている可能性があり、本当にこのATMのUIは素晴らしいのかという疑問が残る。つまり「GoodUI ≠Go
どーも、有給という名の作業時間（リーサルウェポン）が喉から手が出るほど欲しいつなくっくです。 今日から2012年12月のKawazAdventCalendar開始ですね！ 土壇場にもかかわらず参加表明してくれた皆様、そして主催の@giginet、ありがとう！ そしてありがとう！ さて、KawazAdventCalendarの初っぱななので何を書こうかなあと考えていたのですが、思いつきませんでしたorz なので、KawazAdventCalendarとは別に考えていて書きためていたネタなのですが、「ノベルゲーUI作成時のtipsや意識すると良さげなところ」を書きたいと思います。 ノベルゲー企画者がメンバーにUIデザインのイメージを言う時、そして自分でデザインする時にどのようなものがいいのか指定する側はある程度UIデザインについて把握してないと困るなあと感じています。 知らなければどうしてもア
クックパッド株式会社 サービスデザイン部 UIデザイナー 片山 育美さん 美大で情報デザインを専攻し卒業。2011年に新卒でエンジニアとしてクックパッドに入社。同年8月よりUIデザイナーとして活躍。 今回紹介するワーキングビューティーは、株式会社クックパッドのUIデザイナー、片山育美さん。入社２年目にして新規事業の『やさい便』をはじめ、数多くのサービス開発に携わっている彼女。あまり聞きなれないUIデザイナーの仕事内容から、揺らがない仕事軸、そして根っからのエンジニア魂を感じられるプライベートに迫る！ 入社当初はまったく知らなかった 「UIデザイナー」の仕事 編集部：いまのお仕事は「UIデザイナー」ということですが、どのようなお仕事なのですか？UIとは「User Interface（ユーザーインターフェース）」の略で、仕事を簡単に説明すると、ユーザーがインターネットサイトの画面を使いやすく
![クックパッド 片山育美さん／UIデザイナーとしてユーザーが幸せになるものだけを作りたい【連載：ワーキングビューティー・アルバム Vol.11】 - Woman type[ウーマンタイプ] | 女の転職type](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2fb3798275ce15fec93611078875ad1c8415db2c05%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttps%253A%252F%252Fwoman-type.jp%252Fwt%252Ffeature%252Fwp-content%252Fuploads%252F2016%252F01%252Fog11.gif&f=jpg&w=240)
1000円前後、もしくはそれ以上の高額アプリをレビューしていく連載企画「今週の人柱」。第4回目となる今日は、初代FFのAndroid移植版をご紹介します。 移植なので操作しにくい キャラクター名の設定がやりにくいです。 おそらくオリジナル版ではコントローラーの上下キーで選択するところなのでしょうが、タッチパネルに変わったことで、どこを選択するのかもよくわかりません。 名前入力もやりづらい・・・。 スマホで入力しやすいようにはなっておらず、本当にただの移植のようです。 スクロールバーも反応が悪く非常に手間取りました。 端末のソフトキーボードで入力した場合の5倍は時間がかかったと思います。 チュートリアルが無い 設定が終わると、いきなり物語の世界に放り込まれます。 チュートリアルが無い！操作がわからない！ 左下にうっすらと浮かび上がっているマークが十字キー替わりなのですが、初
Androidの端末っていろいろあるな。同じAndroidでも違うよな。何が違うのかな、どれが使いやすいのかな。どうなの？ どうなの？ 米国の端末の話ですが。参考までにどうぞ。 Jelly Beanが発表されマスコットもグーグル本社でデビューしました。が、現在市場にある最新というとIceCream Sandwich。Android OSの歴史を見ても優秀で使い易いOSだと言えるでしょう。が、端末製造業者は独自の何かを良くも悪くも加えてしまうもの。全てのAndroid端末が同じなんて世界はないのです。これはAndroidにとって避けては通れない道なのです。どうせ避けられないのなら、どれが1番いいのか比べてみましょう。 比較するUI（ユーザー・インターフェース）はこちら。全てのカテゴリーの写真において、左から順にHTCのSense 4.0。Motorolaの新UI（元MotoBLUR）。そし
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
