現役デザイナー直伝！これだけでUIとUXデザインが劇的に良くなるテクニックまとめ
効率的で美しいUIデザインを作成するときに、ほんの少し手を加えるだけで、デザインを素早く改善できることがあります。 わずかな調整でクライアントはもちろん、ユーザー、そして自分自身としても満足できるUIデザインをつくることができます。 この記事では、現役UIデザイナーが実践から学んだ、効果的なテクニックやデザインの小技をまとめています。 これらのテクニックを活用すれば、すこしの努力でデザインとユーザーエクスペリエンス全体の両方を改善するのに役立ちますよ。 01.装飾的な要素は、使いやすければ問題なし ウェブサイトのテキストコンテンツの大半は、ユーザビリティの基本ルールを守るのがもちろんです。 しかし、純粋にデザインとして装飾目的でテキストを追加したいときもあるでしょうし、それはそれで良いと思います。すべてのデザインが同じだと、味気なく感じてしまいます。 デザイン目的の要素が、ユーザーエクスペ
アメリカの美大で学んだ、デザインへの向き合い方【授業編】｜Sakino Tomiura
先日ふと思い立ち、大学時代のデータを見返していたら改めて勉強になることが多かったので、振り返りも兼ねてnoteを書いてみたいと思います。 アメリカ・ミシガン州にある美大での4年間生まれ育った兵庫で高校を卒業した後、アメリカのミシガン州、Grand Rapidsという小さな街にある美大で、4年間学生生活を送っていました。 通っていた大学は Kendall College of Art and Design of Ferris State University という4年制の美術大学で、グラフィックデザインを専攻していました。 アメリカでも特に有名な大学ではないので、日本での認知度はほぼないに等しいかもしれません。 画像：Kendall College of Art and Design 主な授業 実際に使っていた大学時代の教科書一部。あくまで私が通っていた大学の一例なので、「アメリカの美大は
わかりやすさを作るIA - Pepabo Tech Portal
こんにちは。GMOペパボ株式会社でCDO（Chief Design Officer）を務めている小久保浩大郎 a.k.a. kotarok です。CDOというのはまあ役職の話なのですが実務者としてはIAという領域を得意としています。ということでIAの話です。Information Architectureですよ。Artificial Intelligenceの方ではありません。 ペパボでは隔月でデザイナーの社内勉強会「Designer's MTG（通称デザミ）」を行っており、先日はIAをテーマに開催しました。今回から数回に渡ってそこで話された内容をダイジェストでお届けしたいと思います。と言っても実はIAをテーマにしたデザミは今回が2回目だったりします。前回の模様やデザミ自体の取り組みも記事になっております。 そんな2回目のIA回はテーマを具体的に「わかりやすさを作るIA」としました。私自身
作字テクニックのひとつ「文字を溶かす」を徹底解説します | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
デザインしてて文字をばちっと決めたいときってありませんか メインビジュアルや見出しなどで、「文字（コピー）をばちっと決めたいッ！」ってときありますよね。そのときに普通の書体をそのまま置くと、 どうしてもデフォルト書体そのまま感が出ちゃうときってありませんか？ もちろん出ちゃわないときもあります。でも出ちゃうときもありませんか？ うん、ですよね。 そんなときの解決策の一つ、「作字」 “デフォルト書体そのまま感”をなくす方法はいくつかありますが、その一つとして「作字」があります。デフォルトの書体を少し調整して文字に特徴をつけることですね。 文字を”ちょっとロゴっぽくする”するという言い方が近いでしょうか（わかりにくいか……）。 作字するといい意味で”違和感”がでて、印象的なビジュアルになります。その作字のひとつに「文字を溶かす」という小ワザがあります。 文字を溶かすって？ Afterの文字を拡
ロゴはこうして出来ました - Hatena Design Group
こんにちは。 id:akawakami です。はてなの企業ロゴリニューアルを担当しました。 はてなでは、20周年を機に企業ロゴのリニューアルを行いました。ロゴマークのコンセプトなど、表現上の意図についてはプレスリリースで触れられているので、ここでは制作面にフォーカスして、ロゴマークのデザインをご紹介したいと思います。 hatenacorp.jp はてなロゴの変遷 今回リニューアルしたロゴマークは、はてなの企業ロゴとしては4代目となります。 2001年 〜 2005年 「人力検索はてな（人力検索サイトはてな）」とともにデビューした、はてなの最初のロゴマークです。 2005年 〜 2007年 ブロックを組み合わせてはてなマークを表現したロゴマークです。この時に生まれたはてなマークの表現が、その後のロゴマークに踏襲されていきます。 2007年 〜 2021年 ブロックのはてなマークをシンプルにア
ベイジの業務システムUIデザインワークフロー（100のタスクを徹底解説） | ベイジのUIラボ～業務システムとSaaSのUIを考える
2021年現在、ベイジの柱の事業はウェブ制作事業とウェブアプリデザイン事業です。ウェブ制作事業は会社設立の2010年からの主力事業で、サービス品質の平準化を目的に2014年頃からワークフローの整備を進めてきました。 一方ウェブアプリデザイン事業については、事業拡大したのがここ数年で、まだワークフローが整備されておらず、各人の裁量に委ねた進め方になっていました。そこで今後の事業拡大とメンバー増員を想定し作成したのが、業務システムやSaaSのUIデザインに特化した「ベイジの業務システムUIデザインワークフロー2021年版」です。 基本的な進め方は国際規格（ISO 9241-210※）の人間中心設計プロセスに基づいて組み立てていますが、細かいタスクの順序や内容は、今までベイジで培ってきたノウハウをふんだんに盛り込み、組み換えています。 また今回ワークフローを整備するうえでは、クライアントごとの開
くまモンが黒いのにもワケがある。凄腕クリエイティブディレクターのアウトプット術｜水野学の履歴書
good design companyの代表取締役であり、数多くの企業ブランディングに携わってきた水野学（みずの・まなぶ／@g_d_c）さん。熊本県のPRキャラクターである「くまモン」や、日本の工芸技術を活かした製品を中心としたこだわりの光る「中川政七商店」など、誰もが一度は目にしたことのあるデザインを手がけてきたことでも知られています。 水野さんの仕事はデザインにとどまらず、クライアントであるお店や企業のブランディングにも及びます。かつては広告代理店への入社を目指していたという水野さんですが、広告とは別の切り口で仕事をしていたことが、結果として今につながっているといいます。 水野さんの考えるブランディングとは「その企業の“らしさ”を最大限に引き出し、世界観をつくり上げていく」こと。企業の経営そのものに影響を与えることも多い仕事にどのように向き合っているのでしょうか。水野さんの仕事論とアウ
2021年のデザインチーム勉強会（BDI）まとめ【7月〜9月編】 - BASEプロダクトチームブログ
この3ヶ月で開催したBDIの内容を紹介します こんにちは、Design Group Manager の小山です。 7〜9月もデザイナー発信の勉強会「BDI」を実施したので、どんなことをやっているのか内容をまとめました。 社内勉強会のネタのタネにぜひご活用ください！ BDIとは？ 『BDI』は「BASE Design Inspiration」の略。 2018年の秋頃から活動している、デザイナーがやりたいことを持ち寄って、 デザインに関する幅広い知見をみんなで楽しく学ぶことを目的とした任意参加の社内勉強会です。 BASEのデザイナーであれば、デザイナーだけでなく誰でも参加することができます。 Inspirationの名の通り新たなひらめきにつながる新しいトピックを取り上げることも多くあります。 過去に開催したBDIのまとめはこちら devblog.thebase.in devblog.theb
業務を効率化させるデザインシステムとは？｜Tadaki
こんにちは！アルプのデザイナーの大澤 (@Tadaki) です。 先日デジタル庁でデザインシステム勉強会の記事が公開されましたね。活用事例として私が所属するアルプでのデザインシステムについて紹介できればと思います。 アルプではサブスクリプションビジネスを行う企業向けに、今まで手作業や自社開発がスタンダードだった契約や請求の管理を SaaS として提供する Scalebase というプロダクトを開発しています。 Scalebaseの開発では、日々プロダクトチームのメンバーとデザインをすり合わせをしつつ開発を進めています。その話の中で「画面Aの保存ボタンと画面Bの保存ボタンが微妙に高さが違うのですがどちらかに統一できませんか？」といった Component レベルの調整は、最初に定義してしまい相談せずとも理解できる方がお互い楽です。 デザインシステムを運用することで、UIの考え方やルールをチー
わずか月2時間、水野学氏とのアワード開催で起きた、劇的な組織変化｜オイシックス・ラ・大地 | キャリアハック（CAREER HACK）
いかに強いデザイン組織をつくるか。オイシックス・ラ・大地が実行したのは、クリエイティブディレクター水野学氏を招いた「クリエイティブ・アワード主催」という策。「成果は劇的だった」とクリエイティブ・マネージャー 寺内能之さんは語る。プロジェクト全容を追った。 2016年 オイシックス・ラ・大地（就任当時の社名はオイシックス）のクリエイティブディレクターに就任した水野学氏（good design company 代表／クリエイティブディレクター）。 当初、水野氏の役割は「ブランドに対する相談役」と思われていた。ところがスタートしたのは意外な取り組みだった。 「社内で、クリエイティブ・アワードを行なう」 取り組みの成果について、寺内能之さん（クリエイティブ委員会 クリエイティブ・マネージャー）はこう語る。 「費やしたのは月1度、2時間程度。この取り組みは、これまで抱えていたデザイン、そしてチームの
ソシオメディア | ヒューマンインターフェース ガイドライン
ソシオメディアがまとめている、ヒューマンインターフェースをデザインする際の指針です。これらは、インターフェースデザインに関する様々な文献と、実際のデザインコンサルティングで得た知見をもとに、ソシオメディアが独自に編纂したものです。継続的に追加・更新していきます。 すべてモデルインタラクションプレゼンテーション
【パワポ研の決算資料探訪①】Goodpatch社の決算説明資料はシンプルが故に美しい｜パワポ研
決算説明会資料というものがあります。株主に向けて、当期あるいは通期の決算説明を行うための資料です。主に企業のIR室（Investor Relations）、つまり企業が株主向けに現況や今後の見通しを広報する活動を主に実施する部門が書きます。 そのIR室の役割の一つに決算説明会資料の作成がありますが、これはすごく骨の折れる作業な一方で、報われない作業でもあります。なぜなら、IR担当部という全然力がないような部が、関係各所に数字をもらったり現況を把握したりレビューしてもらったりし、その上えらい人からも余計な口出しが色々と入るからです。労多くして、という典型例ですね。 しかし、今回ご紹介するGoodpatch社についてはそれはあてはまりません。なぜなら、Goodpatch社は「デザイン」という業務が事業に大きく影響するからです。そんな会社が、自社の発表する資料で手を抜くわけがなく、またそれの見栄
【厳選】デザイナーになる前に知っておきたかった、現場で活躍するためのスキルセットまとめ｜note15選｜TAKUYA SAKAO
【厳選】デザイナーになる前に知っておきたかった、現場で活躍するためのスキルセットまとめ｜note15選 こんにちは、プラスニド・デザインCEOの坂尾(@taku_ux_jump)です。 4月になりプラスニド・デザインにも新たな仲間たちが加わり、益々活気が増してきています。そんなフレッシュなデザイナーの方々や、これからデザイナーを目指してみたいという方々に向け、リアルな現場で求められる大切にすべきスキルが書かれたnoteのデザイン関連記事を集めてみましたので、是非参考にしてみて下さい。 皆さんがいち早く現場で、ご活躍できる事を願って。 【掲載させて頂いた方一覧（順不同）】 ・TSUYOSHI（デザインマネージャー）さん ・灰色ハイジさん ・せんざき｜n2p designer さん ・カイクンさん ・えんあか / mixi さん ・坪田 朋さん ・枌谷 力さん ・Toshiya Sasakiさ
新卒未経験Webディレクター向けに作ったマニュアルをチラ見せします | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
と、声をかけていただけることがしばしばありました。 はて？ 何の資料だろう？ と不思議に思っていたのですが、実は休職前に新卒ディレクターに教えるためにまとめていた資料が脈々と受け継がれていたのでした。 なんとも嬉しい声！ 正直、頑張って作った甲斐あった！ 今回は、新卒・新人ディレクターに向けて作ったマニュアルの一部を抜粋して、チラ見せしたいと思います。 ※ 以下の内容はOJTをしていきながら「わからない」と返答されたものを基準にまとめておりますので偏りがあります。一例としてお考えください。 マニュアルの構成 マニュアルの構成は大きく4つに分類されており、それぞれに関係した知識をつけることが大事だと考えています。そのため、マニュアルを作り始めるときには以下の扉ページを作るところから始めました。 資料の扉ページ ディレクション デザイン コーディング システム 1. ディレクションで必要な知識
Webデザインについて＃1「コンテナという概念」｜あゆずまさき
前回のお話と前置きこのシリーズは「グラフィックデザイナーがWebを学んでみて」というテーマで不定期連載しております。このマガジンに今後もストックされていきます。 初回では -デザインとは？ -紙とWebの違い についてまとめました。 今回はWebデザインを行う上での基本的概念の「コンテナ」についてまとめます。これはデザインのみでなくコーディングにも通ずる考え方です。前回の記事で書いたようにWEBデザイナーは全員コーディングを行う必要はないと思いますが -自身のデザインがどう実装されるか -更新の際にコーダーさんが困らないようなデザインを心がけること が大事だと思います。 「コンテナ」という概念と必要性コンテナとは画面内のコンテンツの収まる範囲を設定するブロックで、 コンテンツを一定の範囲内で整列させる役割を持ちます。簡単に言うと、「表示エリア」を決めるものです。これを決めることで、 -整っ
Webデザイナー1年目で指摘された10のこと｜シロマ🏰｜note
Webデザイナーとして就職し、1年が経ちました。 会社の上司や学校繋がりの先輩、たくさんの方にご指導いただき、なんとか今までやってこれています。 なので、少し遅くなりましたが、1年目に指摘された点を10点、書いておこうと思います。 ①これからデザイン業務に携わる新人さんへ以下10点を気にして携わると、たぶんスタートダッシュが切れると思います。 ただ、失敗は悪いことではありません。みんな、通って来た道だよ〜わかるよ〜って言いたいがために書いてるようなもんです。 どうか自信を失わないで。一緒に頑張りましょう〜〜！！ ②新人さんを教育する中堅〜ベテランさんへ1年のうち、50回ぐらい同じ内容を指導するかもしれません。。大変お手数おかけします。 本人としても気をつけているつもりなんですが、所詮つもりで終わっています。が、１年経てばなんとか気づける程度には成長します。 本当に申し訳ありませんが、どうか
UXピラミッド – UXデザインの正しい評価方法 – デザイン会社 ビートラックス: ブログ
前回の「UXハニカム – UXデザインの正しい品質評価方法 –」では、サービスやプロダクトのUXデザインを評価する際に一般的に用いられている、UXハニカムを活用した方法を紹介した。加えて、実はもう一つユーザー体験のクオリティを測る方法がある。 ユーザー体験を構成する3つのポイント消費者がサービスを受けるとき、ユーザーがプロダクトを利用するときに受け取る体験の質を高めるのがUXデザイナーの仕事になる。 そして、その体験を左右するのが、1. 見た目の品質 (Look), 2. 感覚の品質 (Feel), 3. 使いやすさ (Usability) である。大きく分けてこの3つの要素のクオリティが高いほど、ユーザーに対してより優れた体験を提供することが可能になる。 実用性と利用感覚を測るUXピラミッドUXハニカムに加えて、もう一つのUXクオリティを測る手法としてUXピラミッドがある。6つの階層で構
「勝てないと分かってからが勝負」タカヤ・オオタのポジション取り | キャリアハック（CAREER HACK）
【連載】ぼくらの新人時代 「新人時代をどう過ごしていましたか？」テック業界のトップランナーたちに、こんな質問を投げかけてみる新企画がスタート。その名も、「ぼくらの新人時代」。知識もスキルも経験も、なにもない新人時代。彼ら彼女らは”何者でもない自分”とどう向き合い、いかにして自分の現状と未来を定め、どんなスタンスで学んできたのか。そこには私たちにとって重要な学びが詰まっていた。 「スタークリエイターたちに勝てる気がしなかった」 「デザイナーとして自分には何の才能もないって、ずっと悩んでいました」 彼からこの言葉が出てきたとき、なんだか少し気持ちが救われた気がした。売れっ子の彼にも、自信が持てず、何者でもない自分に頭を抱えたことがあったなんて。 お話を伺ったのは、デザイナーのオオタ・タカヤ (@198Q) さん。企業やプロダクトのブランドを体現していく「CIデザイン」の領域で数々の実績を残して
翔泳社のベストセラー「やってはいけないデザイン」が期間限定で無料公開 - デザインってオモシロイ -MdN Design Interactive-
翔泳社は、9月26日、同社のベストセラー書籍「やってはいけないデザイン」を期間限定で全ページ無料公開することを発表した。公開期間は2018年9月26日（水）～10月2日（火）まで。購入すると1,800円（税抜）になる、全232ページのデザイン書である。 「やってはいけないデザイン」は素人デザイナーがやりがちな“残念デザイン”と、それを改善するためのノウハウをまとめた実用書。2016年12月の発売以来、SNSの口コミなどで反響を呼び、5万部を突破したロングセラーである。 素人デザイナーを多数指導した経験を持つプロデザイナー・平本久美子氏が、その実経験に基づくリアルな失敗ポイントや、ココが惜しい！というポイントを余すところなくレクチャーする内容で、これから本格的にデザインを勉強しようという人であれば、読んでおいて損はない一冊だ。
デザイン組織における「対話」のススメ
サービスをつくる上でデザインが重要だ。 そんなことを感じていても、言葉としては抽象的なままで、実際のプロセスにおいて、具体的に重視すべきことの定義や、デザイナー自身がどんなスキルを向上させて良いのかが曖昧だったりすることは少なくないのではないでしょうか。 その中で、Coineyのデザインチームでは、サービスのデザインプロセスにおいて「対話」というものを一番重要なものとして定義し、対話のあるプロセスによってより良い体験をつくり出すことができるように取り組んでいます。 そもそも「対話」とは何かまず、なぜ対話が重要なのかという点に入る前に、対話とは何であり、何でないかを明確に定義しておく必要があります。 教育学者であり、企業・組織における人々の学習・コミュニケーション・リーダーシップについて研究されている中原淳氏によると、組織におけるコミュニケーションの形式を分類すると議論・雑談・対話に分けるこ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
