業務を効率化させるデザインシステムとは？｜Tadaki
こんにちは！アルプのデザイナーの大澤 (@Tadaki) です。 先日デジタル庁でデザインシステム勉強会の記事が公開されましたね。活用事例として私が所属するアルプでのデザインシステムについて紹介できればと思います。 アルプではサブスクリプションビジネスを行う企業向けに、今まで手作業や自社開発がスタンダードだった契約や請求の管理を SaaS として提供する Scalebase というプロダクトを開発しています。 Scalebaseの開発では、日々プロダクトチームのメンバーとデザインをすり合わせをしつつ開発を進めています。その話の中で「画面Aの保存ボタンと画面Bの保存ボタンが微妙に高さが違うのですがどちらかに統一できませんか？」といった Component レベルの調整は、最初に定義してしまい相談せずとも理解できる方がお互い楽です。 デザインシステムを運用することで、UIの考え方やルールをチー
noteの会社に転職したデザイナーの話。｜sawa / swn.jp
こんにちは、piece of cakeデザイナーの沢登（@sawamemo）です。 前回のエントリではjoinする前でしたが、1月の頭から入社しプロジェクトに参加しています。（今ちょうど入社して1ヶ月ですね） この1ヶ月間どんなことをしていたのかザッと書き出してみようと思います。 課題の可視化弊社ではgithubのissueで課題管理しています。 noteカイゼン目安箱で頂いたご意見・フィードバックやバグの情報、などなどを全て集約して管理しています。 ただ、この方法の問題として --- ・少人数のチームでは良いが、大人数になった時にissue数がさらにカオスになる ・あとからjoinしたメンバーは過去の経緯をissueレベルで探さないとならず、これまでの経緯の学習コストが高すぎる ・今、誰が何をしていてどれくらいのリソースがあるのかがパッと見でわかりづらい ・重要な課題が埋もれ気味になり、
バッドデザイン賞を勝手にノミネートしてみた-2017年度版- - 酔いどれデザイン日誌 - Drunken Design Diary -
忙しい年の瀬ですが、皆さま如何お過ごしでしょうか。 さて、皆さんは「グッドデザイン賞はあるのにバッドデザイン賞が無いのはおかしい」という風に思ったことはありませんか？私は職業柄、日常生活で見かけた良いデザイン事例と悪いデザイン事例を写真に撮ってストックしているのですが、その中には「本当にこれギャグじゃないの？」というレベルのバッドデザインがあったりするんですよね。 良いものを良いと評価することも大切ですが、良くないものを無視するのは人類の進歩に大きな影を落としているような気さえします。ということで、勝手にアワード化してしまいました。2017と付いてますが、私が見つけたのが2017年だったというだけで製造年度などとの相関性はなく、特に意味はないです。あくまでジョークコンテンツとしてお楽しみください。 【追記】Twitterの方で一部画像が自分で撮影したものではないのでは？とご指摘頂きました。
読みやすさのデザイン備忘録 | 深津 貴之 (fladdict) | note
noteのコア体験は、「読む楽しさ」と「書く楽しさ」だと考えています。 本来ならコア体験は、調査でしっかりと導くべきものです。しかしアカデミックなUXとは異なり、実際のスタートアップ環境では時間とリソースに限界があります。このため調べながらも、走り出さなければなりません。 まず序盤はヒューリスティック（経験）ベースのデザインを行いつつ、調査やテストが可能なところから、裏づけやチューニングを行う流れになりそうです。 以下、「読書体験」における「可読性」のパートのメモ。noteチームにとりあえず提案する予定の諸々です（現時点では個人の見解です）。基本的には「当たり前のことを、当たり前に」やる予定。「これもやっとけ」的なことがあれば、タイポグラファーの諸先輩の方々には、ぜひご意見をお伺いできればと。 書体をサンセリフ系に変えるべきか？デジタルでは、一般的にサンセリフ体の可読性は、ローマン体よりも
iPhone X対応におけるデザイン上の注意ポイント | fladdict
iPhone Xが発表されたわけですが、なにこのデザイナー泣かせの変態端末。 iPhoneのUI設計者グレッグ・クリスティが追い出されて、ジョナサン・アイヴがソフトウェア統括となったのが2014年。 iOS7のフラット化あたりから、どんどんとUI設計が置いてけぼりになった感がありましたが・・・ここにきてまたデザイナー泣かせの豪速球が。 ざっくりデザインガイドラインを読んでの、気になったところメモ。 画面サイズ サイズは従来のベースであった4.7インチの375pt x 667ptから、375 x 812ptに。縦方向に145pt追加された。 想定されるインパクト 表示可能な情報量が増える 縦スクロール系コンテンツのコンバージョンが増加 スクロールで隠れるナビゲーションの必要性が低下 画面上部のボタンのコンバージョンが低下 ゲームなどの全画面イラストに、黒枠が出たり、見切れたりする グラフィッ
エンジニアが知っておくべきデザインの基本。「デザインガイドライン」と「コンポーネント」を学ぶ！ - エンジニアHub｜Webエンジニアのキャリアを考える！
エンジニアが知っておくべきデザインの基本。「デザインガイドライン」と「コンポーネント」を学ぶ！ Appleをはじめとする多くの成功企業がデザイナを役員に据えるなど、デザインに対する重要度が年々上がっているこの時代、若手のうちにUIデザインに関する基本的な考えを身につけ、より良いプロダクトを制作できるエンジニアを目指しましょう。 こんにちは。 グロースデザイナ/フロントエンジニアとしてWebサービス開発に携わっている右寺（@migi）と申します。最近は複数の企業で、数値解析から企画提案、開発も含めてサービスを成長させるためのお手伝いをしています。 現在はフリーランスとして活動していますが、直近では株式会社グッドパッチというUI（ユーザインターフェイス）デザインに特化した会社に勤めており、そこではデザインとの距離がとても近いところで開発をしていました。 そんな私の経験から、この記事では「エンジ
GoodpatchのUIデザイナーがおすすめ UIデザインを理解するためのブックリスト【2021増補版】｜Goodpatch Blog グッドパッチブログ
今回は、GoodpatchのUIデザイナーにヒアリングし、UIデザインを理解するためのおすすめ本をまとめました。 次のような人に特におすすめです。 UIデザイナーになったばかりの人 もっとUIデザインについて勉強したい人 サービス、アプリ開発に携わるエンジニア・ディレクターの人 目的別に6つのカテゴリに分けてご紹介します。あなたの関心に沿ったトピックから、 気になる本を見つけていただけると嬉しいです。 関連記事：UIデザインとは？ 大切な5つのポイントや取り組み事例を紹介 1. UIデザインを基礎から理解する ユーザーインターフェース（UI）とは何なのか、どんなデザイン要素があるのか、UIが機能する環境とは？、どうやって作ってリリースするのか…UIデザインを始めるために、まずは基礎知識を網羅しましょう。 ■ はじめてのUIデザイン 改訂版 この本は、著者の1人である吉竹遼さんが「UIデザイ
キャンセルのキャンセル問題から考えるダイアログデザイン｜Goodpatch Blog グッドパッチブログ
この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……？ 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では
株式会社インパス | UXを専門としたUI,UXデザイン・アプリ開発
ページが見つかりませんでした アクセスしようとしたページは削除、変更されたか、現在利用できない可能性があります。 お手数ですが、トップまたはナビゲーションのリンクよりお探しください。
UIデザインのKPI設計 | keisuke tsukayoshi
こちらはFablic Advent Calendar 2016の記事です。 このブログの最後の投稿もFablic Advent Calendar 2015の記事だったようで、もはやAdvent Calendar専用ブログとなりつつありますが今年もAdvent Calendarのおかげで無事更新できたということでここはひとつ…! UIデザインのKPI設計？ さて、皆さんはUIデザインをするとき、どんなKPI設定をしますか？ より使いやすいものにする、イケてるものにする、機能のつじつまが合うようにするなど定性・定量様々あると思いますが、UIの改善でサービスをより成長させる ためにぼくが最近意識している目標設定のプロセスをご紹介したいと思います。 準備①：事業とユーザー体験のKGIを一致させる KPIを決める前に、まずチームにとって一番大きな目標であるKGIを設定します。サービスは会社が運営して
深津さんによる経営者、開発者に向けたつぶやき
深津 貴之 / THE GUILD / note @fladdict (…世界中のプロダクトオーナーの皆様…聞こえますか… いまあなたの心に直接語りかけています… 新機能を1つ追加したら…旧機能を2つ消すのです…実際にできるかはともかく、そういう気分で仕事をするのです…無駄な機能を食い止めることこそ大事なのです…） 2016-11-28 16:31:18 深津 貴之 / THE GUILD / note @fladdict (…世界中のプロダクトオーナーの皆様…聞こえますか… いまあなたの心に直接語りかけています… 新機能を1つ追加したら…旧機能を2つ消すのです…実際にできるかはともかく、そういう気分で仕事をするのです…あなたが…最後の防波堤…なのです…） 2016-11-28 16:33:57
UI談義のすすめ
https://dribbble.com/shots/1679085-Mobile-UI-Blueprint-freebie私の職場ではUIについてのマニアックな談義が行われることがあります。アプリやwebだとかのデザイン会社なので周囲にはUIやUXのプロフェッショナルが集まっていて、『UI談義』の文化が根付いています。 UIを解剖するためのUI談義UI談義とは、UIオタクで集まってUIのことをひたすら考察し合うだけの集まりです。ここには職種問わず誰でも参加が可能で、UIデザイナーはもちろん、iOSデベロッパー、Androidデベロッパー、PM、マネージャーなどなど、あらゆるタイプの人が集まります。 UI談義のテーマは突如設定されます。普段利用しているアプリのちょっとしたインタラクションが気になったらそこでUI談義が始まります。iOSのアップデートでApple純正アプリのUIが変わったタイ
ミニマルなモバイルアプリUIで気をつけるべき６つのこと
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 デザインはユーザーのエンゲージメントを高める上で、最も重要なものの一つです。ユーザーはシンプルなインターフェースを好むようになってきたので、UIを基本的で必要最低限な要素のみに残していくことが成功の鍵です。 ミニマリズムは、構造と機能の絶妙な組み合わせから成り立ちます。その最大の強味は、構造を明確化することにあります。線を整え、たっぷりと余白を残し、そして視覚的な要素を最小にすることで、最も複雑な主題（内容）でさえもシンプルになります（もちろん、効果的に使われればの話です）。 ミニマルデザインでは、簡潔さ、明確さ、そして一貫性が求められます。明確なビジュアルコミュニケーションによってユーザーの問題解決を導くべきです。ミニマルなデザインのアプリが評価されるのは、ユ
ペンとふせんで！スマホUIのアイデアプロトタイピング - クックパッド開発者ブログ
検索事業部のデザイナー倉光です。 今回は、開発現場でアイデア発散フェーズにやっていることの一例を紹介したいと思います。UIデザインの手法として比較的知名度は高く、デザイナー以外でも学びたいという要望も多い「ペーパープロトタイピング」についてです。 前提として プロトタイピングにはフェーズと目的に応じて 様々な手法がありますが、今回は「小規模チームでアイデアをぽんぽん出し、伝え合うためのプロトタイピング」の話です。ユーザーに実際に評価してもらうためのプロトタイプの作り方についてはこの記事では割愛させていただきます。 また非デザイナーの方は「いやいや、デザイナーじゃないと画面なんてうまく書けないよ…」と躊躇してしまうかもしれませんが、本記事では社内のディレクター/エンジニア/インターン生が書いた成果物も掲載していますので、そちらも参考になると思います。 目次 目次 1.ペーパープロトタイピング
UI/UXデザインは「プロトタイプがないと話にならない」- 「Adobe XD」を使った"最強のデザイン手法"
アドビ システムズ主催のクリエイター向けイベント「Adobe MAX Japan 2016」が9月2日、開催された。 これは、米サンディエゴで行われている本家イベント「Adobe MAX」を日本のユーザー向けに開催するもの。イベント当日は多種多様なセミナーが行われたが、本稿では「プロトタイプで舵を取れ！Adobe XDを使った最強のUI/UXデザイン手法」と題して行われたセッションの模様をお届けする。 "ハードルは高くスケジュールは短い"Webの現場 同セッションのスピーカーは、ビジネス・アーキテクツのデザイナーの荒木脩人氏。荒木氏が所属するビジネス・アーキテクツは、ウェブサイトの構築を中心に、コンテンツ開発からデータ解析、調査、分析、最適化まで行うデザイン会社。じぶん銀行や森ビル・六本木ヒルズのウェブサイトやauもモバイルサービスアプリなどが代表的な作品だ。 そんな中、2012年に同社に
ボタンデザインの歴史と進化から学ぶベストプラクティス
ボタンは私たちにもっとも身近な、ごく普遍的なインタラクション要素です。とてもシンプルなUI要素でありながらも、ここ数十年でそのデザインは大きく変化しましたが、いつの時代も大事なのはその明確さと認知性でした。 この記事では、ボタンデザインの進化を振り返り、効果的なボタンを作るための方法論について見ていきたいと思います。 スタイルの進化 立体的なボタン 昔からOSのボタンデザインは、周りの要素からボタンを見分けるためにレリーフとシャドウを使ってきました。 なぜこのデザインなのかというと、シンプルな原理が基本となっています。ボーダー、グラデーション、ドロップシャドウを使用して背景とコンテンツに対してボタンを引き立たせ、クリックできる要素だということを簡単に識別できるようにしているのです。
デザインの伝え方
クライアントや上司、チームメンバーなどデザインを取り囲むステークホルダーにデザインの意図を正しく伝え、承認や合意を得ることは最適なUXを実現するうえで必須です。本書は、デザイナーが、デザイナー以外の人に、デザインに関わる様々な事柄を効果的に説明できるようになるための考え方やテクニックを紹介します。コミュニケーションの重要性、ステークホルダーの視点の理解や心情に寄り添う意味、デザインの狙いを明確にする作業、ニーズを聞き出すためのコツなどを詳しく説明します。 デザインが承認されるまでの手順や合意しておきたい事柄を順を追って解説しているため、デザイナー以外の人にも役立ちます。日本語版付録として、ヒーウォン・チョイ氏による「最小限のドキュメントで理解を最大限に深める」を収録。デザインの有効性を実証するスキルを身に着け、組織としてベストなUXを実現したいと考える人、必携の一冊です。 翻訳者によるサポ
根拠や成果を超えたデザインに思いを馳せる
人間中心設計だけでは見えないこと 今では見なくなりましたが、ひと昔の MacBook Pro や Power Mac の本体側面にあるスリープインジケーターや電源ボタンは、スリープ時に点滅をしていました。これがただの点滅ではなく、まるで人が眠っているときの呼吸のような動きをしていました。Apple はこの点滅のデザインの実現のためにコストをかけ、特許も取っています。 Apple 製品は小型化・薄型化が進んでいるので、こうした『演出』が少なくなっていますが、今振り返るとスゴいなと思うわけです。誰も気にしないディテールに拘るという点はもちろんですが、製品に実装してしまっていること自体がスゴいなと。 最近は「利用者のニーズを引き出して、実装しましょう」「そのデザインに効果があったか数値化しましょう」という文脈の中でデザインが語られることが多いわけです。たぶん、そうした中で「電源ボタンを人間の呼吸
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「ここがダメだよ！ゲームのUI」 - こんなバッドUIに心当たりはありませんか？ゲームUIの失敗リファレンス集
Open Color
