サクサク感をデザインする
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog ヤフオク!アプリ開発部の中島(@52shinNaka)です。今日はデザイナーの立場からサービスの体感速度をテーマに記事を書いていきます。 サクサク感の正体 サクサク動くサービスと聞いて、どんなサービスを思いつくでしょうか？サクサク動くを分解すると下の２要素に分かれると思います。 表示速度は、純粋にコンテンツが表示されるまでの時間、体感速度は、実際にプロダクトを触って感じられた時間の長さです。触っていて「サクサク動く！」と感じられるサービスは、上の２つの要素が満たされていることが多いです。 表示速度はサービス利益に直結する デザイナーが日々の作業の中で表示速度を意識するタイミングは少ないかもしれません。しかしグロースステージにある多
当初の懸念どおりブラウザのプッシュ通知は邪悪に使われはじめている。実装側はクリックまで購読確認を待つべき。 - mizchi's blog
追記: 2019/11/12 2年経ったけど体験が悪化し続けた結果、 Firefox がこの記事の通りになりましたね… www.fxsitecompat.dev プッシュ通知、ネイティブアプリの機能郡をWebに持ち込むPWA技術の売りの一つだが、当初から懸念されていたとおり、非常にノイジーなものとなってしまっている。自分も気づけばあらゆるサイトの購読確認を、無意識で拒否を押すようになってしまった。 hagex.hatenadiary.jp 少し前の記事。最近はどこかで wordpress のプラグインになったのか、目にする機会が非常に多くなり、非常にストレスフル。最初は技術的な目新しさからか、ある程度容認していたが、さすがにこの状況が悪化する一方で、本気でやばいんじゃないかと思っている。とくに初見のブログの記事を読む前に、購読確認が出るのが最悪の体験となっている。 そもそもプッシュ配信とは
ステータス増減の青と赤
ゲームによって プラスが青マイナスが赤 と プラスが赤でマイナスが青 があってわかりづらい 赤って言うと数字的に赤字とか赤点とかマイナスイメージあるけど、赤はアップで青はマイナスってイメージもある 最近だとどっちのほうが多いんだろう
1ヶ月続けた“勝手にUI改善”の振り返り
他にもairbnbのトレースやTwitterのトレース等も行いました。 ある程度UIを設計する際のルールを掴んではきましたが、自分で能動的に考えて手を動かした訳ではないため物足りなさを感じていました。(トレースからの学びはたくさんあったので、独学から始める方は最初にトレースから始めることをオススメします) その時、カイさんから何かアプリを作ってみるか既存アプリのリデザインをやってみると良いよと言われました。 1からアプリを考えるのも良かったのですが、既存アプリのリデザインの方が手軽に始めることができそうだと思ったので、“勝手にUI改善”を始めることにしました。これが私が“勝手にUI改善”を始めた背景です。 ちなみにアプリのリデザインを継続させるモチベーションとして自分の思考過程をTweetすることにしました。 たまにいいねとかリプライくるので、嬉しくて毎日続けたくなりますw 継続できないよ
Belajar Bahasa Inggeris Online 2022 (Kelas English 1-to-1)
Kalau anda teringin nak fasih English, boleh belajar Bahasa Inggeris online dengan kami. Kelas dijalankan menggunakan Zoom / Google Meet. Kelas Bahasa Inggeris Online Ini Khas Untuk Orang Dewasa Yang Faham English, Tapi Bila Speaking: Ayat Berterabur, Grammar Hancur Dalam proses nak fluent English, kenapa mesti malu? Kami di JomEnglish Academy faham, anda nak sangat cakap smooth dan rasa confident
デザイン時に気を付けたい目的と手段の取り違え
デザインする時、手段ばかり追ってしまい、「( ﾟдﾟ)ﾊｯ!そもそもの目的ってなんだっけ」ってなりがちなので、気を付けたいなと思いまとめてみました。 1. 目的をしっかりと認識する 例えば、上のようなボタンをデザインしたとき、「もっと目立つように大きく、色も赤とか目立つ色にしてください」という修正指示を受けたとします。 「目立たせる」という目的の解決策として、「大きくする」、「赤などの目立つ色を使う」という2つが考えられています。そしていつの間にか、これらの解決索が目的にすり替わっていることが無いでしょうか。 「大きくする」、「赤などの目立つ色を使う」ことを行えば目的を達成できるかのように錯覚するのですが、その解決策は本当に最適かを考える必要があります。そもそもの目的は「ボタンを目立たせること」で、その解決策は他にもあります。 2. 他の手段も考える 「目立たせる」ためには、差別化する、近
UI改善ブログ｜EFO（エントリーフォーム最適化）とCTA（WEB上の行動喚起）のノウハウ・最新情報をお届け
株式会社エフ・コードは、2017年9月21日（木）17：00～18：00に【今さら聞けない】何のためにWeb接客をするの？基本と成功事例ご紹介セミナー(参加費無料)を開催いたします。 ＞＞＞＞ 詳細ページ・お申込みはこち […]
デザインスプリントとブルーボトルのプロトタイピング（翻訳）
本記事は、最近日本にも上陸したBlue Bottle Coffeeが行ったデザインスプリントについての翻訳記事である。（オリジナル）。デザインスプリントとは、Googleの投資部門Google Venturesが投資先に行うデザインワークショップ。Googleはオンラインでの売り上げが伸び悩むBLUE BOTTLE COFFEEと彼らのエージェンシーに対し、一週間のデザイン／プロトタイピングワークショップを行い、大きな成果を出した。以下、そのプロセスとなる。 BLUE BOTTLE COFFEE 私たちはブルーボトルコーヒーの新しいサイトデザインを手伝い、売り上げと滞在時間を伸ばしました。 ブルーボトルは美しいカフェと精緻なコーヒーにより、熱狂的なファンを生み出しました。しかし彼らのサイトは、そのブランドを表現しきれず、ウェブによる売り上げは全体利益のたった10%でした。 チャレンジ ブル
こんなにあった！シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由 | マミオン有限会社-パソコン・数学研修、法人研修
シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。 シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康食品の『皇潤』で有名なエバーライフです。 今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。 1. 各フォームがそこそこ大きく見やすい 2. 必須項目表示がわかりやすい 3. ふりがなが自動的に入力される 4. 住所が自動的に入力される
物事の本質とデザインの価値 / Maka-Veli .com
デザイナー不要説。もちろんデザイナー必要だと思うんです。 けど、 安い物、人が使ってる物、ブランド物、そういうのが人気な日本だと本質無視するコンシューマーが多いし、それどころか企業もそれがわかってるから、当然狙ってきます。売れなきゃやらないです。 しっかり調査して、調査結果を元にブランディングして広告もバンバン打ち出して、あたかも流行ってるイメージを固めて打ち出す。そんなのが主流ですよね。 海外で人気の （ほら、ハリウッド女優も使ってる。お前らなんかよりイケてるあの人たちが使ってるんだから使うしか無いでしょ） あのブランドが （ブランド品です。ブランド品は品質が良いのです。） ついに日本上陸！ （今まで買えなかったよ！プレミアムだよ！） 消費者タレントのAさんの声「すっごく良いです！」 （なんで使えてるんだろうね？海外から輸入してるのかな？ほら、タレントだからね）
情報がないことを伝えるUIデザイン | UXデザイン会社Standardのブログ
「Empty Data（またはEmpty Status）」というUIパターンがあります。タイムラインやドロワーなどデザイナーであれば知っているUIパターンの名称に比べると、あまり日本では聞き慣れないのかもしれません。Empty Dataは簡単に言うとデータがない時のUIになります（Webでの404に近いですが、少し違います）。では、Empty Dataを知るためにもう少し詳しく紹介していきたいと思います。 参考：モバイルデザインパターン 第2版 ―ユーザーインタフェースのためのパターン集 Empty DataはUIである Empty Dataはただユーザにデータがないことを示すだけではありません。ユーザにデータが存在しないという情報をフィードバックし、どうしたらここに情報が入るかのアクションに繋げる立派なUIです。もしEmpty DataのUIが存在しなかったらユーザはどのように感じるでし
tracing-framework by Google
Rich Tracing Choose what methods to trace and add custom data to each event. Track asynchronous flows and actions. Slick Visualization Smoothly dig through millions of events in an awesome UI. See patterns and understand your code like never before.
ビジネス向けモバイルアプリケーションのUIガイドライン、セールスフォース・ドットコムが公開。アイコンなどダウンロード可能
ビジネス向けモバイルアプリケーションのUIガイドライン、セールスフォース・ドットコムが公開。アイコンなどダウンロード可能 先週13日に、SAPが業務アプリ用のJavaScript製UIライブラリ「OpenUI5」を公開したとお伝えしたばかりですが、今度は、米セールスフォース・ドットコムがHTML5でのビジネス向けモバイルアプリケーションのUIガイドラインやサンプルを多数公開しました。ビジネスアプリ用のモバイル開発環境はHTML5/JavaScriptで急速に充実してきています。 米セールスフォース・ドットコムは先月、新ブランド「Salesforce 1」を立ち上げ、モバイルへ全面的にシフトすることを宣言したばかり。このスタイルガイドは、同社のモバイルへの注力を示すものといえるでしょう。 これまでビジネスアプリケーション向けに、モバイル対応のしっかりとしたスタイルガイドが公開された例はおそら
マンガ家になろうとマンガ書きまくってたらいつのまにかUIUXデザイナーになってた
「大人になったらマンガ家になる」。そう言って、塾や学校をさぼっては古本屋に通い詰め、マンガを書いて読み続けた結果。UIUXデザイナー(職種としては開発系webディレクター)となるに至った。 今もマンガは好きで、佐々木倫子や羽海野チカの新刊が出ては本屋に走るし、ブックオフで『なんて素敵にジャパネスク』とか『きらきら馨る』を一気に買ってきては「ヒサギかっこいいー」ときゅんきゅんしている。 「ホットロードが映画化される、主演は能年ちゃん」ときまってからは再びホットロード熱が上がる始末。現在、会社の先輩とともに、『ホットロード』『瞬きもせず』などの紬木たく名著を回し読みしている。半徹夜でクッソ忙しい日だってちゃんとマンガは読みつづけている。先日ついに会社のノートのすきまに春山書いてしまった。その中毒性は押して測るべし。 マンガを読んで書く過程と同じように。 UIを作ることには、中毒性があると思う。
タブの正しい使い方
13のデザインガイドラインを守ってタブを使っているサイトにYahoo Financeがある。しかし、AJAXの使い過ぎや改善の余地が残るカスタマイゼーションのページなどを見る限り、ユーザビリティはまだ上げられる。 Tabs, Used Right by Jakob Nielsen on September 17, 2007 Web上でダイアログコントロールを正しく使っているユーザ・インターフェイスを見かけることは滅多にない。ラジオボタンやチェックボックスのように単純なものでさえ、正しく使われていないことが大半だ。ドロップダウンメニューに至ってはもっとひどい状態だし、Flashサイトを台無しにする自作のスクロールバーも後を絶たない。 最近リニューアルされたYahoo Financeのホームページでは、タブを正しく使っている。2箇所ほど抜粋してご覧に入れよう。 Yahoo Financeのホー
『スマホデザインにおける、忘れがちな5つのルール』
皆様、こんにちは。 Ameba コミュニティ部門 チーフクリエイティブディレクターのサトウ（@sugaar）です。 今回は、弊社コミュニティ部門における、サービスクオリティの向上とデザイナーのスキルアップを目的として開催している、「デザイナーロワイヤル」についてご紹介すると共に、普段忘れがちなスマホデザインの5つのルールをまとめさせて頂きます。 デザイナーロワイヤルとはデザイナーロワイヤルとは、8～10名のデザイナーが、お題となったAmebaサービスを使い込み、自分なりのブラッシュアップ案を持ち寄って点数を競う、バトル形式の会議です。 発表者以外にも、誰でも傍聴参加が出来るこの会議。 他のデザイナーの提案を間近で聞けるという事で、 回を追う毎に傍聴人が増え、会議終盤では熱気に包まれるほどの人気会議となりました。 そんなデザイナーロワイヤルの詳しい内容については、弊社「広報ブログ」で取材頂い
「設定次第で何でもできる万能アプリ」がクソアプリである理由と、その向うにあるパラダイム - 石橋秀仁(zerobase)書き散らす
【これはとてもひねくれた文章なので、「実用的な情報を速やかに収拾したい忙しいビジネス・パーソン」は読まないほうがいい。警告はした】 【役立つ部分をさくっと読みたい方はシンプル版を用意しました】 fladdict氏の『スマホUI考（番外編） 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する』は素晴らしい記事だ。 その記事のコメント欄でのやりとりが気になった。 【某氏】 先生！ 設定画面で全てのUI機能要素を ON/OFFしたり、configファイルの編集でボタンのレイアウトを変更できれば良いと思います！ 【fladdict氏】 その思想をつきつめると、設定オンオフで音楽プレイヤーからFacebook閲覧までユーザーが自在に切り替えられる万能アプリへの道に進むのです・・・ 【某氏】 やりたいことが何でもできる万能アプリの複雑性と、デフォルト設定のシンプルさは両立しますからね。初めて
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
UX MILK
Material Design
キュートな配色がかわいい！センスが光るUIエレメントが揃ったPSD素材