DNP、読む速度を約2倍にする自動レイアウト技術
「Amazonのプライムビデオが難しい」というおかんの言い分を聴いてみた｜Tsutomu Sogitani
大阪の実家に帰った時、リビングのテレビの裏側を見たらAmazonのFire Stick TVが挿してありました。このFire Stick TVをテレビに繋ぐと、Amazonのプライムビデオを観ることができるようになります。 プライムビデオには、Amazonプライムの会員であれば、追加費用を払うことなく楽しめる映画やドラマ、アニメなどが豊富に揃っています。さらに個別に追加金額を払うとほとんどの映像コンテンツを観ることができるという、まさにTSUTAYAキラーなサービスです。 うちのおかんは月に2～3回は映画館に行くほどの映画好きなので、プライムビデオのメインターゲットといえるでしょう。本来ならプライムビデオで映画三昧の毎日を送っていてもいいはずです。 しかしながら、Fire Stick TVを挿しているにもかかわらず、プライムビデオを一度も使っていませんでした。初期設定をした私の弟が一通り使
誰がインフルエンサーだったのか
Introduction SNSの情報発信源として強い影響力を持つ人をインフルエンサー（influencer）と呼ぶ。日本でツイッター投稿が盛り上がった10月の衆院選を分析すると、選挙のインフルエンサーの意外な姿が浮かび上がった。 データ出所：NTTデータ。リツイート含む。年代はNTTデータが推定した もっとも注目されたTweetは トランプ氏の４倍衆院選期間中の「選挙」にかかわるつぶやきをリツイート数の多い順にランク付けしたところ、トップ5はすべて4万を超え、最も多いもので9万近くに上った（10月下旬）。頻繁なツイッター発信で知られるアメリカのトランプ大統領でも、11月の来日時のつぶやきでみればリツイート数は多くて2万台。ランキング上位のつぶやきはトランプ氏の倍以上の影響力があったことになる。上位に並んだのは、投票を呼びかける前向きなつぶやきだ。 RANK Tweet DATE RT 1
クソ酷いウェブサイト
他に何がほしいってんだ、クソ野郎 お前はウェブサイトを作ってその糞サイトを最高だと思ってるんだろ？ お前は13MBに及ぶパララックスエフェクト付きのクソ重いページがアホらしいグッドデザイン賞をとるとでも思ってるんだろ？ お前は20kgあるjQueryファイルと83個のpolyfilがIE7をまともに動作させると思ってるんだろ？ どアホ、お前は間違っている。俺様が俺の考える最強のウェブページを教えてやる。 クソ軽量でクソ速いページ 全てのデバイス幅に対応できる どんなうんこブラウザでも見た目が一緒 お前のサイトに訪れるどんな糞野郎でもアクセス可能 読みやすく伝えたいことが明確（もっともお前が5MBサイズのシャレオツなコーヒー写真ではなくて伝えたいことがあればの話だがな） よく聞け、糞野郎ども お前らはハッキリ言ってオーバー・デザインだ。この史上最強のウェブサイトを見てみやがれ。俺がごみコンテ
なぜメニュー表示用ボタンの「ハンバーガーアイコン」はダメなのか？
スマートフォンなどのモバイル端末用UIでよく用いられる「三」のマークのアイコンは、ハンバーガーのように見えることからアメリカでは「ハンバーガー」アイコンと呼ばれています。徐々に浸透してきたハンバーガーですが、UIデザインの優劣という観点から見た場合、「劣った醜い撲滅すべきものである」という意見が出されています。なぜハンバーガーがダメなのかについて、ジェームズ・アーチャー氏がデータ分析結果を基に理論的に解説しています。 The Hamburger Menu Doesn't Work - Deep Design http://deep.design/the-hamburger-menu/ 下の画像の赤丸で囲われたのが「ハンバーガー」。モバイル端末UIだけでなくデスクトップUIでも広く普及したアイコンで、クリックすることで主にメニューなど他の追加情報を表示させられます。 ◆不親切 一般的に普及し
クレジットカードフォームの解剖学 | POSTD
オンラインでクレジットカードを使って支払うことは簡単ですよね？この答えはYesでもNoでもあります。Yesの理由は、インターネットが普及された初期からずっとそうしていたから（例：Amazon）。Noの理由は、まったく同じクレジットカードフォームは2つとないからです。 過去20年以上で、私たちはオンライン支払のメンタルモデルを作り上げてきました。「財布からクレジットカードを取り出して、ウェブのフォームに必要なカード情報を入力、そして申込みボタンを押す」というものです。しかし、ユーザーが答えないといけない質問でいっぱいなので、全てを入力するのはとてもややこしい行為になってしまいます。そして言うまでもなく、誰も取扱い説明書なんて読みたくありません。 さまざまな有名ウェブサイト・アプリのクレジットカードフォーム 何かの代金をオンラインで支払う時は、人へ支払う時より2,3倍遅れをとります。端末のボタ
感覚派デザイナーも知っておいて損はない「デザインの要素と原則」 | WebNAUT
「Thoughtful design」を追求する総合デザインパートナー、株式会社ビーワークス マーケティングデザイン事業部の情報発信アカウントです。 https://beeworks.co.jp/
「エンジニア病」を抱えたあなたに効く「デザインの考え方」 ～ソニックガーデン・デザインメンター対談のまとめ～ - give IT a try
はじめに 先日、僕が勤務しているソニックガーデンのブログ記事で、弊社プログラマとデザイナーさんの対談記事が公開されました。 【前編】エンジニアの会社でデザインがうまくいくワケ〜「エンジニア病」にはダメ出しされよう 【中編】プログラミングとデザイン、やっていることはわりと同じ〜「デザインは感覚じゃない」 【後編】デザインできるプログラマの育てかた〜「デザインメンター制度」のキモは理由で納得！ インタビューに登場する町田さん（@machida）と赤塚さん（@ken_c_lo）は僕もよく知っているとても素晴らしいデザイナーさんです。 素敵なデザインができるのはもちろん、HamlやSassなどプログラマ寄りの技術知識も豊富に持ち合わせていますし、物腰も柔らかくてとても相談しやすい方たちです。 業界の各方面から引っ張りだこなのも十分頷けます。 ところで、上の記事の中に出てくる「デザインメンター制度」
Yahoo!ニュースの見出し行間「5ピクセルの差」に見えた光～ヒートマップでUI改善
社長の宮坂がゲスト出演した、11月27日放送のテレビ東京系「カンブリア宮殿」。Yahoo!ニュースの裏側にも触れられており、ご覧になった方もいらっしゃるかもしれません。 （放送バックナンバー：爆走する国民的サイト！これがネットの底力だ！－ テレビ東京） 公式ブログ新コーナー「news HACK」ではこれまで、Yahoo!ニュースにおけるスマホ利用の成長などをお伝えしてきましたが、今回は、同番組の中でも登場したYahoo!ニュースのUI改善事例について、番組で触れられなかった部分も加えて詳しくお伝えしたいと思います。 これからご紹介するのは、スマホブラウザ版Yahoo! JAPANトップページのA/Bテスト事例（※Yahoo!ニュースのアプリ版との違いなどについては、こちらの記事をご参照ください）。 テスト結果は現在のスマホ版トップページに使用されているものと同様ですが、まず具体的な説明に入
デザインは理屈で学べる！ エンジニア向けデザインメンター業が求められる理由について聞いた | HRナビ by リクルート
アイデアは面白いのに、どうもダサかったり、UIがわかりにくかったりするWebサービスに出会ったことはないだろうか。 それはもしかすると、デザインを知らないエンジニアが、ふわっとした感覚と印象で作っているからなのかもしれない。そんなエンジニアでも、デザインのセンスを身につけることはできるのだろうか？ プログラマー向けにデザインを教える“デザインメンター”赤塚妙子さんに話を聞いた。 プログラミングを学んだデザイナーが始めた“デザインメンター業“ 今年の1月から“デザインメンター業”を始めたフリーランス デザイナーの赤塚妙子さん。美大を卒業後、デザイン事務所に就職。その後、Webの世界へ足を踏み入れ、今ではRuby on Railsの開発に参加するまでになった。 「自分がプログラミングを覚える中で、デザイナーとプログラマーが歩み寄る感じが面白くって。デザイナーがプログラミングを覚えることはあるけ
モバイル向けUI/UXデザイン10のポイント デザイン会社 ビートラックス: ブログ
日々めまぐるしく変化するモバイルマーケットにおいて、マートフォンアプリやモバイルWebのUIやUXを最適にデザインする事はそのプロダクトがヒットするかの大きな要素となっている。特に最近は見た目が良いだけではなく操作性が非常に高いモバイルサービスが次々とリリースされユーザーが求めるクオリティレベルも上がっている。 小さな画面サイズ、様々な利用シーン、複雑な仕様の機能を実装したモバイルサービスにおいては、高いユーザビリティを実現する事が何よりも重要である。よりユーザーに愛される為もポイントをまとめてみた。 1. レイヤースタイルのUIで奥行きを出す モバイルのインターフェイスに関しては、最近のトレンドを見てみると、フラットなUIがトレンドのように思えるが、実はモバイルの限られたスペースでユーザーに効果的なエクスペリエンスを提供するには、縦と横のスペースに加え、”深さ”を利用したレイヤースタイル
アイトラッキング調査で判明した8つの原則 - SEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
無料で資料をダウンロード SEOコンサルティングサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする ＞＞ アイトラッキング調査といえば、画面上のユーザー目線を追うことで、普段気付かないウェブデザインの問題やユーザビリティ上の課題を見つけ出そうという試み。サイトのコンバージョン率改善には確実に役に立つであろう手段ですが、準備の大変さや費用も重なり、中々実現できている企業は少ないと思います。今回、既に公開されている様々なアイトラッキング調査を調査し、そこから学べる要素を引き出した記事を紹介します。ある種、鉄板といえるルールに集約されていますが、筆者は有名デジタルマーケッターでありヒートマップツールで有名なCrazyEggの創業者ニール・パテルだけに、分析内容含め学べる点は多そう。 — S
速攻ブクマしとけ！ ゲリラ豪雨対策の決定版、気象庁の「高解像度降水ナウキャスト」が稼働開始 | ねとらぼ
気象庁は8月7日午後1時より、従来の「降水ナウキャスト」に変わる新サイト「高解像度降水ナウキャスト」の提供を開始した。30分先までの詳細な降水域予測が可能で、ゲリラ豪雨の予想などにも活用することができる。 高解像度降水ナウキャスト 従来の「降水ナウキャスト」では1キロ四方単位だった観測範囲がより詳細になり、「高解像度降水ナウキャスト」では250メートル四方単位で降水域を確認できるようになった。直近の雨の動きと、今後の降雨域予想がアニメーションで一度に見られるのも便利。そのほか、アメダスの10分間雨量値や、竜巻・雷の予測なども重ねて表示することができる。
入力フォーム改善でCV率1.6倍！成果を上げる18のテクニック | LISKUL
せっかく入力フォームまでたどりついたユーザーの約50％が、目的達成に至らず離脱していることが分かります。 広告がネット上での集客なら、入力フォームは接客の一部です。 コンビニでお菓子を買おうとレジに並んだが、列がなかなか進まず、買うのをやめてしまうことがあるでしょう。この場合、列が早く進んでいたら、そのまま買っていたわけです。 入力フォームも同じで、欲しいものを手に持ったユーザーがレジに来ているのに、入力フォームが使いにくいというストレスのために、途中でやめてしまうことがあります。 だから、入力フォームを改善するだけで、必ず成果が上がるのです！ 3. 入力フォーム改善テクニック18選3-1. 絶対おさえる基本の9ポイント1. 項目数は最低限にする 参考：J&B Labo 上記の例では入力項目を減らしただけで、コンバージョン率が1.3倍になっています。 ユーザーの離脱理由第1位にもあったよう
アプリUI/UXデザイナー必見！「ハンバーガーボタン」ナビゲーションを使うとユーザーエンゲージメントが半減することが発覚 | ゴリミー
あなたが作っているナビゲーションボタンは今流行りの「ハンバーガーボタン」、またの名を「ナビゲーションドロワー」を採用しているだろうか。それとも一覧で表示している「タブボタン」を採用しているだろうか。 クリーンでシンプル、メインコンテンツの表示領域が最も広く確保できるなどいいこと尽くしの「ハンバーガーボタン」ナビゲーション。一方で、常にボタンが表示されメインコンテンツの表示領域が必然的に狭くなってしまう「タブボタン」ナビゲーション。見た目のデザインとしては当然「ハンバーガーボタン」の方が良い。では実際にユーザーとしても同様の見解なのだろうか。 クリーンでシンプルだが、ユーザーは操作方法を覚えられない 「ハンバーガーボタン」もしくは「ナビゲーションドロワー」と呼ばれるナビゲーションUIは数多くのアプリに見られる。Googleもアプリデベロッパー向けにオススメのデザインパターンとして推奨している
［速報］Googleが新しいUXの体系「Material Design」を発表。あらゆるデバイスとスクリーンに適用。Google I/O 2014
［速報］Googleが新しいUXの体系「Material Design」を発表。あらゆるデバイスとスクリーンに適用。Google I/O 2014 Googleは6月26日（現地時間25日）、米サンフランシスコでイベント「Google I/O 2014」を開催。次期Androidの「L」とともに、今後Googleがあらゆるデバイスとスクリーンに適用する新しいUXの体系「Material Design」を発表しました。 基調講演では次期Androidの「L」が今日からデベロッパープレビューとして公開されると発表。AndroidのOSにはアルファベット順のコード名が付いており、次期AndroidはLから始まりますが、まだコード名はついていません。 Lでは、Androidのユーザー体験を最初から考え直した新しいUXの体系「Material Design」を採用。基調講演で行われた「Materia
小さい子どもにコンピュータを触らせるということ - ビスケットのあれこれ
ビスケットは，開発して新しい機能を追加したときなど，必ず子どもたちが使っている様子を自分目で見てどんな風に使っているかを見てきます（最近はその暇が無くて他人に任せていたりして，かなりまずいんですが）．3年前くらいの面白いエピソードをご紹介しましょう． ちょうど，Androidタブレットで動くビスケットを開発していて（これはまた一般には配布していません．実験環境だけです），それがどのように子どもたちに使われるか見に行きました．僕としても指で直接操作するタブレットのUIの開発は初めてで．実は，マウスとタッチペンの操作は結構似ています．どちらも，非常に小さいエリアを結構正確にポイントできて，ドラッグもできますから．どちらかというと，ペンの方がドラッグが得意でしたね．小さい子はマウスクリックが全然出来ないとか（ボタンを押すときに指先だけ押すということができないので，手を握ってしまって，その結果マウ
入力フォームのプレースホルダーを使ってはいけない
入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ソニー損保のWebマスターが部内で作った“行動指針「わかりやすさのその先へ」十か条”がスゴイ！ | 稲富滋のWebマスター探訪記 | Web担当者Forum
セキュリティ診断・検査のGMOサイバーセキュリティ byイエラエ
