マガジンのカバー画像

プロダクトデザイン知見まとめ

93
本
プロダクトデザイン・UI/UX・UXライティングなどの知見をまとめていくマガジンです！noteではプロダクトデザイナーを募集しています→https://open.talentio…
運営しているクリエイター

#UI

「アイコン」で伝えられる情報の限界に挑め

🧑‍💼「お気に入りのアイコンを作ってください！」 私「まかせな！」 🧑‍💼「ランキングのアイコンを作ってください！」 私「まかせな！」 🧑‍💼「人間プレイヤー3人 VS コンピュータープレイヤー1人のアイコンを作ってください！」 私「（え？）ま…まかせな！！」 🧑‍💼「『AボタンとBボタンを交互に連打』のアイコンを作ってください！」 🧑‍💼「『全プレイヤーのアイテムをシャッフルして再分配』のアイコンを作ってください！」 🧑‍💼「『オンラインモードで待機しているユーザーが

Yamashita A…

ファイルが重くなりがちな長期プロジェクトでのFigmaファイル管理

Japan Digital Designの久行です。三菱UFJフィナンシャル・グループの戦略子会社であるJapan Digital Design（以下JDD）でExperience Design Div.（以下XDD）に所属し、体験設計やUI・ビジュアルデザインのリードを担当しています。 この記事では、XDDが取り組むプロジェクトの中で発生した困りごとを基に取り組んだFigmaファイル管理の改善活動についてご紹介します。 デジタルプロダクト開発でお馴染みのデザインツールであ

Japan Digit…

「CTAボタン」のUIを集めてみた｜パーツ別デザインまとめ

こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 今回は、LPにおいてCV（コンバージョン）に大きく影響を与えるUIパーツ「CTAボタン」周りのデザインをパターン別に集めてみました。 はじめに前回の記事で予告をした通り、今後、LPやWebサイトを構成する様々な要素を１つずつ特化して調査をしていきたいと思っています。 今回はその「パーツ別デザインまとめ」シリーズ２本目です。 ↑ こちらの記事、たくさんの方に読んでいただけており嬉しいです！ パタ

nanami

鮮魚バイヤー向けおすすめ提案のアプリデザイン

こんにちは！株式会社ウーオでUI/UXデザイナーをしている久保坂（@misaaa09）です。 先日水産流通マーケットプレイス「UUUO」でユーザーに合った商品提案を行う「オススメ提案機能」をリリースしました。 約6ヶ月で構想からリリースまでを行い、その中で様々のメンバーを巻き込みながら進めたプロジェクトでした。 今日は具体的な開発フローの紹介とともに、周囲を巻き込みながらデザインしていくうえで工夫しているポイントをお伝えしたいと思います。 💬開発の背景始まりは主要機能の

Misaki Kubo…

「料金比較表」のUIを集めてみた｜パーツ別デザインまとめ

こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです🌿 今回はLPやサービスサイトでよく見かける「料金比較表」のUIパーツに特化してデザインを集めてみました。 LPや特定のサービスサイトは構成要素が比較的パターン化されています。 「この要素・セクションのデザインどうしよう」となった時用に、要素ごとにデザインのパターンのストックを持っておきたい。 そんな皆さまに参考にしていただけると嬉しいです！ はじめに今回は、集めた料金比較表のデザインをこちらのサ

nanami

「ボタンっぽい見出し」と「見出しっぽいボタン」問題

こんにちは！株式会社Rabeeの新人デザイナーのakaneです🏋 今回は、最近気になっている「わかりづらさを感じるUI」について書こうと思います。よろしければお付き合いください✍ 前提：UIとは？UIは「ユーザーインターフェイス」の略。interfaceは「接点」や「境界面」という意味の英単語であり、UIとはコンピュータ（機械）とユーザー（人間）を繋ぐ接点です。スマホであれば指先、パソコンであればマウスなどを介して、人間は機械と意思の疎通を図ります。 UIは、何よりも「

akane

多言語対応UIを作るときのポイントを知っておこう

こんにちは！株式会社Rabeeの新人デザイナーのakaneです🏋 今日は、多言語に対応するUIデザインをつくるときのポイントについて書きます。表層的な「UI」だけでなく、掲載コンテンツの内容やローカライズについても言及しています🌐 最後に参考記事も紹介しています！ぜひお楽しみください。 はじめに｜多言語対応UIとは？今回扱う「多言語対応UI」とは、単一の言語のみでなく、いくつかの言語に対応しているUIデザインのこと。日本でよく見かけるのは「日本語」「英語」の2つに対応し

