タグ

designとcolorに関するmonopooのブックマーク (36)

  • イメージスケールの基本 | カラー戦略の専門家 | NCD-WEB | 色彩心理・生活者研究・トレンド分析の日本カラーデザイン研究所

    ※一部のInternet Explorerで「データベースシステム」「Hue&Toneシステム」を閲覧できないケースが発生しております。 お手数ですが、別のブラウザでお試しください。 イメージスケールとは イメージスケールは日カラーデザイン研究所が研究・開発した感性マッピングツールです。 色に対して抱くイメージは人によって微妙に異なりますが、共通する部分も多く認められます。そのイメージの共通感覚を心理学的研究の蓄積で明らかにしたものが、イメージスケールです。 基のイメージスケールは、イメージの判断基準であるWARM-COOL、SOFT-HARDの座標軸上に単色、形容詞、形容動詞を表現した配色が配置されています。(来は第3軸としてCLEAR-GRAYISHの軸があり、3次元のイメージ空間となっています) ■カラーイメージスケール すべてのイメージスケールの元となっている単色イメージスケ

  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • マテリアルデザインに使える配色をまとめたサイト「Material UI」 | ライフハッカー・ジャパン

    「Material UI」はマテリアルデザインに使える配色をまとめたサイトです。アクセスすると様々な色が表示されます。どれもマテリアルデザインに合う色合いになっていますよ。クリックするとカラーコードをコピーできます。 以下に使ってみた様子を載せておきます。まずMaterial UIへアクセスしましょう。マテリアルデザインに合う色がずらっと一覧で表示されています。 このようにさまざまな色が表示され、クリックするとカラーコードをコピーすることができます。流行りのマテリアルデザインを採用する際、どの色を使おうか困ったときにぜひご活用ください。 Material UI | Material Design | Material UI Colors (カメきち)

    マテリアルデザインに使える配色をまとめたサイト「Material UI」 | ライフハッカー・ジャパン
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • おしゃれな配色パターンが見つかるサイト+アプリ10選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    先日、個人でやっているサイトをリニューアルしていたのですが、想像以上に色の組み合わせについて悩んでしまいました。 デザインの知識が皆無の私にはハードルが高すぎたようで、文字、リンク、バナー、背景などの色をベタベタ触っていたら、数時間後にはヘドロのような色彩美のサイトが誕生しました。絶望です。 そこで今回は、私のような素人でも参考になる配色見サイトについて、用途別にまとめてみました。 「わからないこと」が一瞬で解決するかも? Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、現役デザイナーがマンツーマンで指導します! ▼少しでも気になる方は、ぜひ公式サイトをご覧ください! ベースとなるカラーを設定したい 1. 原色大辞典 https://www.colordic.org/ いつも参考に

    おしゃれな配色パターンが見つかるサイト+アプリ10選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • 色とデザイナーとアクセシビリティ | チャットワーククリエーターズブログ

    お久しぶりです、デザイン部の守谷です。 ここしばらくクリエイターズブログでのアウトプットができていませんでした。その間、チャットワークと私の周りで何が起こっていたかというと、グローバル展開と合わせブランドカラー/ロゴの変更、それに合わせたチャットワークの各サイトのリニューアル、一番最近ではツールのカラーもブランド統一に合わせ変更になったのをご覧いただいていることと思います。 ちなみに、既にご利用の方はお気づきかと思いますが、今回のリニューアルではUI変更を行わずにテーマ(と一部アイコンの変更)のみの最小限での調整、という方針で進みました。利用者がたくさんいるチャットワークを大胆にいじって混乱を招くより、早々にカラーだけでも「チャットワークブランド」と合わせることが重要との判断からです。 色のみの変更、という場合、バランスだけ見ていればOK!簡単!速攻完了!そうは行きません。 もしもそれだけ

    色とデザイナーとアクセシビリティ | チャットワーククリエーターズブログ
  • 日本の伝統色が一目で分かり三原色・カラーコードも調べられる「NIPPON COLORS」

    紅・山吹色・橙など日古来の色の名称は実際にどんな色なのかイメージしづらいときがあるもので、そんな時に色を調べるのにもってこいなのが、様々な「日の色」を知ることをできるサイト「NIPPON COLORS」です。 NIPPON COLORS - 日の伝統色 http://nipponcolors.com/ NIPPON COLORSのトップページはこんな感じ。最初の画面は「櫨染(はじぞめ)」に設定されています。 知りたい色にカーソルを合わせてクリックすればOK。今回は撫子(なでしこ)をクリック。 クリックすると全画面が撫子色に変化。 撫子色の部分を良く見ると、カラーコードの番号も書かれています。撫子であれば「DC9FB4」。 色の三原色の配合も画面に表示されており、撫子色はC(シアン)が2、M(マゼンタ)が43、Y(イエロー)が3の配合。絵の具を混ぜて色を作ったりするときなどに参考になり

    日本の伝統色が一目で分かり三原色・カラーコードも調べられる「NIPPON COLORS」
  • 最近のUIデザインで使われている同一色相のグラデーションなど、人気のあるカラーのまとめ | コリス

    落ち着いたパステル系のカラー、同一色相の繊細で美しいグラデーションなど、Material Design, iOS 8, Modern UIなどやフラットなスタイルで使われている最近人気のあるカラーを紹介します。 PhotoshopやIllustrator用のスウォッチもダウンロードできますよ。

    最近のUIデザインで使われている同一色相のグラデーションなど、人気のあるカラーのまとめ | コリス
  • 色彩理論の基礎に学ぶ、相性抜群な「色の組み合わせ」 | ライフハッカー・ジャパン

    身につける服でも仕事のプレゼンテーションでも、何かの見た目を良くしたいのなら、色は大切な要素です。ですが、オレンジと青が完璧な組み合わせだなんて、誰もが直感的に知っているわけではありません。自分の直感を信じられないなら、色彩理論の基を理解して、それをもとに正しい色を選んでみてはどうでしょうか。 色相環を知る 上の図は基的な色相環で、色を選ぶ際の指針になるものです。学校で見たことがあるかもしれませんが、忘れている方のために、簡単におさらいしておきましょう。 赤、青、黄色の3色が原色です。赤と黄色を混ぜると橙になります。青と黄色を混ぜると緑になります。赤と青を混ぜると紫になります。そのため、橙、緑、紫は二次色と呼ばれています。赤紫や青紫などの三次色は、原色と二次色を混ぜたものです。 すべての色には明色(明度の高い色)と暗色(明度の低い色)があります。明色は元の色に白を混ぜてできる色、暗色は

    色彩理論の基礎に学ぶ、相性抜群な「色の組み合わせ」 | ライフハッカー・ジャパン
  • 0から学ぶアプリの配色 - Rejasupoem

    当方Androidエンジニアをしておりますが、プライベートでアプリを作るとき、画像リソースについてはAndroid組み込みのものを使ったり、Fontawesomeを使ったり、フリー素材を使ったりしています。 しかし配色はインターネットに落ちていなくて、自分でやるとイマイチで、いい感じにしたいという気持ちがありました。 そこで、調べたり試行錯誤をして知見が得られたので、配色に悩むエンジニアのために共有します。 3行まとめ デザインはセンスで行うものではなくロジックで成り立ってる、つまり努力でなんとかできる Color Scheme Designer 3 便利 配色を学ぶのには下のスライドが一番分かりやすかった 色彩センスのいらない配色講座 from Mariko Yamaguchi STEP 1. 対象に興味を持つ 〜〜で必要だから勉強しなければって始めてたものが長く続いたことがないので、

  • 配色を考えるときに便利なオンラインツール10個集めてみました | WP-E (仮)

    最終更新: 2018年4月14日 皆様こんにちは!最近WP-Eメンバーに名を忘れられているような気がするWP-E HINOTANです。寿司ネタがどこかへ行ってしまいましたね。 さて今回はタイトルの通り、便利な配色ツールを紹介していきたいと思います。 Adobe Kuler まずはAdobeが提供しているAdobe Kulerから。こちらは有名なので知っている方も多いと思います。Adobe KulerはPhotoshopやIllustratorとの連携機能があるので便利です。(Adobe Creative CloudのアカウントIDが必要となります) 「Explore」のページでは、様々なカラーパターンを見ることができ、気に入ったものを登録したり編集したりすることができます。登録したカラーパターンはPhotoshopやIllustratorにも反映されます。 Color Hexa Colo

    配色を考えるときに便利なオンラインツール10個集めてみました | WP-E (仮)
  • ノンデザイナーこそ押さえておきたい! 配色・レイアウトの基礎が学べる7個の厳選スライド

    まだまだメンバーの数が少なく、職種ごとの距離が近いスタートアップ。デザイナーの仕事をディレクターやエンジニアが理解することが、プロジェクトを円滑に進める秘訣です。 デザイナーではない方々にとって、デザイナーが普段何を悩み、どのようにWebデザインしているのか知るのは、非常に重要と言えるでしょう。今回は厳選した7つのスライドをご紹介しながら、「配色」「レイアウト」といったデザインのエッセンスを学びます。 もちろん、職のデザイナーの方にも役立つスライド7連発です! 1.色彩センスのいらない配色講座 7000いいね! されたスライド 「時間がない! 今すぐ作り始めないと納期に間に合わない! でもどんな色を使ったらいいか分からない!」そんな人におすすめなのがコレ。Facebookで7000以上のいいね!がついた、@marippe_さんのモンスタースライドです。 配色や明度・彩度の基礎をお

  • リリースされたばかりのカラースキームツールが簡単・便利で使いやすい! -Colour Code

    Colour Code http://colourco.de/ 、いいドメインだ! 使い方は簡単です。 カラーの変更 マウスの左右で、色相を変更 マウスの上下で、光度を変更 スクロールで、彩度を変更 ※スクロールはMagic Mouseじゃないとできないかも 基操作 クリックで、カラーをロック ロックされた鍵アイコンをクリックで、ロックの解除 カラーをクリックで、保存して新しいカラーを作成 ゴミ箱をクリックで、カラーの削除 まずは、流行のサーモン(#F38268)を右上のボックスにセットしてみます。

  • 「Webサイトの配色で困った!」→「HUE/360使えば良いじゃない」

    Webサイト制作で避けて通れない配色の決定。芸術的素養が絶望的にないのでいつも泣いてるゴロドクさんです、どうも。 所詮素人には理論に基づいた配色など無理ゲーです。先日もちょっとしたデザイン的なゴニョゴニョという場面に出くわしましていつものように悩みつつ、なんか配色決定のためのWebサービスないかなーと思って探してたらこういうのを見つけました。 webでの色指定は基的にRGB値での指定となりますがこれって光の三原色の混色なんですよね。 実際にCSSなんかで数値いじりつつデザインしてると「なんか違うなー」というときにもっと明るくしようとか、もっと彩度上げようってのが感覚的にどの数値をどんだけいじって良いのかってわからないんですよ。 RGB値直接いじって彩度上げようと思ったらくすんじゃった上に色みかわっちゃってオヤオヤ残念なんて日常茶飯事ですよ(いやそのまえにフォトショなりなんなりでデザインカ

    「Webサイトの配色で困った!」→「HUE/360使えば良いじゃない」
  • 色を指定したら、その色に関連した色合いを抽出してくれる・「colllor」 - かちびと.net

    colllorは色のコードを指定する事で、その色と相性の良い色、トーンなどを抽出してくれるカラーツールです。 colllor

    monopoo
    monopoo 2013/02/23
    “色を指定したら、その色に関連した色合いを抽出してくれる・「colllor」” http://t.co/Gkt84Pr1IB
  • この春、デザインやファッションに使いたい10色 -2013年春のトレンドカラー

    まだまだ寒い日が続きますが、日も少しずつ長くなり、春の気配を感じますね。 pantoneがセレクションした2013年春のトレンドカラーを紹介します。 Spring 2013 Fashion Color Trends - Pantone Fashion Color Report この春、グリーンのトレンドは否定できないでしょう。 グリーンは他のすべてのカラーの前景でも背景でも完璧に役割を果たします。今年のトレンドカラーでもあるEmeraldは、グリーンの中でも洗練された鮮やかでクリアです。Grayed Jadeはグレーを少しいれた色合いで静か・休息のムードを引き起こします。Tender Shootsは柔らかい新芽の色合いで春の到来をイメージさせ、さわやかで朗らかです。

  • http://handywebdesign.net/2012/11/if-you-want-to-use-many-colors/

    http://handywebdesign.net/2012/11/if-you-want-to-use-many-colors/