こんにちは！株式会社Rabeeのデザイナーのakaneです🐏 今回は、ヘッダー（グローバルナビゲーション）のデザイン事例を調べてみました！パターンごとに分類しながら紹介していくので、どうぞ最後までお楽しみください✍ はじめに：グローバルナビゲーションとは？グローバルナビゲーションとは、Webサイトの全ページに共通して表示される「主要なコンテンツへの案内リンク」です。 一般的には画面上部のヘッダーに設置されることが多く、ユーザーが「今、どこにいるのか？」「目的のページはどこか？」と迷わないように誘導する大切な役割があります。 どんなサイトを作るときもほとんど必須のパーツですが、わたしは気付けばいつも似たようなレイアウトを使いがち…。そこで今回は、グローバルナビゲーションのデザインを100事例見比べて分類してみます🔍 ・ ・ ・ 1. スタンダード型まずは、一般的に「ヘッダー」の言葉で想像
This guide is open source, please go ⭐️ it on GitHub and make suggestions/edits there! https://github.com/FrontendMasters/front-end-handbook-2024 1. Overview of Field of Work This section provides an overview of the field of front-end development/engineering. 1.1 — What is a (Frontend||UI||UX) Developer/Engineer? A front-end developer/engineer uses Web Platform Technologies —namely HTML, CSS, and
こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 最近、プロダクトやサービスの内容を紹介する手段として、イラストやモーショングラフィックなどを用いた動画が使用されているのをよく見かけます。 そこで今回は、サービスの内容を1~2分でまとめたサービス紹介動画を複数ピックアップし、その構造を分析してみることにしました。 はじめに本記事を書くに至った経緯私は現在、映像のデジタル合成やモーショングラフィックの制作などができるAdobeのソフト“After Effects”の学習をしています。 直近のゴールとして、モーショングラフィックを用いたサービス紹介動画を作れるようになろう！ということで、今回の記事はその学習の一環としてまとめました✍️ 動画で伝えるために大切なことAfter Effectsのスキルも重要なのですが、サービス紹介をする上でより重要なのはそのストーリー構成
Guppi @clgldh2119 大学4年間この機能のおかげで いくつもの課題たちを助けられたが 社会人になりOutlookになったせいで 添付忘れ今のところ2回してる。。。。 Gmailに甘やかされた証拠。。 x.com/shinagawajp/st… 2024-04-19 20:38:40
大型書店が好きな自分にとって理想的なアプリだったhonto withのこと - golden-luckyの日記
ほぼすべての個人が専用の情報端末を持ち歩く社会でありながら、印刷製本された「紙書籍」というパッケージの形で知識や物語に接することを好む人がまだまだ十分に多く、その小売りに特化した店舗が「書店」として成立できていた2024年、それでも年々縮小する需要の前に小規模な書店はすでに次々と姿を消し、紙書籍を求める人たちの受け皿として役割を果たしていたのは都市部に残された大型書店だった。それら大型書店の広大な店頭には無数の紙書籍が並び、しかもそれは毎日のように増大していく。なぜなら紙書籍は、それを生み出すことを生業とする出版社にとって、たとえ読者の手に渡ることがなくても流通に載せさえすれば収益になる商材でもあったからだ。産業の末路である。 紙書籍を好む人の多くは大型書店が好きだったと思う。コンセプトが明確でエッジを効かせた小規模書店への憧れはあるけれど、必ずしも選書や店主が個人のバイブスに合うとは限ら
BtoBサイト改善ガイド | 才流
自社に合ったキーワードを入れるだけでテキストリンクCTAが作成できるテンプレート集です。あらゆるパターンを想定した内容となっているので、複数パターンを組み合わせて作成いただくこともできます。
この記事は enechain Advent Calendar 2023 の18日目の記事です。昨日は okp さんの「経験が裏目に？！大手IT企業出身PdMが3カ月で学んだこと」でした！ はじめに なぜ、今ダークモードか ダークモードおさらい ダークモードの歴史 ダークモードって意味あるの？ 省電力の効果について 文字が見やすい＆目への負担が少ない ダークモードの利用率 各サービスのダークモードの実際 2023版 X Gmail ミュージック & App Store Instagram iSPEED ダークモード未対応のアプリ＆ダークモードのみのアプリ ダークモード未対応のアプリ ペイ系 ショッピング系 ダークモードのみのアプリ ダークモードの行方 まとめ はじめに 私はenechainのプロダクトデザイナーで、デザインマネージャーの近藤です。今年の10月に入社しており、もうすぐ3ヶ月が経
KFCのアプリやばすぎて笑う
KFCのアプリが最近リニューアルされたんだけど、稀に見るやばい出来になってて笑える。 これまでのアプリは特段大きな不満もなく使えるものだったのに、何故かいきなりアプリが刷新された。 【新アプリの惨状】 ・これまでのアプリでは会員未登録でもマイルが貯まる仕様だったが、新アプリ移行後は会員登録しないとマイルが貯まらない仕様に。 で、会員未登録のままアプリをアップデートしたユーザーのマイルはすべて消滅。 ・アップデートで未登録会員のマイルが消滅する旨について碌な告知もなかった。 ・アプリに合わせて（？）リニューアルした公式サイトが内容すっからかんでやばい。 https://www.kfc.co.jp/ ・会員登録しようとすると入力画面の携帯電話番号と郵便番号を入力出来る桁数が足りず詰む。 ・ログインの為にワンタイムパスワードが必要だが、送られてくるSMSのパスワードが空欄で詰む。 ・そもそもたか
スクロールフェードがユーザブルというよりも気が散るものになるかどうかは、その持続性、応答性、ページ上の要素への控えめな適用といった要素に左右される。このデザインパターンを正しく用いれば、ブランド認知を向上させ、ページの読み込みを最適化し、コンテンツをより理解しやすくすることができる。 Scroll Fading 101 by Sara Ramaswamy on December 8, 2023 日本語版2024年4月11日公開 はじめに スクロールフェードは新しいデザインパターンだ。これは、スクロールによってトリガーされるアニメーションを指し、ユーザーがページ上の特定の地点までスクロールすると、新しい要素やコンテンツがフェードインしたり、フェードアウトするというものである。 動き（つまり、アニメーション）というものは前注意的に処理される。すなわち、ユーザーの目は自動的にアニメーションに引き
jamira@のんびり中学受験2028&2031? @jamira202815 こういうタイプの風呂床の、長年の蓄積で落ちなくなってしまった水垢汚れの除去法を知りたい。 週一では床掃除続けてきたんだけど、段々蓄積してきた…。 重曹とかやってみてもなかなか真っ白には戻らない。。。 pic.twitter.com/Ux28jL4dK7 2024-04-07 16:52:31
Amazonは、同社が運営するスーパーマーケット「Amazonフレッシュ」の実店舗に採用されていたレジなし技術「ジャスト・ウォークアウト」を撤去することを発表した。 ジャスト・ウォークアウトは、商品を棚からとり、店舗を出るときにスマホをスキャンするだけで清算が完了するAIを使用した全自動買い物システムである。 面倒なレジでの支払いを完全に省いてくれる画期的なシステムになるはずだったが、その実態は、インドで遠隔操作をする約1000人以上の従業員による人力作業が必要で、「ジャスト・ウォークアウト」だけで完全に運営するのが難しかったことから、今回の決断を下したようだ。
「ダークパターン」とは？7つの類型を解説／企業30社 独自アンケート - クローズアップ現代 取材ノート - NHK みんなでプラス
うそのカウントダウンタイマーや、在庫が少ない、需要が高いなどの表示。 画像では、カウントダウンタイマーや「今だけ」の表示で焦らせて「今買わなければ」という気持ちに追い込んでいます。 今回私たちは、企業の間ではダークパターンがどのように認識されていて、どのような対策を取っているのか、現状を把握するために独自にアンケート調査を行いました。 調査は、武蔵野美術大学の長谷川敦士教授の監修のもとで行い、ダークパターンが使用されることの多い6つのジャンル（ネットショッピング、旅行予約サービス、飲食店予約サービス、動画配信サービス、音楽配信サービス、電子コミック配信サービス）について、利用者の多い5つのサービス、あわせて30のサービスを対象にしました（利用者数については、ニールセンとICT総研の調査を元にしています）。このうち、16のサービスの運営企業から回答がありました（回答率は53％）。 回答した企
こんにちは、カート決済部カート決済サービスブロックの林です。普段はZOZOTOWN内のカートや決済の機能開発、保守運用、リプレイスを担当しています。 弊社ではカートや決済機能のリプレイスを進めており、これまでにカート投入のキャパシティコントロールや在庫データのクラウドリフトを実現しています。 techblog.zozo.com techblog.zozo.com 本記事では新たにクレジットカード決済処理を非同期化したリプレイス事例を紹介します。 はじめに 背景・課題 非同期化のシステム構成 パターン1 - 完全非同期化パターン パターン2 - 非同期・同期切り替えパターン パターン3 - ポーリングパターン システム構成の決定 メッセージングサービスの選定 効果 今後の展望 まとめ さいごに はじめに 本章では、非同期化前のZOZOTOWNのクレジットカード決済を用いた注文処理の流れを説明
消費者行動や行動経済学を研究されている東京大学大学院の阿部誠教授に、個人の飲食店でもできる工夫やアイデアなど、人間の行動原理をもとにしたお店づくりについて伺いました。 行動経済学をはじめとする学問の教授に、データの観点から飲食店の店づくりや集客方法、リピーター施策として効果的なことを深掘りしていきます。今回は消費者行動や行動経済学を研究されている東京大学大学院の阿部誠教授にインタビューを行いました。 個人の飲食店でもできる工夫やアイデア、お客さんが気にするポイントとはどこなのか？人間の行動原理をもとにしたお店づくりについて考えます。 阿部誠さん 東京大学大学院経済学研究科・経済学部教授。1991年マサチューセッツ工科大学博士号（Ph.D.）取得後、同年からイリノイ大学助教授に就任。1998年東京大学大学院経済学研究科助教授を経て、2004年から現職。ノーベル経済学賞受賞者との共著を含め、マ
みどりの窓口廃止に「利用客軽視」 ＳＮＳで批判が起きる理由を専門家に聞いた｜信濃毎日新聞デジタル 信州・長野県のニュースサイト
JR東日本はチケットレス化、モバイル化を推進するとして、「みどりの窓口」の閉鎖を各地で進めている。現在約220カ所ある窓口は、新幹線や特急の停車駅など利用が多い場所を除き、2025年までに140カ所ほどに縮小する計画。窓口を閉鎖した駅には、代替として「話せる指定席券売機」を設置している。ＪＲ東日本長野支社は「みどりの窓口とほぼ同等の機能」と説明。しかし、SNS上では窓口閉鎖に対して「利用客軽視」、「公共交通機関として終わってる」などと否定的な意見が投稿され続けている。有人窓口の廃止に不安や疑問を感じる人がこれほど多いのはなぜなのか。専門家に理由を分析してもらった。 （中島瑞穗） まずは「話せる指定席券売機」の性能について理解しておきたい。操作に不慣れな人はオペレーターを呼び出し、声による案内を受けながら操作できることが特徴だ。オペレーターは、利用者が操作する画面を遠隔で見ながら説明。学生割
佐野五月｜でざいん姉さん @irohazum_s 心はずむ、みらいを共創する irohazum代表｜ブランディングデザイナー｜事業、プロダクト、人の想いを世の中に伝える架け橋になりたいです｜本・陶器・歴史・文化・旅・ゲーム・ロックが大好きです｜ONLINE上司チーフ｜姉さんと呼んでね｜サブ @irohazum_ss｜#irohazum_Works x.gd/p8PuM 佐野五月｜でざいん姉さん @irohazum_s 設置場所は新山口駅で、この写真は山口県へ旅行へ行った時のものです。 ですので普段の新山口駅についてわかりかねることをご了承ください🙏 設置場所について、このボックスは新山口駅の「新山口駅南北自由通路」に設置されています。横幅が広い通路で下記URLから見ていただけるとイメージ沸くと思います。ボックスがある写真もあります。 x.gd/E1pWC ここから私の感想ですが、人の流れ
要約、箇条書き、コールアウト、太字、役立つ視覚情報などのテクニックを用いることで、1,000語を超えるコンテンツの理解度やエンゲージメントは向上する。 5 Formatting Techniques for Long-Form Content by Huei-Hsin Wang and Megan Chan on November 17, 2023 日本語版2024年3月19日公開 ウェブでは、多くの場合、ユーザーは特定の情報を探している。そのため、ページにある単語を1つ1つすべて読むわけではなく、ユーザーは流し読みをする。つまり、要約や箇条書き、視覚情報、太字のテキストに注目して、探しているものをすばやく見つけ出そうとしている。そこで、テキストの壁を崩す書式テクニックを用いれば、流し読みのしやすさが向上するだけでなく、重要な情報に注意を引きつけることで、読者がコンテンツを効率的かつ効果的
デジタル庁は、現行のマイナンバーカードの後継にあたる「次期個人番号カード」のデザインイメージを公開した。券面から性別の記載を省いたほか、色や柄、レイアウトを調整し「日本の国民カードにふさわしい、誰もが持ちたくなる魅力的なデザイン」を実現するという。導入目標時期は2026年。 デザインは次期カードを議論するタスクフォースが取りまとめた。新カードでは生年月日の記載を和暦から西暦に変更するほか、氏名についてもローマ字を表面に併記できるようにする。また、発行主体を明確化するために「日本国 JAPAN」の記載も検討する。性別については「実務上問題ない」との判断からICチップ内での記載に留める。 このほか、現行カードでは4つ存在する暗証番号を2つに集約。将来的にはスマートフォンの生体認証などを活用することで、暗証番号を不要にする。 新旧カード切り替えに伴う、窓口などでのハードウェア交換は不要と見込まれ
仕様書には載っていない、YOUTRUSTアプリの細かなUX改善の話 - YOUTRUST Tech Blog
アプリエンジニアのくまもん（YOUTRUST/X）です。 細かいUXまで気を配られているアプリは、単純に使いやすいだけでなく、操作していて心地が良く、動きに信頼感があります。しかし細かいUXの議論は、どうしても後回しになりがちで、仕様やデザインモックで厳密に表現しづらい場合もあります。 YOUTRUSTアプリには、プロダクトマネージャーの仕様書による指示というよりは、エンジニアと関係者が自主的に話し合って実装されたと思われるUXの工夫がたくさんあります。今回は、仕様書に載っていないレベルの、細かいのアプリのUX改善についてご紹介します。 デザイン領域に近いアプリの実装の話になりますが、実装パート以外は技術的な知識はあまり要らないと思うので、ぜひ肩の力を抜いて読んでいただければ幸いです！ タッチフィードバック タッチフィードバック セルやボタンをタップしたときに「タップした感」のあるタッチフ
『ゼルダの伝説 ブレス オブ ザ ワイルド』の“よく見るといちいちアイテム拾ってない”挙動がいま称賛される。無駄を省く“引き算”の実装いろいろ - AUTOMATON
任天堂より2017年3月に発売された『ゼルダの伝説 ブレス オブ ザ ワイルド』（以下、ブレス オブ ザ ワイルド）。そのアイテムを拾った際の挙動について、あるゲーム開発者が称賛。その投稿はX上で話題となっているようだ。 『ブレス オブ ザ ワイルド』は2017年3月にWii UおよびNintendo Switch向けに発売されたシリーズ作品。シリーズのエッセンスを継承しつつも、オープンエアーと呼ばれる広大なフィールドを導入している。自然あふれるハイラルの世界を自由に攻略できる大作として、高い評価を獲得。数々のゲーム・オブ・ザ・イヤーのアワードを総なめするなど、2017年を代表する作品となった。 また本作は続編として、『ゼルダの伝説 ティアーズ オブ ザ キングダム』がNintendo Switch向けに発売されている。同作も発売後3日間で世界累計販売本数が1000万本を突破するなど大ヒッ
オーバーレイ ファクトシート
Webアクセシビリティ オーバーレイとは何ですか？オーバーレイは、Webサイトのアクセシビリティを向上させることを目的とした技術の総称です。サードパーティのソースコード（多くはJavaScript）を読み込み、フロントエンドコードを改善します。 アクセシビリティの向上を謳うWebサイトのアドオン製品は、1990年代後半に登場したReadspeakerやBrowsealoudに遡ります。これらは、インストールされたWebサイトにテキストの読み上げ機能を追加するものでした。 その後、そのようなソフトウェアに機能を追加した類似製品が、市場に出回るようになりました。それらは、読みやすさを向上させるために、ユーザーのニーズに基づき文字サイズや色などをコントロールするものです。 最近のオーバーレイ製品のなかには、支援技術からのアクセスのしやすさを妨げる問題を修正することを目的としているものがあります。
生成AIツールを、あなたのUXスキルを代替するためではなく、サポートし、強化するために使おう。小さなUXタスクから始めて、ハルシネーションや誤ったアドバイスに気をつけよう。 AI for UX: Getting Started by Kate Moran and Jakob Nielsen on November 3, 2023 日本語版2024年3月13日公開 最近、ヤコブは、UX分野は早急にAIに取り組む必要があると書いた。これは、既存のAIツールのユーザビリティ向上が切に求められていることもあるが、AIを適切に活用することで、UX業務に大幅な進化がもたらされる可能性があるからだ。 幸運なことに、UXコミュニティのメンバーの多くがこれに同意し、UXの作業にどのようにAIを使うべきかを我々に尋ねてきている。そこで、ケイトは、彼女のLinkedInのフォロワーに、これまで仕事でAIを使った
あまりもの @tinamisango JR東日本さま。とにかくみどりの窓口を復活してください。 PCやスマホで切符を買えない人がいること。払い戻しとか、少しややこしい相談はえきねっとでは出来ないということ。私は図々しいから直前に買えないときは車中精算しちゃうけど、それも渋るようでは困る。 お客様が困っているんだよ。 x.com/21_kamio/statu… 2024-03-11 19:54:04
【はじめに】この記事はBaaaaと何の関係もないただの学生（25卒）が執筆しています。 【Baaaaとは】カメラで現実世界を写すことで絵文字が生成され、それをコレクションしたり、レコードに載せて音楽を奏でられるアプリ。他の人のレコードを回したりスクラッチしたりとSNS的な側面も持つ。 日本企業のwedが制作しており、同社はONEというレシート買取サービスも開発している。 【感動した5ポイント】1.UIのサイズが激しく変化する下部にあるフッターナビゲーションの大きくサイズが変化するボタンを見て欲しい。選択されている場所を色、サイズ、テキストで強調できており、分かりやすい。また、指からはみ出すアニメーションはダイナミックでワクワクする。 フッターナビゲーションそして、一体感がすごい。フッターナビゲーションを左右にスワイプすることによって、指、ボタン、中央画面が全て同じ方向に動く。まるで指で引っ
確定申告e-Taxがくそすぎる。
皆様におかれましても、今年の確定申告に向けて申告書を鋭意作成中のことと思います。 すでに散々論じられていることとは思いますが、この度マイナポータル、e-Taxを使用して本当にストレスで禿げそうだったので備忘録と同様の辛さを味わう方を救いたいという目的でこれを残しておきます。 スマホアプリ「マイナポータル」がただのバナーである 普通アプリとして存在してたらアプリ内で操作してると思うよね！残念！Sarafiでした！ スマホアプリ「マイナポータル」のQR"読取り"の位置が非常に分かりにくい 通常使用するユーザーの99%はそのままログインしてしまうのでは？"アプリ内(実際はブラウザだが)"をいくら探してもQR読取りマークがみつからない。ログインする前の起動画面の下にひっそりあるので探してみてください。 スマホで作成できると謳いながら、PC用画面で操作をさせられ続ける これは何かの試練ですか？お年寄
こんにちは！SmartBankでUXリサーチャーをしているHarokaです。 今回は、リサーチ業務に生成AIを取り入れる方法をテーマに、Notion Labs Japan 合同会社 ソリューションエンジニアの早川和輝 (@kzkhykw1991)さんとの対談をお届けします。 blog.smartbank.co.jp きっかけは2024年2月に実施したイベントで、その中でNotion AIのご紹介がありました。 データベースにAI機能を埋め込み、一気にタグ付けする様子などを目の当たりにして、これはすごいぞ！と率直に感動しました。 それと同時に、実は私が今行っている作業、AIに任せた方がいいものもあるんじゃないかな？と感じました。 Notionでユーザーリサーチを変える ~スマートバンク社のユーザーリサーチ文化の作り方~ - YouTube ここ数年、生成AIが一般にも浸透してきており、リサー
デザイナーの帽子をかぶったわたしが、プロダクト開発するうえでスクラムチームに提供したいこと / what I want to provide to Scrum teams when developing products
Scrum Fest Fukuoka 2024の登壇資料です。 プロポーザル：https://confengine.com/conferences/scrum-fest-fukuoka-2024/proposal/19575
UIをもたらすコンテクストの考察
World IA Day Tokyo 2024 (2024年3月2日開催) https://www.worldiaday.org/events/tokyo/2024 上記イベントの話題提供3「UIをもたらすコンテクストの考察」にて使用したスライドを公開用に編集したものです。 作者：森田 雄 / 株式会社ツルカメ https://twitter.com/securecat https://turucame.jp/ Made with Canva https://www.canva.com/
こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです🌿 今回は、日本時間の今日（2024.3.7）発表されたばかりのFigma新機能、マルチ編集機能について、その機能概要や使いどころを公式解説をもとにまとめました。 はじめに現在、Figma Community上ではこちらの公式解説が公開されています。 Figmaの公式解説は、実際に手を動かしてみる用の作業場も準備されていて作りが丁寧なので、こちらを読めば内容は理解できるのですが、この機能に関わらず、原則英語のFigmaデータしかない！ ということで、こちらの公式解説を和訳しながら噛み砕いた内容をまとめましたので、「機能の概要が知りたいけど、英語の解説を読むのに抵抗があって止まっている」という方の参考になると嬉しいです！ 機能概要｜ざっくり何ができるのかマルチ編集機能は、複数フレーム内の共通レイヤーを一気に選択し、それ
結論話題の記事「UIの色を変えただけで大量のクレームを頂戴してしまった話」を読みました。ユーザーを軽視した内容に驚愕したのですが、それよりも記事が批判されている原因を理解できていない様子の方が存在することに衝撃を受けました。 現職のデザイナーあるいはデザイナーを目指している方々にお伝えしたいことは以下の3点です。 具体的な不都合を訴える問い合わせは無益なクレームではなく有益なフィードバックです。プロダクトの価値向上につながる貴重な意見ですから無視するべきではありません。 時間の経過でユーザーがUIに慣れることはありません。問い合わせをしても無駄だと学習して離脱したパターンを疑いましょう。受け入れられる場合も含めて画面の変更はユーザーに負担を強いているのだと自覚してください。 色覚特性や色とコントラストについて学びましょう。色だけで情報を伝えるデザインはアンチパターンですから避けてください。
3,000団体以上のNPO・NGOとの繋がりを通じた希少なN=1が多く集まる調査パネルを基に、これまでリーチが困難であった人々を含む多様な声を通じて、尖ったインサイトや気づきを得て、新しいアイデアやイノベーションを共創する定性調査サービスです。
ヨーロッパの消費者団体が行っている自動車安全評価システム「Euro NCAP」が自動車産業に向けて、操作を行う部分にタッチパネルを使うのをやめて、物理的なボタンやスイッチに戻すべきであるとの提言を行いました。 Car industry told to dial back use of touchscreens https://www.thetimes.co.uk/article/stop-making-dangerous-touchscreens-car-firms-told-xv3gmpdc6 European crash tester says carmakers must bring back physical controls | Ars Technica https://arstechnica.com/cars/2024/03/carmakers-must-bring-back-
Webプロダクト開発をしていると様々な諸事情によりUI構成を変えたり機能を増やしたり減らしたりすることが多々あると思います。そんな時に避けられない事態として「UI変更に対するお怒りがユーザーからわんさか届いてしまう」ということがあります。今回はUI上の１要素の色を変えただけで虎の尾を盛大に踏んでしまった事件の話をしようと思います。差し当たりどういうUIをどう変えたのかを明示しておきます。変える前がこちら↓↓ beforeUIほんで変わった後がこちら↓↓ afterUIご覧の通り「作業カード」と呼ばれるコンポーネントの色を「緑＆黄」から「緑塗り＆緑枠線」に変更しました。「え、それだけ？」という声が聞こえてきそうですがそうなんです。それだけなのです。しかしここはレガシードメインのtoB SaaS。toB SaaSではUIの変更がユーザー業務への影響に直結するので軽微な変更を加えるのもハードルが
デザインプロセスに生成 AI を取り入れる実験 ~プロンプト全公開~ - Techtouch Developers Blog
デザイナーの keita です。 年始にベンチプレスの MAX 測定をしたら 105kg でした。今年の目標は 120kg です。 この記事では、生成 AI をデザインプロセスに取り入れるためにチームで試行錯誤した内容を紹介します。ぜひ、最後までお付き合いください。 きっかけ はじめに AI を使ってみる インタビューデータからペルソナを作成 まずは 1 人ずつ整理 1 人のペルソナに統合 ペルソナの課題抽出 リサーチを AI で代替してみた結果 AI が作成したペルソナを使ってみる ペルソナにヘルプセンターの記事を評価させてみる 結果 最後に あとがき ボツ案 文字起こしデータから記事を作成 出力された記事のトーンを変更 出力された記事 きっかけ 「ChatGPT をはじめとした AI ツールが便利なのはわかったけど、自分たちの業務をより効率化するためにデザインプロセスで代替できるところ
「デザイナーだけがデザインをする時代は古い」「デザインにセンスはない」と語るのは、Udemyの「UI/UXの改善を進めるための基礎講座」などで人気を誇る、UI/UXデザイナーの濱野将氏。生成AI時代において、デザインをビジネスをつなげるためのポイントや、UI/UXの基礎を解説します。 UI/UXデザイナーが教えるデザインの基本 濱野将氏：それでは、僕からは「ビジネスを実現する『デザイン』の基本」をお話しさせていただきます。よろしくお願いします。 今日のアジェンダはこんな感じです。「デザインの必要性」「デザイナーだけがデザインする時代はもう古い」「UI/UXについて」。今回はAIがテーマなので「AIを使ったプロジェクトの進め方」も少し紹介させていただきたいなと思っております。 簡単に自己紹介をさせてください。株式会社IMAKE代表の濱野と申します。職業はUI/UXデザイナーで、講師もさせてい
リクルートのデザインディレクターは、大きく「デザインドリブンで事業を変革」「ユーザーへの提供価値最大化」「事業にあったデザインコンサルティング」という３種類の役割を担っています。ここでは、『リクルートダイレクトスカウト』のリニューアルプロジェクトを事例に、「デザインドリブンで事業を変革」する役割について、具体的に紹介したいと思います。 ※ デザインマネジメントについては、こちらに詳細にまとまっているので、併せて御覧ください。
XDからFigmaへ移行したい人のためにFigmaの機能を紹介
XDからFigmaへ移行したい人のためにFigmaの機能を紹介 この記事では、XDからFigmaに移行しようとしている方、Figmaを使ったことのない方に向けて、Figmaの機能の中からよく使用するものを紹介しています。 この記事について この記事は、スマートフォン時代のWebデザインスクール や Web制作の基礎から学べる「Webコーディングスクール」 の資料制作をお手伝いして頂いているemiさんによる寄稿記事です。 マスクとして使用 Figmaでもマスクを使うと図形などからはみ出した部分を表示しないようにできます。 画像と図形を用意します。図形はその形からはみ出て部分を表示しなくなるので、その図形でくり抜かれたような表示になります。 マスクの作成方法 マスクとして使用したい図形の前面に画像を配置します。 図形と画像の両方を選択した状態にし、上部ツールバーにある［マスクとして使用］アイコ
デザインシステムとは、サービス開発する上で必要となるデザインの概念、スタイルガイド、コンポーネント集などで構成されるデザインのルールです。 Salesforce.comの「Lightning Design System」が2015年に登場して以来、多くの企業がこのデザインシステムを導入するようになりました。 プロトタイピングツールで有名なUXPinが提供するデザインシステムプラットフォーム「adele」では、90個以上（2019年12月現在）ものデザインシステムが公開されています。その企業のラインナップを見ると、大手ITベンダー、SaaSベンダーのみならず、自治体、金融機関、大学など多くの業界で、組織のブランド確立のために、デザインシステムを活用していることが分かります。 GoogleやAppleが提供するデザインシステムは、既に多くのブログで語りつくされていますが、その他の企業でも素晴ら
「UIT × Bonfire Front-end Meetup #1」での発表資料です。 https://uit.connpass.com/event/300284/
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ヘッダー（グローバルナビゲーション）のデザイン事例100選｜akane
The Front End Developer/Engineer Handbook 2024
Webデザイナーが「サービス紹介動画」を構造分析してみた（8事例）｜nanami
Gmailにメールが届かなくなる!? 5月中にやるべき対応策をマンガで教えてください！WACUL安藤健作さんに聞いてきた | Webのコト、教えてホシイの！
Gmail、ほんと頭いいな→「わしはこれで1000回命を救われた」「私らがAIに求めてんのこういうことなんよな」
ダークモードを巡るあれこれ：ダークモードの明るい未来 - enechain Tech Blog
スクロールフェードの基礎
お風呂の床、こまめに掃除してるけど汚れが蓄積してきたので掃除方法を教えて！→洗剤開発の方による解説「ブラシ選びも重要」
アマゾンのAIレジなし技術は1000人以上が人力操作していた。店舗から撤去を発表 : カラパイア
SQSを用いたクレジットカード決済の非同期化 - ZOZO TECH BLOG
行動経済学を応用して「飲食店の売りたいメニュー」に注目させる方法を東大教授に聞いてみた - おなじみ丨近くの店から、なじみの店へ。
新山口駅にある透明なボックスに入った消火設備のデザインと機能性が秀逸だと話題になるも賛否両論、さまざまな意見が集まる
長文コンテンツのための5つの書式テクニック
次期マイナンバーカードのデザイン公開--「マイナカード」の名称廃止も検討
UXのためのAI：入門編
みどりの窓口を大幅に減らした結果、窓口に長蛇の列ができるようになってしまった「窓口のみの切符もまだ多いのに…」
おもちゃ箱のようなアプリBaaaaのUI/UXが凄すぎた件｜Yusui Hoshino
リサーチとAI 良い関係性の築き方 - inSmartBank
Figma新機能｜マルチ編集機能の概要と使いどころ｜nanami
「UIの色を変えただけで大量のクレームを頂戴してしまった話」の何が問題か？｜moutend
CULUMUリサーチ | こんな人と話したかった！を実現する定性調査サービス│
「自動車産業はタッチパネル採用をやめて物理ボタンに戻すべき」と自動車安全評価システムのEuro NCAPが提言
UIの色を変えただけで大量のクレームを頂戴してしまった話｜のなと
デザインにセンスは必要ない、大切なのは「情報を整理」する力 Udemyの人気講師が教える、UI/UXデザインの基礎
『リクルートダイレクトスカウト』フルリニューアルにおける、デザインの価値貢献の事例｜Cocoda
UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ
ヤフーのユーザー5,400万人から"同意"を得るための技術