akane

その状態のデザイン考えてなかった！　UI Stackってナニ

アプリの画面をデザインする際、エンジニアさんに 「なにも登録データがない場合、どう表示しますか」「選択したときの状態ってどんなデザインですか」などと聞かれて 「ｳﾜｱ考えてなかったすみません、今作ります。。」 （なんて自分はポンコツなんだ、、ｳｳｳ） と、なりたくないですよね。 UI Stackは👆のような状況を回避するのに便利で大事な考え方だと思ったので、言葉の意味を知らない方はぜひ読んでってください！ UI Stack アメリカのプロダクトデザイナー Scott H

kana

知識０から、ちょっとUIデザインに詳しくなるnote

月イチで大阪京橋のQUINTBRIDGEという施設で無料のデザイン勉強会「モグモグデザイン」という取り組みをしているのですが、その勉強会で話した内容をChatGPTを駆使してnoteにも展開しています。全８回の第６回目です。 前回は、「UIデザインってそもそも何なの？」という概論的な説明と、UIデザイン未導入の組織の中でみんなでデザインを始めてみるための施策（プロトタイピングとユーザビリティ評価）を話しました。 今回はサービス、プロダクト開発において、デザイナーではない人

やました

【海外記事】2024年版 UX/UIデザイントレンド2

本日もこちらの記事を読んでみます。なお、画像なども以下から引用しています。 前回はBentoデザインや、ついに来年きそうなAR/VRの話題が取り上げられていました。 今回はまた別のトピックが取り上げられていますので見ていきたいと思います。長い上に地味に英文が難しく読解に時間がかかってしまいますが、頑張って読み進めます。 本日もよろしくお願いいたします。 誰でもアニメが作れる！新しいトレンドはたいてい新しい技術がより広く利用できるようになった時点で生まれます。 これはL

やました

UIのビジュアル（見た目）にブランドパーソナリティを落とし込む

こんにちは。GoodpatchのUIデザイナーの平尾です。 今回は自分が普段の業務の中で「どのようにUIのビジュアル（見た目）にブランドパーソナリティを落とし込んでいるか」をまとめてみました🎨 🎄この記事はGoodpatch Design Advent Calendar 2023 20日目の記事です。 1. ブランドパーソナリティにおける印象を定義するまず、ブランドパーソナリティ（そのブランドを人に例えたときにどのような人格を持っているのか）において、そのブランドと接し

ひらお ほのか

『はじめよう！ 要件定義』（とそのシリーズ）を読んで、はじめよう！UIデザイン

繰り返し読んでいるマイ・フェイバリット技術書に『はじめよう！ 要件定義 ～ビギナーからベテランまで』とその姉妹本『⁠はじめよう！ プロセス設計 ～要件定義のその前に』『はじめよう！ システム設計 ～要件定義のその後に』の、通称「はじめよう！シリーズ3部作」があります（羽生章洋さん著）。 『はじめよう！ 要件定義 ～ビギナーからベテランまで』はそのタイトル通り、ソフトウェア開発に携わるエンジニアやPM向けに、要件定義の進め方について優しく解説してくれる書籍です。かわいいイラス

金 成奎

10年ものアプリのダークモード化プロジェクト、カラー設計の舞台裏

こんにちは、ニューズピックスのプロダクトデザイナー、吉川（よっしー）です。 先日、ニューズピックスアプリがダークモードに対応しました。以前からご要望を多くいただいており、昨年末から取り組みはじめ 9月にAndroid版リリース、10月にiOS版もリリースが完了しました。 2013年から今年で10周年を迎えたニューズピックスアプリ。その10年間の歴史を持つアプリをダークモード対応するためのカラー設計についてお伝えしていきたいと思います。 対応範囲アプリの全階層すべて適用す

Yoshi

「もうちょっとこうだったらいいな」を見逃したくないデザイナーの話

こんにちは、ピーナッツです。ナビタイムジャパンで『バスNAVITIME forスゴ得』、『バスNAVITIME』のデザインを担当しています。 私が担当している案件には、大きく分けて「チーム検討からの案件」、「自分の気づきからの案件」、「運用で必要な案件」の３種類があるのですが、今回は「自分の気づきからの案件」についてお話します。 「自分の気づきからの案件」ができるまで 私は、出かけた際にできるだけ『バスNAVITIME』を使うようにしています。実際に利用した時に困ったこと

NAVITIME_Te…