そのWebサイトは「道具」ですか？それとも「広告」ですか？｜Goodpatch Blog グッドパッチブログ
突然ですが、みなさんがデザインしているWebサイトは「道具」ですか？それとも「広告」ですか？ 「Webサイト」と一口で言っても、ペライチのLPや、コーポレートサイト、ブランドサイト、また、Webブラウザ上でアプリケーションのような振る舞いをするものなど多岐に渡りますし、「EC機能を持つブランドサイト」のように「道具」でも「広告」でもあるようなWebサイトもたくさん存在しますよね。 そこで今回は、Webサイトが「道具」であるときと「広告」であるときの、その「境界線」がどこにあるのかについて考えていきたいと思います。 「道具」か「広告」か そもそも「道具」か「広告」かという考え方自体がどこから出てきたのか？という話から始めたいと思います。 筆者自身、キャンペーンサイトやコーポレートサイトのような、所謂「Webサイト」のデザインをすることもあれば、業務システムのような「Webアプリケーション」を
ユーザー体験の質を左右するナビゲーションのパターン６選
アプリはアイデアから生まれ、目的によって具体化されます。私たち起業家やデザイナー、開発者の関心は、最初から最後までスムーズな行程に沿ってユーザーを誘導して、有益な体験を与えることにあります。 あるリサーチによれば、65％近くのユーザーは、アプリ体験が好ましくないブランドを否定的に感じています。したがって決定的に重要なのは、ユーザーが労力を使わずに自分たちの課題の解決策にたどり着けるよう、インターフェイスのデザインをシンプルにすることです。 Gerry McGovern氏は『Usability: Navigation is More Important than Search』という記事の中で、機械に詳しい70％のユーザーはリンクをクリックすることからタスクを始めている一方で、残りの30％は検索から始めていることを明らかにしました。 これを踏まえると、ナビゲーションがユーザー体験でとても重要
UIのお作法。28個の「〇〇できそう感」をまとめました。｜maiokamoto
UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 １、進めそう感 ２、戻れそう感 ３、進めそう＆戻れそう感 ４、開きそう感（ドロップダウン） ５、開きそう感（アコーディオン） ６、開きそう感（モーダル１） ７、開きそう感（モーダル２） ８、カレンダーが開きそう感 ９、メニューが開きそう感（ハンバーガー） １０、検索できそう感 １１、入力できそう感 １２、検索できそう ＋ 入力できそう感 １３、パスワード入力できそう感 １４、パスワード感（強め） １５、間違えた感（エラー） １６、合ってる感（OK） １７、電話かかる感
サービス改善の成功率を8倍まで引き上げるユーザーテストの作法｜梶谷健人 / 新著「生成AI時代を勝ち抜く事業・組織のつくり方」
前回記事で本質的なUX改善によってプロダクトを伸ばしていくサイクルについて書きましたが、今回はその中でも特に重要なユーザーテストについて書こうと思います。 UX改善による本質的グロースハックのプロセス グロースハックは10回の施策で1回でも当たれば良い、とよく言われますが、自分はグロースハックのサイクルの中でユーザーテストを実施するようにしてから10回に8回は狙ったとおりに数値を改善することができるようになりました。 本記事ではグロースハックにおいて何故そこまでユーザーテストが強力なのかの理由と、ユーザーテストの実践方法の全体像について書いていきます。 ※ 今回は先の記事で書いた以下グロースサイクルのKPI設定が終わっている前提で進めます。 データ分析とユーザーテストの役割の違いまず、データ分析が「サービスの問題が"どこに"あるか」を特定するものであるのに対して、ユーザーテストは「サービス
UXデザイナー深津貴之が語る身も蓋もない組織論!? 「ユーザー目線のない会社からは逃げるしかない」「それでもそこでがんばりたいなら……」 | HRナビ by リクルート
PCやスマートフォンを開けば、そこには不愉快なUIが至るところにあふれている。さして文章が長くもないのにページが4分割されているニュース記事（腹立たしいことに4ページ目はたった1行だったりする）、サッカーのハイライト動画でシュートの行方をカメラが追い始めた瞬間に始まる動画広告、場面転換をするたびにCMが挟み込まれ、もはやCMを見ているのかゲームをしているのかわからなくなるアドベンチャーゲームアプリなど……。 さらに不幸なことは、ウェブメディアの編集部や動画配信者、ゲーム制作会社の制作現場にいる人たちにとっても、これは決して愉快な状況ではないということだ。罵詈雑言混じりの苦情が書かれたユーザー評価欄やSNSを見ながら彼らは言うだろう。「誰が好き好んでこんなUIを作るものか」と。 関わる誰から見てもおかしなUIは、それでもなぜ量産され世の中のストレスを増幅させ続けているのだろうか？ その負のス
「お金を払った感」はどのようにデザインすればよいのか｜Goodpatch Blog グッドパッチブログ
私たちは普段、お店でものを買う際には必ず「お金を払う」ということを行っています。現金やクレジットカード、交通系電子マネーに加え、最近ではApple Payなどのスマートフォンによる電子決済サービスも登場しています。そのような新しい決済サービスを使ったことがあるという方も増えてきているのではないでしょうか。 このブログでも度々注目されているお金とデザインのこと。先日起こった私の実体験を通して、このような「お金を払う」という体験のデザインについて考えてみたいと思います。 とあるコーヒーショップでの体験談：フィードバックの勘違い これは、とあるコーヒーショップでバーコード決済アプリを利用した際に体験した実話です。 さて、3コマ目で私はなぜ「会計が終わったな」と勘違いしてしまったのでしょう？ 振り返ってみると、会計時に私はこんなことを考えていました。 1コマ目：「電子決済アプリで支払いたい」 2コ
モバイルUI進化中！革新的なナビゲーションメニュー実例サンプル10個まとめ
モバイル向けナビゲーションデザインには、さまざまな形やスタイルが登場しています。すべてのナビゲーションメニューが同じ構造であれば、ユーザーにとっても直感的で分かりやすいかもしれませんが、現実はそれほど単純ではありません。 独自の問題を抱えたモバイルアプリは、ナビゲーションメニューのデザインによってそれらの問題を解決することもできます。たとえば、７〜8つほどの主要メニュー項目がある場合はおそらくハンバーガーメニューを採用し、３つほどのメニュー項目の場合はタブバー形式を実装するかもしれません。 デザイナーが製品やユーザーのために最適化したナビゲーションメニュー設計では、クリエイティブで画期的なデザインがいくつか見られます。今回は、ナビゲーションメニューを作成するときに参考にしたい、革新的な実例サンプル例をまとめてご紹介します。 ハンバーガーメニューが進化中！2018年に押さえておきたい最新トレ
スゴイのが登場！Webやスマホページを積み木感覚でデザインできる、日本語対応の無料オンラインツール -STUDIO
国産のツールでは初じゃないでしょうか。 Webサイトやスマホアプリのページデザインを積み木感覚で楽しくデザインできる無料のオンラインサービスを紹介します。 操作が非常に快適で、ちょっと触るだけでもかなり楽しめます。 STUDIO STUDIOは無料で利用できるオンラインサービスで、日本語版と英語版がリリースされています。 ヘッダやフッタ、コンテンツのコンポーネントなどをドラッグ&ドロップでぽんっと配置するだけで、レイアウトを完成させることができます。コーディングのスキルは一切必要ありません。 レイアウトはすべてレスポンシブデザインに対応しており、従来のデザインツールでは表現できない動きやスクロールの再現も可能です。 STUDIOの作例 さっそく使用してみました。 まずは、メールアドレスとパスワードを登録します。
キャンセルのキャンセル問題から考えるダイアログデザイン｜Goodpatch Blog グッドパッチブログ
この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……？ 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では
Webデザインのトレンドを採用するときの９つの注意点
Stephen Moyersはオンラインのマーケティング担当およびデザイナー、テクノロジーに詳しい熱心なブロガーです。彼はロサンゼルスに基点を置くSPINX Digital Agencyと契約しています。 音楽やアートなどのカルチャーと同じく、Webデザインにもその時代ごとの思潮があり、毎年新たなデザイン要素や機能、トレンドなどが発生します。また、デザインに対する考え方も、新しい技術の急速な発展に伴い急激に変化します。 Webデザインのトレンドの中には、時の試練に耐えられないものもあります。ユーザビリティを損なうトレンドやユーザーのサイト訪問を妨げるようなトレンドは避けるべきです。以下に挙げるトレンドは、ユーザーはサイトから離れてしまう可能性もあるので、これらを採用する場合は慎重にならなければなりません。 ネガティブスペース ネガティブスペースはホワイトスペースとも呼ばれ、画像やデザイン要
Googleデザインスプリントにおける５つのプロセス | UX MILK
リソースが不足し、予算が取れない中で、企業は成功のほどが不明な大規模のデザインプロジェクトへの投資に乗り気にはなりません。 そんな中Googleは、デザインプロセスを速くし、価値あるインサイトを提供する方法論を作り出しました。 必要最低限の機能を持った製品（MVP）のことは一旦忘れて、１週間以内にプロトタイプを作り出し、テストすることにフォーカスしてみましょう。 Googleデザインスプリントプロセスの概要 Googleデザインスプリントは、５段階のプロセスで構成されます。各段階のプロセスは実行するのにおよそ１日（８時間）かかり、５段階すべて実行するにはおよそ40時間かかります。 素晴らしいデザインプロセスでは、繰り返すこと（イテレーション）が重要です。実際には、最初のスプリントで修正案をつくり、そのあとに少なくとも２回のイテレーションを回すことが強く推奨されています。 また、自分のアイデ
使いやすいフォームデザインのための新しい４つのルール
大規模なECサイトにおけるUXチームのリードであり、レンセラー工科大学でヒューマン・コンピューター・インタラクションの修士号を取得しています。Webサイト、Twitter。 私たちは日々、オンライン上でフォームを使っています。購入を完了するため、メーリングリストやソーシャルネットワークなどに登録するため、ディスカッションに参加するため、美味しそうなランチの写真を投稿するためなど、フォームを使う場面はさまざまです。オンラインで情報を入力するために、フォームは必要不可欠と言っても過言ではありません。 しかし、長きに渡ってフォームの改善はあまり見られませんでした。「使える」ものではあったものの、「使いやすい」ものには至らなかったのです。 近年では新しいテクニックを正しく使うことで、デザイナーはより早く、簡単で、生産性のあるフォームの作成が可能になっています。 フォームは短ければ良いのか 「フォー
完全無料で美しい！参考にしたいUIキット50個まとめ 2017年保存版
ユーザーがウェブサイトを訪れたとき、まず目にするものがグラフィックデザインです。高品質なUIデザインを利用することで、ユーザーにサイトをより魅力的に見せることができます。 今回は、新しいデザイントレンドを取り入れた、完全無料ダウンロード可能なUIキットをまとめてご紹介します。 これらのUIキットを利用することで、クリエイティブで美しく、便利なウェブサイトやアプリデザインの作成をスピーディーに行うことができます。必要に応じてボタンやログインフォーム、ソーシャルメディアなどの要素を編集し、自由に利用することができます。 魅力的なウェブデザインを素早く仕上げる、すごい無料UIコンポーネント素材30個まとめ 完全無料でこのクオリティ！美しい新作UIキット50個まとめ 2017年版 Blog UI Kit ファイル形式: Sketch Prometheus | UI Kit ファイル形式 : PSD
U-NEXT キャリア
U-NEXTは、2007年にサービスを開始した動画配信サービスのパイオニア。「ひとりひとりに、最高の時間を配信する。」 をミッションに、いま次のステージに進むべく、新たなメンバーを積極採用しています。会社についての情報はコーポレートサイトもぜひご覧ください。
【デザインが生み出す価値】ビジネスの成功に直結するUXデザインとは デザイン会社 ビートラックス: ブログ
※この記事は2022年2月に最新の状態に更新されています。 UXデザインとテクノロジーの融合がこれまでに無い程に進んでいる現在、テクノロジーよりもデザインの重要性が高まってきていると感じる。新しい技術が開発されるたびに話題になるが、それが継続的に世の中に受け入れられるかどうかは、デザインが担う部分が非常に大きい。 それに伴い、デザイナーの仕事の内容と、ビジネスや社会に対するその影響力もどんどん広がっている。 これからはデザインの時代デザインと言うと、ああデザイナーの話でしょ、と言われる事が多々あるが、デザインとはビジネスに関わる全ての人にとって重要な考え方である。実際、特にアメリカや欧州では社内の全てのプロセスに”デザイン的思考”を取り込み、大きな成功を成し遂げている企業が増えている。 DESIGN ≠ Design最近では英語でデザインを表示する際に”Design”と普通に書く場合と、全
衝撃！スマホアプリのUIは3年でどのように変化しているのか調べてみた。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ いつも元気ハツラツ・天真爛漫・平成生まれゆとり世代、のんちゃんです。 わたしは中学2年生の頃から携帯電話なるものを使用し、友達とコミュニケーションをとっていました。ちなみにPCは小学4年生くらいから夢中に触っていて、親に電源抜かれたこともありましたねぇ。 ガラケーからスマホにしたのは5年前の大学1年生の時だったと思います。最初はAndroidでしたが、その後はずっとiPhoneです。 昔のiPhoneであろうとも、いまの充電器があればカメラロールとかメールとかを見返せるのがおもしろくて、実家に帰ってとてつもなく暇な時は、ひとりでそういった遊びをしています。 ちなみにすごくどうでもいいのですが、わたしはiPhoneを変更しても、あえて写真とかは引き継いで移行させません。 思い出は、そっと大事に眠らせておきたいのです。 さて、前置きが長くなりましたが、過去のiPhoneを漁ってい
優れたフォームをデザインする
サインアップのフローであれ、マルチビュー・ステッパーであれ、ありきたりのデータ入力であれ、「フォーム」はデジタル・プロダクト・デザインにおいて最も気を遣わなければならないものの1つです。 そこで、今回は一般的にフォーム・デザインで何をやり、何をやらざるべきかについてお話したいと思います。あくまで一般的なガイドラインですので、そのようなものとしてご理解頂いた上で、皆さんの参考になれば幸いです。
ハンバーガーメニューはもう古い！代わりに使えるモバイル用ナビメニュー5つまとめ
ウェブサイトを制作しているひとなら、モバイル端末におけるハンバーガー型ナビゲーションメニューの見つけにくさと効率の悪さ、またどれだけUXデザインの邪魔になっているのか、いくつもの記事を読んだことがあるでしょう。（この問題の参考にしたい記事はこちらやこちら、こちら、こちらからどうぞ。） 幸いにも多くのサイトやアプリで、より効率的な解決法となる代替アイデアが試されています。今回紹介しているアイデアは、他のものより優れているというわけでなく、コンテンツや内容によってパフォーマンスや実行できるかどうかは変わってきます。 01. タブ型ナビゲーションメニュー もしウェブサイトやアプリの項目が限られている場合、ユーザーはできるだけ素早くそカテゴリを切り替えたいところ。そんなときは、タブ型ナビゲーションが良い解決方法となるでしょう。 タブはもっともシンプルなナビゲーションパターンですが、デザインを制作す
よりよいUI／UXのために！やってはいけない7つのテキストライティング
アプリやウェブサービスにおいて、文章を明確、正確、簡潔にすることはユーザーインタフェース（UI）をよりよくし、結果的にユーザーからの信頼へとつなげられます。 UIを向上するために避けておきたいポイントがいくつかありますので、ここでご紹介します。 1．専門用語や特殊な言葉 専門的な用語やオタク用語は避けましょう。全てのレベルの読み手へ向けて、分かりやすい一般的な言葉を選び、ビギナーでも熟練ユーザーでも理解可能な文章にすることが大切です。 2．細かすぎる冗長な文章 最初から詳細を全て記載する必要はありません。ユーザーが探している時、そして必要な時にその情報が得られればいいのです。 実用的なポイント： 常に自分に、“ユーザーは本当にこれを知る必要があるのか？”と問いかける 3．大げさな約束、保証 絶対に、“絶対に”と書かないようにしましょう。 悪い例：“絶対に広告メールは送りません。” 良い例：
英語のUIにおける「Your」と「My」の使い分け
英語におけるUIのラベリングでは「Your」や「My」という言葉がよく使われ、UI要素とユーザーの関係性が直感的にわかるようになっています。言わずもがな、日本語と英語では表現は違ってきますが、この英語の使い分けの考え方は、UIをよりユーザーにわかりやすく整理するヒントにもなるかもしれません。 UIはユーザーの身体の拡張という位置づけなのでしょうか？ それとも全く別の立ち位置からユーザーに対して語りかける存在でしょうか？ これは、デザイナーがメニューなどでラベルを付ける際に、悩む問題です。 もしユーザーの拡張であるならば、ラベルは「My（私の）」という言葉が使われるでしょうし、離れた存在ならば「Your（あなたの）」という言葉が使われるでしょう。 正しい言葉で説明文を付けることで、ユーザーは探しているものを見つけやすくなります。同時に、サイトにより集められたコンテンツと、ユーザーにより作成さ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
