【時短技】イラレだけでリンク画像の色変えをする方法 - DESIGN TREKKER
はじめに ↓このビジュアルを見てデータの作りを想像してください。 写真を複数並べたレイアウトでカラーとモノクロの画像が混在しています。 ある仕掛けを解除すると実は↓このようにリンク画像は全てカラーのみで配置してあります。 手を動かしているデザイナーは想像がつくと思いますが、photoshopを使用せずイラレ上で画像の上から色ベタ面をかぶせ、透明効果で色をつけています。 しかし、この方法ではクリッピングマスクをかけた時にデータ構造が1段階増えて編集が煩雑になってしまいます。 トリミング変更による色面変形、画像のみを選択するまでの時間など画像1点だけならまだしも、複数点ある場合やビジュアルを探る工程ではさらにスピーディーに操作したいところです。 そこで、配置した画像自体にアピアランスで色を乗せてしまうワザを紹介します。 マスクについてはこちらから
UIのデザインはちょっとしたことで印象が大きく変わる、背景に適した色の選び方
背景の色に悩んだり、なんとなく決めてしまうことはありませんか？ Webサイトやスマホアプリの背景に適した色の選び方、明度と彩度を最適化するデザインのテクニックを紹介します。 Why You Shouldn’t Use Bright, Saturated Colors for Backgrounds 下記はUX Movementの記事を意訳したものです。UX Movementでは他にもUXデザインに関する記事が掲載されています。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 背景に明るく彩度の高い色を使用してはいけない理由 1. 明度と彩度 2. 注目と喚起に対する色の効果 3. ボタンのために明るく鮮やかな色を予約しておく 4. 背景に濃くて不鮮明な色を使用する 5. 背景に適した色の選び方 6. 見にくい背景と見やすい背景の例 7. 美しさとユーザビリティ 背景
「色相環」とか「トーン」ってどう使うの？配色のコツは「ジャッドの色彩調和論」 | WebNAUT by Beeworks
こんにちは、デザイナーのタカハマです。「キーカラーは決まったけど、色数を増やすと変になる…」「いつも色選びがワンパターン」「色相環ってどうやって使うの？」そんな色選びのお悩みをズバっと解決するかもしれない、配色のコツをご紹介します。また、キーカラー選びの段階から悩んでいる方は、前回の記事（色の基礎知識と色彩心理）が役に立つかもしれませんので、あわせてご覧ください。 「ジャッドの色彩調和論」と配色のための3Step ひとくちに配色理論と言っても、ニュートンやゲーテに始まり多くの学者や画家がそれぞれの持論を展開してきており、これが正しいというものはありません。今回は、その中でも20世紀半ばまでの先人たちの色彩調和論を”4つの原理”にまとめた「ジャッドの色彩調和論」に焦点をあて、配色のための3Stepをご紹介します。 （本記事の内容に明らかな間違いがあれば、ご一報いただければ幸いです。） Ste
2
こんにちは、あゆみです。 Web用としてデータを作成し、フライヤーなどで印刷したとき「なんか色が違うなあ……」と思ったこと、ありませんか？ RGBからCMYKへ変換すると、墨がくすんだような仕上がりになることがあるんです。そこで今回は、Webと紙の両方でデザインをするときに気をつけたい、ちょっとしたことをまとめてみました。 「わからないこと」が一瞬で解決するかも？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、現役デザイナーがマンツーマンで指導します！ ▼少しでも気になる方は、ぜひ公式サイトをご覧ください！ CMYKとRGBの基礎 まずは色そのもの（CMYKとRGB）についてさくっと説明します。 みなさんが普段目にするものにはすべて色がついていますよね。すべての色は光からの刺激でそ
絶対に覚えておきたいwebデザインの配色・カラー3つの基本と基礎
webデザインを考える時にカラーは切っても切りはなせません。しかし、配色は苦手だけど、まぁカラーの勉強は後でいいや…センス無いしその前にやることあるし…となんとなく後回しにされがちなんじゃないかなーと思います。基本を知っておくと、デザインに役立つのはもちろん、クライアントさんに提案出来たり、私生活や料理etc…様々な場面でとっても強い味方になってくれるます。ちょっとしたスキルアップをしたいと考えてるなら、まずは配色から初めてみるのが良いかもしれませんXD 色って？ カラーモードRGBとCMYKとは？ 色の三属性について 「色相」 「明度」 「彩度」 具体的な例と配色方法 面積比率 可読性 最後に 1.色って？ まず一口に色といっても色々(シャレじゃないですw)あるのですが大きく分けて果物や印刷物など物についてる色とテレビやパソコンのモニターなど光を放っている色の2種類があります。 物体色
Unified Communications & Collaboration | Orro
Unified Communications has evolved from chat, voice and video conferencing to a full suite of integrated applications that enable remote work, project management and team collaboration to improve productivity and streamline workflows. With integrated calling, video conferencing, chat and messaging, we can bring your team together in real time to work, share and create. From the office, to home and
Form Follows Function
Form Follows Function project is a collection of entrancing and engrossing "interactive experiences", each experience has its own unique design and functionality. The award-winning project includes a spinning navigation wheel on the website, with each interactive experience represented by a poster. By clicking on a poster, an interactive experience opens up. Each one is as much a piece of art as i
IRO
様々な人（色）を持った人が心地良く集まれる場所を創る。 hair designを通して、人（色）が交われる場所を創る。 色（趣、興味、趣味）が生まれる場所を創る。 視覚によって区別される色、型が素晴らしいモノになる場所を創る。 Cut ¥5940〜 (with shampoo blow) Color ¥5940〜 (without shampoo blow) Design color ¥3240〜 (without shampoo blow) Perm ¥12420〜 (with cut) Straight perm ¥16200〜 (with cut) Treatment ¥2700〜 (without shampoo blow) Headspa ¥3240〜 (without shampoo blow) Arrange ¥3240〜 (without shampoo blow) Set
色彩心理学に学ぶ Webサイトの色選び / ウェブデザインライブラリー
投稿日：2010年12月28日 レベル：− ソフトウェア： このチュートリアルでは、色彩心理学の観点からWebサイトの色選びについてご紹介します。 Step1 ： はじめに Step2 ： 広告における色の使い方とは Step3 ： 色彩心理学の歴史 Step4 ： 色の意味 クリエイティブ/アーティスティックの分野でプロフェッショナルになるつもりなら、色について理解する必要があります。 今回は、色彩心理学について取り上げることにします。 色は印象に影響を与えます。 住む世界によりますが、色の認知は自分たちの文化が伴います。 どこにも行ったことがないとしても、色の「意味」は時代とともに変わります。 今日においては、精神科医は色についての普遍の真理や、 「psyche（従来の心理学では色が印象に影響を与えるという考えは認められていない）」への影響について特定することができます。 色
【配色 - デザイン ★★★★★】 - Color Scheme Designer 3
Paletton, the color scheme designer In love with colors, since 2002. Paletton application Colorpedia About Paletton About Paletton Paletton.com is a designer color tool designed for creating color combinations that work together well. It uses classical color theory with ancient artistic RYB color wheel to design color palettes of one to four hues, each of five different shades. Various preview sty
WEBデザインのヒントに！WebSite Color Index：WEBサイトリンク集
Black [179] 2012:05:16:17:04:02 Blue [157] 2012:04:13:11:04:19 Brown [97] 2012:06:18:17:30:29 Gray [79] 2012:05:15:16:37:52 Green [94] 2012:07:19:16:43:42 Orange [40] 2012:06:06:11:30:52 Pink [50] 2012:02:27:12:50:45 Purple [23] 2012:04:23:19:11:41 Red [79] 2012:02:08:18:45:51 White [185] 2012:07:20:11:19:25 Yellow [49] 2012:06:11:16:16:45 Bibit [22] 2012:06:11:16:16:45 Clean [54] 2012:07:19:16:43
サイトで使っている色をカラーパレットに抜き出してくれる「I Like Your Colors」
組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! サイトで使っている色を抜き出してくれる「I Like Your Colors」「I Like Your Colors」は、サイトのページURLを入力すると、そのページとCSSで使われている色を抜き出し、色相ごとにグループ分けしてカラーパレットにしてくれるサービス。 ちなみにページへI Like Your Colorsと普通にリンクを貼ると、リンク先がそのページで使われている色の結果になります。 「I Like Your Colors」の特徴 ログイン不要 サービスページへリンクするだけで結果公開可能 使用しているCSSからカラーコードを抽出 ページとサイトで使っている色を抽出 ↑このような感じで色相ごとにカラーコードを表示してくれます。 興味のある方
デザイン講義7 – creamu
久々にメモ。 デザインで色を決めるときは、コンセプト（色調）をどんどん詰めていくことが大事。 どんな感じなのか。さらにその中のどんな感じなのか。 カラーイメージ（色彩心理）が作られる要因 1.体験・記憶（8割方共有できるもの。2割の人はずれる） 2.文化・風土・環境 3.生理（脳科学） 葉っぱとか色がすごく綺麗に出るから、スキャンしてみるといい。 今回は短くこんな感じ。 先端色彩学では、色は脳科学の領域に踏み込んで解析されていて、どの色が体のどの成分を刺激して、それによって人間にどんな印象を与えるのか、ということがわかってきているようです。 知識として学んだから、あとは実践だな。 おすすめされたのが以下の2冊。 「デザイン解体新書」はデザインの総論がよくまとまっているようですね。 「バウムテスト」の方は、「木を描いて」って言われたときに、どんな木を描くかによって人間の行動心理が分類できる、
ウェブデザインに役立つカラースキームのサンプルやジェネレーター集
The Web Squeezeのエントリーから、ウェブデザインに役立つカラースキームのサンプルやジェネレーターを紹介します。 25 Color Palette Generating Resources for Web Designing!
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
