タグ

colorとArticleに関するbleu-bleutのブックマーク (42)

  • Canvasできれいな色相環を描画する : document

    8月14 Canvasできれいな色相環を描画する はじめに JavaScript で Canvas を使っていると、HSV の Color Picker とか作りたくなって色相環を描画したくなることがよくあるとおもいます。 ここでは、自分の行っている色相環の描画方法を説明します。 準備 色相を扱うのために HSV 色空間を使います。HSV から RGB への変換は以下の function を用います。 function hsvToRGB(hue, saturation, value) { var hi; var f; var p; var q; var t; while (hue < 0) { hue += 360; } hue = hue % 360; saturation = saturation < 0 ? 0 : saturation > 1 ? 1 : saturation; v

  • RGBからCMYKに変換した写真などでCMYK濃度の合計を300%以下に抑える方法 | delaymania

    【追記】 Twitterで「墨版を抜くのが正しいと言ってしまうのはどうなのか」というご指摘をいただきました。完全に間違いとは言えないけども想定した色にならないので避けるべきであると。(少なくとも他の人に進めるような方法ではないとのことです。) その後いろいろ調べまして「やもめも」というブログで参考になりそうな記事を見つけましたのでご紹介します。 K100%はグレー???いいえ、「黒」です。それでもリッチブラックを使うなら…(更新) | やもめも インキ総量を落とす「テク」、色が変わってしまうから、どれがいいとは安易には勧められない | やもめも 間違いだらけのPhotoshop|CMYK変換に関する二つの「デマ」を検証する | やもめも また、この記事は記録として残しておきますので、上記の参考記事を参照の上、正しい方法でデータ作成していただければと思います。 フライヤーや名刺などの印刷物を

    RGBからCMYKに変換した写真などでCMYK濃度の合計を300%以下に抑える方法 | delaymania
  • 現実世界から色を盗む『Yocli for iPhone』 - RyoAnna

    面白いiPhoneアプリを見つけた。名前はYocli。現実世界から色を盗むアプリだ。 Yocli(App Store Free) Yocliのメイン画面はカメラ。目の前の世界にカメラをかざして、色を確認したい場所をタッチすると、画面の右下に色がドロップされて、カラーコードが表示される。カラーコードはTwitter、Facebook、メールで共有可能との事だが、私が試した限り、Twitterとメールは投稿画面が表示されなかった。 Yocli - Tap and save a color カラーコードから色の名前を確認したい場合は、こちらのサイトを利用するといい。カラーコードには、日の名前がついている色もある。例えば、初対面の女の子にYocliをかざして「君の肌は撫子色だね」などと言えば、色だけではなくハートも盗めるかもしれない。ひんしゅくを買うリスクもあるが。 ➤ Yocli(App St

    現実世界から色を盗む『Yocli for iPhone』 - RyoAnna
  • テキストと背景のカラーがアクセシブルかチェックし、適した組み合わせに調整できる便利ツール -Contrast Ratio

    テキストと背景のカラーの組み合わせで、視覚的にどのくらい読めるか数値化するオンラインツールを紹介します。 いまいち読みにくい時には、ツールで最適な組み合わせに調整することもできます。 Contrast Ratio Contrast Ratioの使い方は、簡単です。 入力欄の左に背景、右にテキストのカラーを入力するだけで、すぐに反映されます。 カラーは、hsla, rgb, 16進数などに対応しています。 当サイトの背景とテキストのカラーを入力してみます。

  • 【スウォッチ】 綺麗だなと思った写真からカラーパレット化してストックしておく

    エイプリル・フールですね。でもこの記事はネタじゃないので普通に読んでいただければと思います(笑)あ、そういえば今日はヒゲを剃りましたよ。ちょっと剃り残しちゃったけど、すぐ戻ります。 さて、Dribbbleとかってそれぞれの作品にカラーパレットが登録されていますよね。 それから検索できたり、便利。 Dribbbleのカラーパレット。.acoファイル(Color Swatches)もダウンロード出来る なんかキレイなカラーパレットって、見てると嬉しくなりませんか? なりませんかそうですか 好きな写真からカラーパレットを作る 普段、綺麗だなーと思った写真から、メインの色を抽出してカラーパレットとして並べておくんです。 並んだカラーパレットには名前なんてつけてあげちゃって。 根暗でしょう? でもけっこうデザインする時に役に立つんです。 色の組み合わせ、感情というかストーリーが出

  • 銀行色相環 - MySignSystems | makebooth

    うまーく、赤の三菱東京UFJ、緑の三井住友、青のみずほに分かれてる(三大メガバンク) →「福島みずほ」は関係ないよ。 なぜか青系統のロゴが多い。 →きっと銀行と聞いて、なんとなくスタイリッシュ☆な青色を連想するからだね(共感覚) じゃあ、紫と黄色はマニーを扱う上で責任感が感じられないような不吉な色なのかしら? そしてはぶられる静岡

    銀行色相環 - MySignSystems | makebooth
  • ヒューレットパッカードのWebサイトが黒から白に変わった理由 | ウェブ配色 | ブログ | フォルトゥナ

    前の記事でレポートしたデザイントレンドの前日打ち合わせと称した飲み会の席で、登壇者の原一浩さんから、「なんでヒューレットパッカードの色が黒から白に変わったんでしょうね」と言われていたのですが、結局当日はセッション時間の都合で話せなかったので、ここで私の見解をまとめておきたいと思います。 まずは2011年と2012年のスクリーンショットを並べてみました。これはまたガラッと変えてきましたね。 そもそも大きく色を変えなければならない時は、企業としての戦略が変わったときがほとんどです。会社の業績が堅調であれば、ブランドイメージを変える必要はないのですから。さらに発展させたいという場合もあるでしょうが、大きく色をを変えることで、今までのブランドイメージを壊してしまうこともあるため、リスクが高いことからよほどのことがない限り、しない方が無難だと思います。 そんなわけで、そもそもヒューレットパッカードが

    ヒューレットパッカードのWebサイトが黒から白に変わった理由 | ウェブ配色 | ブログ | フォルトゥナ
  • はてブの個別ブクマページ(新デザイン)の見やすさをCheck My Coloursで調べた結果がひどい - みやきち日記

    個別ブクマページがすげえ見づらくなった はてなブックマーク、トップページだけじゃなく、個別ブックマークページ(エントリごとのコメント一覧のページ)も一部デザイン改変したんですね。たとえば、ITmediaニュースのこちらの記事の個別ブックマークページは、以下のように表示されます。 すげえ見づらい。何この白さ。 画面のコントラストが低すぎて、見ているうちに目が痛くなってきます。しばらくがんばって読んでみた後、何気なくTVを見たら、目が疲れすぎてBBCやCNNの画面下部の文字が読めなくなってて呆然としました。座ってる場所からTVまでの距離はいつもと同じなのに。701ページもある『木村政彦はなぜ力道山を殺さなかったのか』(増田俊也、新潮社)をKindleで一気読みしたときだって、こんなに目が疲れたりしなかったのに。 Check My Coloursで調べてみた この見づらさが個人の感覚の問題なのか

    はてブの個別ブクマページ(新デザイン)の見やすさをCheck My Coloursで調べた結果がひどい - みやきち日記
  • なじみの色を入れ替える - デイリーポータルZ

    コクチョウという鳥がいる。漢字で書くと黒鳥。ハクチョウのような姿だが、色が黒い鳥だ。 現在では広く知られている鳥だが、昔はじめてこの鳥が発見されたときは非常に驚かれたらしい。古い英語には、無駄な努力を例えた「黒い白鳥を探すようなものだ」という諺があったと聞いたこともある。 なじみの色が違っていることの違和感。身近なもので味わってみるため、実験してみた。

  • Photoshop・これからのグレースケール画像のつくりかた

    グレースケール変換の方法は多々ありますが、どうも「モード」→「グレー」がDisられる傾向があるようなのでそれは違うよ!というところから少し。 モード→グレーは結構優秀 (実際にはモードから変換するのではなくて、「編集」→「プロファイル変換」を勧めます。これだけは設定しておきたいPhotoshopショートカットキーの小ネタ) これを変換してみましょう。 (以下マウスオーバーでこの画像に変わります) モード変換グレー 他と比べると濃いのですが、色の濃度変換は最も感覚的に近いかと。PCの方はカーソル乗せたり外したりしてみてください。 参考:osakana.factory – グレースケールのひみつの3番目 どちらにしても、オフセット印刷向けに変換するのであればこの後の調整は「必須」です。これはどの方法でも同じです。 LabモードLチャンネル Lab変換後Lチャンネルのみ表示させ、そのままモード変

    Photoshop・これからのグレースケール画像のつくりかた
  • 保存版!カラーの勉強に役立つインフォグラフィックのまとめ

    ウェブや印刷のカラーセオリー、ウェブやロゴで人気のカラー、カラーがもつ意味や心理的にどのような影響を与えるか、女子・男子っぽい配色など、カラーの勉強に役立つインフォグラフィックを紹介します。 各リンク先に、保存用の大きいインフォグラフィックがあります。

  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • 色を集めるアプリ「irodori for iOS」、登録ユーザー数10,000人、累計投稿数40,000枚を突破! | ゴリミー

    オハヨウゴザイマス!!g.O.R.i(@planetofgori)です! Facebookのフィードを眺めていたら「irodori for iOS」が知らないうちに登録ユーザー数が10,000人を突破したと発表していたので、紹介する!素晴らしい! irodori for iOS 1.1.3(無料)​ カテゴリ: 写真/ビデオ, ソーシャルネットワーキング 販売元: Nakai Hiroto – Nakai Hiroto(サイズ: 3 MB) リリースから約2ヶ月でユーザー数は1万人! 「irodori for iOS」は仕事後の時間を利用して作られた個人のアプリ。公開5日間でユーザー数1,000人を突破していたが、気づいたらここまで成長していてとても嬉しい! 同時に投稿された写真も40,000枚を超えたと発表している!多くの人がこのアプリに興味を持ってもらい、写真を投稿してくれているようだ

    色を集めるアプリ「irodori for iOS」、登録ユーザー数10,000人、累計投稿数40,000枚を突破! | ゴリミー
  • Panic、iTunes 11のカラーアルゴリズムの仕組みを解説(Web実装方法などの話題で盛り上がり) | iTunes | Mac OTAKARA

    サイトは、アフィリエイト広告および広告による収益を得て運営しています。購入により売上の一部がサイトに還元されることがあります。 Panicが、iTunes 11のアルバムアートワークの色に合わせてアルバム情報のバックグラウンドカラーが変わる仕組みを解説した「iTunes 11 and Colors」を公開しています。 これは、アルバムアートワークの左端側の色から一番多く使用されている色を抽出し、それを背景色に設定することでアルバムアートワークと馴染ませているそうです。 また、iTunes 11は、アルバムアートワークの枠線も分析していて、例えば、枠線の外側が白、内側が青といった場合、枠線部分の外側を消し、内側のみのアートワークのみを表示して、それに背景色を馴染ませるといった高度な技術を使用しているそうです。 背景色が決定されると、アルバムアートワークの中から、その背景色と対象となる色

    Panic、iTunes 11のカラーアルゴリズムの仕組みを解説(Web実装方法などの話題で盛り上がり) | iTunes | Mac OTAKARA
  • javascript - でRGBを全て詰め込んでみる : 404 Blog Not Found

    2012年09月14日11:45 カテゴリArtLightweight Languages javascript - でRGBを全て詰め込んでみる スマフォでも持ち歩けるようにしてみた。 存在するRGBカラーを全て詰め込んだ : ギズモード・ジャパン 8×8×8インチ(約20×20×20センチ)のこのは、印刷するのが困難なRGB色全てを網羅したDemo canvasをサポートしてるブラウザーで動きます。IE9もOK(ただしスライダーが出ない) クリックしてアニメ スライダーで「ページめくり」 スライダーはinput[type=range]で実装しているので、未実装のブラウザーだときちんと出ません(主にFirefoxとIE)。手抜き失礼 RGB YCbCr iPhone 5の新"Retina Long"ディスプレイではsRGB全て発色できるとのことなので、これでご確認を。 Dan th

    javascript - でRGBを全て詰め込んでみる : 404 Blog Not Found
  • 色覚障がいの方が作ったサイト【We are Colorblind】が勉強になる

    2013年3月23日 Webサイト制作, アクセシビリティ, 色彩 「We are Colorblind」というサイトをご存知でしょうか?サイト名を訳すと、「我々は色覚障がい者です」。そう、色を識別することが困難なデザイナーさんの作ったサイトです。数々の例とともに、Webサイト制作における改善すべき点を指摘してくれています。とっても勉強になったので、簡単に紹介します! ↑私が10年以上利用している会計ソフト! Webクリエイターボックスでは以前「色覚障がい者に配慮したWebサイトの作り方」という記事で色覚障がいとは何か、どのように見えるのか、また、Webサイト制作において注意すべき点をまとめました。読んでいない方は、まずはこちらに目をとおしてみてくださいね ;) Webサイト「We are Colorblind」の中の人はオランダ在住のデザイナー、Tom van Beveren氏。サイト名

    色覚障がいの方が作ったサイト【We are Colorblind】が勉強になる
  • 様々な有名Web系企業が採用した「ブランドカラー」をコレクションしている・BrandColors

    AmazonYahooVimeo、Google などなど、様々なWeb系の企業 が採用したブランドカラーを コレクションしているWebサイト ・BrandColorsのご紹介。気分 転換に如何でしょう。 よく目にする有名Web系(だけじゃないですけど)企業が採用したブランドカラーをコレクションしているサイトです。インスピレーション向上に如何でしょうか。 有名企業のブランドカラーのコレクションサイト。ブランドカラーと企業名が羅列されており、カラーコードはコピーできるようになっています。 SkypeとかGithubとかDropboxとか、どこかで見た名前がかなり揃っています。 シンプルなサイトですけどありそうで無かったサイトかもしれませんね。7~80くらい揃ってます。日の企業もそろそろ入るようになって欲しいですね。 BrandColors

    様々な有名Web系企業が採用した「ブランドカラー」をコレクションしている・BrandColors
  • Tokyo Fuku-blog: 4原色の視覚をもつ女性見つかる

    通常の人間より9千9百万色も多い色が見える女性が発見された。彼女は研究者が20年にわたって探していた、幅広い種類の色相を識別できる、英国で最初の四色型色覚の持ち主だ。 ニューカッスル大学の神経科学者、ガブリエル・ジョーダンさんによれば、この状態は女性のみに起きるといい、自分で気づかずにいる他の四色型色覚の持ち主もいるかもしれないという。「不幸なことに、彼女が自分の色覚を我々のそれと比較して描写することができません。我々が赤緑色弱の人に自分の感覚を説明できないのと同じことです。」とジョーダンさんはいう。 我々の視覚は錐体という視細胞によって知覚される。通常は3種類の錐体で(3原色にもとづく視覚を)知覚するが、彼女の場合は錐体が4種類あ(り、4原色の世界を見てい)る。「四色型色覚の持ち主は能力をフルに使う必要はないでしょう。より能力の低い(3原色の)人々向けにつくられた世界に閉じ込められている

    bleu-bleut
    bleu-bleut 2012/06/25
    見える色を変えることで海底面を映した写真があった気がするがなんだっけ?
  • 色だけでダメなデザインを良いデザインに変える方法Vol.1

    私は新人だったころ『デザインは形の美しさだ!』と、やけに形ばかりを気にしてデザインをしていたことがありました。私は何を始めるにしても【まず形から入るタイプ】なんですが、それもあって形ばかりを意識していたのかもしれません。 『なんかこのデザインダサいんだよな』なんて思うとき、形やレイアウトの修正ばかりに力をいれ、色のことはほとんど考えていませんでした。色がどれだけデザインに影響を与えているのか知らなかったんです。 そんな私だったんですが、色彩に関するセミナーに参加したり、先輩の話を聞いたり、書籍を読んで勉強していくうちに、色がどれだけデザインに影響を与えているのかを知りました。そして今では、デザインの修正を行うとき、【色の修正だけで、問題を解決させることができる場合が多くある】ということを知りました。 『なんかこのデザインダサいんだよな』なんて思うとき、レイアウトや形を変える事ももちろん大切

    色だけでダメなデザインを良いデザインに変える方法Vol.1
  • 実際は同じ色なのに、どう見ても違う色に見える不思議な画像が話題に : はちま起稿

    嘘みたいだろ? この青と緑、同じ色なんだぜ…… http://nlab.itmedia.co.jp/nl/articles/1206/09/news003.html 中央に向かって水色と黄緑、2色の渦巻きが伸びているように見えますよね? 実はこの2色、全く同じ色なんだそうです。「そんな馬鹿な」と思う人は画像を拡大したり、画像編集ソフトで色を抽出してみてください。確かに両方とも淡い緑色をしているのがわかります。 これはムンカー錯視と呼ばれる脳の錯覚現象を利用したもの。かなり古い画像ですが、最近Twitterに「#信じられないかもしれませんが青と緑に見えてるところは同じ色です」というハッシュタグで投稿され再び話題になっています。いやあ、人間の脳ってほんとに不思議ですね。