UXエンジニアが知っておきたいデザインシステムの原則 | Goodpatch Blog
Featured image: Business vector created by Freepik UXエンジニアという言葉を聞いたことがありますでしょうか。 私もここ数年で聞くようになった言葉です。UXエンジニアという仕事はまだ生まれたばかりで、定義が曖昧ですが、私は一言で言えば「UXデザインをする、もしくはその工程に関わるエンジニア」のことだと考えています。最近クックパッドさんでもUXエンジニアを採用しており、「UXエンジニア」って何する人？ クックパッド流・開発力を高めるDesignOpsの進め方は私の印象に残っている記事の一つです。 グッドパッチがチーム全員でデザインをしているように、UXデザインはデザイナーだけの仕事ではありません。例えばUIデザインがよくてもページの読み込みが遅いとユーザーの体験は悪くなってしまいます。その他にもエラーメッセージの言葉や見せ方、フォームのバリデ
グッドパッチエンジニアが選ぶ、推しデザインシステム10選｜Goodpatch Blog グッドパッチブログ
生まれ変わったらデザインシステムになりたいと思っているくらい、デザインシステムが好きなエンジニアの乗田です。 僕の入社の経緯や業務内容についてはこちらからご覧いただけます！ デザインシステムとは デザインシステムとは、ソフトウェアやグラフィックなどにおけるデザインの原則や指針と、それらを実現するための仕組みの集合体です。デザインシステムのメリットは、低コストで高速に一貫性のあるデザインを実現しやすくなるという点にあります。 一般的にデザイン原則にはタイポグラフィ・カラーシステムやボイス&トーンなどが含まれ、仕組みにはコードベースのUIコンポーネントやデザイントークンなどが含まれます。 しかしデザインシステムにおける必須要素の定義はありません。それ故にデザインシステムは、各組織にとって必要なデザイン原則やデザインアセットが集合した物と言い換えることもできるでしょう。 古い物ですと1975年に
メンタルモデルとは何か？マッチングアプリのUIデザインから読み解く4つの概念｜Goodpatch Blog グッドパッチブログ
ユーザーに行なって欲しい操作や行動を導くインターフェイス／インタラクションのデザインを行うために、デザイナーはどんな意識をもつ必要があるのでしょうか。 今回は意識するべき概念の1つとして、メンタルモデルを紹介します。 Goodpatchでは、新規サービスの立ち上げやサービス・プロダクトの改善のご相談も受けております。 ⇒【資料ダウンロード】事業の提供価値を素早くカタチにし価値検証を回すフレームワーク「デザインスプリント」とは？ 観客からすれば、映画に夢中になると、光の点滅やスプロケットのことなど忘れてしまう。というより、多くの観客は、映写機の仕組みだとか、それがテレビの仕組みとどのように違うかといったことなどまず知らない。観客は、単純に大画面に動く写真が映し出されているだけだというイメージを持っている。 （引用元：アラン・クーパー『About Face 3 インタラクションデザインの極意』
情報設計に欠かせない。ユーザーのメンタルモデルを理解する、要素整理のフレームワーク｜Goodpatch Blog グッドパッチブログ
デザインにおいて情報設計はとても重要です。 なぜなら情報設計がなされないままUIデザインが行った場合、目的や画面のつながりが不明瞭になり、ユーザーに思いのまま使ってもらうことが難しくなってしまう可能性があるからです。 ユーザーがアプリやサービスの本質的な価値をとらえ、迷うことなく操作できるよう導くために情報設計は必要不可欠な工程です。 では、情報設計のフェーズでデザイナーは具体的にどんなことをしているのでしょうか？ 情報設計の中でも“コンテンツの要素整理”段階を、よく使われるフレームワークと一緒に紹介していきます。 情報設計とは 情報設計はサービスやアプリの要件、つまりコンセプトや機能仕様、ユーザーの目的、目的達成までのシナリオや成功指標と、UIデザインをつなぐ役割を担っています。 また、情報設計はUXの5段階モデルでいう構造段階で主に行われる工程だと言えそうです。 構造段階ではユーザー体
実際の業務でよく使う！覚えておきたい基礎的なマーケティング用語まとめ｜Goodpatch Blog グッドパッチブログ
こんにちは、プロジェクトマネージャーのつつみです。 日頃デザインに関わる上でも、職種関係なく数字に強くなくてはいけないと感じ、日々勉強をしています。ユーザーにプロダクトを届けるだけではなく、数字にコミットすることも重要です。 今回は、私が普段業務を行う中で、よく使用し最低限必要だと感じた、基礎的なマーケティング用語をまとめました。（随時必要な項目が出たら追記します） Webサービスでよく使う まずはどのサービスでもよく使う用語について、当ブログの実例も兼ねてご紹介します。 PV（Page View） 一般的に「アクセス数」と呼ばれるものはPVを指します。 よく、「広告表示を増やすためにPVを増やしたい！」という時に、ページングを使ったりします。1記事が3ページに分かれていて、全て見た場合は「3PV」となります。 ページングは賛否両論ありますが、当ブログではユーザーが不快になるのでは？との仮
130名のデザイン組織でゼネラルマネージャーが実践する6つの方法｜Goodpatch Blog グッドパッチブログ
私はGoodpatchのクライアントワーク部門のゼネラルマネージャーとして、60名のデザイナーたちと仕事をしています。気がつくと、マネージャー（人事組織上の管理者）というポジションについてから、15年が経過していました。現在は4人のマネージャーのマネジメントと、約10名ほどのメンバーのマネージャーを兼務しています。 マネジメント歴を振り返ると、15年前に勤務していた会社で初めてマネージャーになってから、先輩、書籍、研修などに多くの成長機会をいただきました。修羅場や失敗も数多いですが、一緒に働いたメンバーから得た経験がもっとも役に立っています。しかし、Goodpatchにいる今でも悩みは多く、失敗もあります。私と同じように、マネジメントで悩んでいる人って多いのではないか？と思い、悩んでいるマネージャーのヒントになればと、現時点での大切にしている考え方を残しておきます。 ここでのマネージャーの
キャンセルのキャンセル問題から考えるダイアログデザイン｜Goodpatch Blog グッドパッチブログ
この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……？ 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では
チームで前進する方向を探れ！Goodpatchのビジョン探索ワークショップ｜Goodpatch Blog グッドパッチブログ
組織で仕事をしていく中で「チームの雰囲気は良いのに建設的な議論がなされない」「短期的な数値に囚われて、アクションに幅がない」「メンバー間の熱量に差がある」 などと感じたことはありませんか。メンバー全員がモチベーション高く、自走していくためにはチームの向かうべき方向を示すビジョンが必要かもしれません。 では、メンバーが共感するビジョンはどのように見つけていけばよいのでしょうか。今回Goodpatchでは新たな試みとして、職種や立場を問わず、チーム全員でビジョンの探索を行うことができるワークショップを実施しました。 本記事では、実際に提供するビジョン探索ワークショップの内容をご紹介します！Goodpatchが行うデザインプロセス全体のワークショップや、デザインプロセスの中でもアイディエーションに焦点を絞ったワークショップについては、こちらをご覧ください。
レシピのUX／UIを改善する｜Goodpatch Blog グッドパッチブログ
普段、何気なく利用している身の回りのもので、使いづらかったり分かりにくいものはありませんか？このブログをご覧いただいている皆さんであれば、必ず一度はそういった経験をされたことがあるのではと思います。今回は「料理レシピ」にフォーカスしてUX／UIを改善してみましたので、そのプロセスをプロジェクト風にまとめてご紹介します。 改善の経緯 私は現在、Goodpatch社内のCookingサークルに所属しているのですが、先日みんなでフォカッチャを作ろうとしたところ教材に使用したレシピがとても分かりにくく、作るのが久々だった私自身も含め大混乱を招いたため、勝手にレシピを改善することにしました。 プロジェクトの目的・要件 既存レシピの改善。 レシピ利用者の背景や思考、調理時の行動などに合わせ、理解しやすく実際に調理する際にも迷うことのないレシピのフォーマットを作成する。 実施計画 利用者の背景を踏まえた
チームの士気を高めビジネスを成功に導く。チームビルディングの目的・効果・方法｜Goodpatch Blog グッドパッチブログ
新規事業チームを結成したけど、一体感が感じられない。メンバー全員が積極的なチームにしたい──。 そんな悩みを持ったチームリーダーの方は多いのではないでしょうか。ビジネスを成功に導くためには、チームメンバー全員が主体的に一丸となって活躍することが不可欠です。異なる職種のメンバーがワンチームになるための方法、チームビルディングについてまとめました。具体的な方法についてもご紹介していきます。 チームビルディングとは チームビルディングとは「目的や目標の達成のため、チームメンバーが主体的に能力や多様性を発揮しながら一丸となるチームを目指すための取り組み」です。読んで字のごとく「 チーム（Team）」を「構築する（Building）」ことなので、スター選手を集めたドリームチームであっても、構築されていなければ最強とは言えません。クライアントとの関係を「お客様」から「同じチームのメンバー」にするまでを
リーンキャンバス（Lean Canvas）とは？作り方を事例ベースでわかりやすく解説｜Goodpatch Blog グッドパッチブログ
今回はビジネスモデルキャンバスを原型に作られた、リーンキャンバスというフレームワークをご紹介します。リーンキャンバスは事業やプロジェクトの立ち上げにおいて、ビジネスモデルを検証し、改善する際に役立ちます。初心者の方でもトライできる作成例もあるので、ぜひ参考にしてみてください。 Goodpatchでは、新規サービスの立ち上げやサービス・プロダクトの改善のご相談も受けております。 ⇒【資料ダウンロード】事業アイデアを素早く検証できる「デザインスプリント」とは？ リーンキャンバスは、リーンスタートアップという著書で有名な起業家のエリック・リースから応用されたビジネスモデルを一枚の図にまとめたフレームワークです。シリコンバレーでは毎年数多くのスタートアップが誕生しています。その中で事業を成功させるためには、ビジネスモデルに何か問題があったらすぐに軌道修正し、素早くアップデートすることが重要。リーン
デザインを越境せよ CXO Night #3【若手デザイナー社長編】｜Goodpatch Blog グッドパッチブログ
2018年5月23日、経済産業省・特許庁により「デザイン経営」宣言が発表されました。日本では、経営層がデザインを経営に有効な手段として認識していないことが多く、海外との競争力が弱いと懸念されています。この背景から、デザインで企業ブランド価値の向上と強化、イノベーションを起こす力の向上を実現し、企業の競争力を高める効果を生むことを目指すという内容です。 日本のスタートアップでは経営を担うデザイナーの需要が増え、CDO（Chief Design Officer）やCXO（Chief Experience Officer）が活躍しています。実際にCDOやCXOとして働く人は、組織でどのような役割を果たしているのでしょうか？ 2018年6月15日、TECH PLAY渋谷でデザインを越境せよ – CXO Night #3が開催され、領域を超えて活躍するデザイナーたちがCXOの重要性や課題、実用的なノ
ブランドカラー選定に必要な4つの基本プロセス｜Goodpatch Blog グッドパッチブログ
デザイナーのみなさま、突然ですがこんな悩みはありませんか？ ブランドカラーを何色にするべきか、どのように決めたらよいか迷ってしまう。 いつも無難な色を使いがちでデザインの幅が広げづらい。 なぜこの色なの？と聞かれた時にロジカルな回答ができるか心配。 デザインをしていると、このような悩みを一度は持ったことがあるのではないでしょうか。 プロセスの中で必要とされるカラーの選定は、1つの難関ですよね。 0→1フェーズのデザインを得意とするグッドパッチでは、目には見えないサービスのコンセプトを決定するところから、ブランドカラーやサービスロゴなどで実際の形にする提案までを担当させていただくことが多々あります。 実際に私が担当したプロジェクトでは、とある企業さまの新規デジタルメディアの立ち上げを担当させていただき、その際Webサイト内とサービスロゴに使用するブランドカラーの提案をさせていただきました。
今、世界レベルで求められるプロダクトマネージャーのマインドセットとは？｜Goodpatch Blog グッドパッチブログ
こんにちは！ライターの磯部です。 突然ですが、みなさん「プロダクトマネージャー」と「プロジェクトマネージャー」の違いを明確に説明できますか？ 日本だとプロジェクトマネージャーという言い回しの方が一般的であるため混同されがちですが、海外にはプロダクトマネージャーという職種の人がいて、プロダクトの成功のために働いています。MicrosoftやAirbnb、Amazonでキャリアを築いてきたIan McAllister氏は、Quoraにて以下のように述べています。 Product managers own “What” and “Why“. Project managers own “How” and “When”. (a simplification, but generally holds true) プロダクトマネージャーは、どんなプロダクトをなぜ作るのかに責任を持ち、プロジェクトマネージ
サービスリニューアルする際、チームでユーザー体験を向上させるためのサービスブループリント｜Goodpatch Blog グッドパッチブログ
クライアントワークにおいて「このサービスのUXをよくしてほしい」というお題のプロジェクトに携わる人がいるかと思います。UXという言葉の捉えるところが大きく、一体何からやったやいいのか戸惑うこともあるかと思います。また、クライアントワークにおいて営業利益に関わる数値の共有をいただくことが難しい場合があります。その際、数値的な情報を持たずに「サービスのUXをよくする」ことにコミットするかの改善点の洗い出しや施策検討の方法を共有できればと思います。 サービスブループリントとは サービスに携わるユーザーやステークホルダー（サービス運営に携わる関係者等）がサービスのタッチポイントにおいて相互に関係するかを明確にした図を指します。サービスブループリントを用いた例ですとアメリカの病院のサービスプロセス改善プロジェクトがよくネットで見受けるかと思います。 参照: サービスブループリントを使って病院のサービ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
