タグ

配色に関するcharunのブックマーク (11)

  • Web制作の常識が変わる、便利な最新オンラインツール48個まとめ

    この記事では、Webデザインやグラフィックデザインの制作スピードを短縮し、生産性をアップする、便利な最新オンラインツールをまとめてご紹介します。 「もっと早く知りたかった」と思わせる、面倒な作業をサクサクこなす時短ツールが勢揃いです。カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. Web制作便利ツール 2. デザインコレクション 3. イラスト系ライブラリ 4. 配色ツール 5. プロトタイプツール 6. コラボ、リモートワークツール 7. 面白、クリエイティブツール Web制作の常識が変わる、便利な最新オンラインツールまとめ Web制作便利ツール The Hero Generator ウェブサイトの魅力的なヒーローイメージを作成できるオンラインツール。グラデーションオーバーレイやボタンスタイル、見出しタイトルの余白など細かい部分も手

    Web制作の常識が変わる、便利な最新オンラインツール48個まとめ
  • 誰も教えてくれない「分かりやすく美しい図の作り方」超具体的な20のテクニック

    【追記】この記事をきっかけに、名著「ノンデザイナーズ・デザインブック」の20周年記念特典eBookの制作に協力させていただきました。詳しくはこちらを御覧ください。 ノンデザイナーズ・デザインブック20周年記念の特典に寄稿しました デザイナーである・なしに関わらず、仕事の中で伝えたいことを「図」で説明する機会は多々あります。提案書で事業内容を説明することもあるでしょうし、具体的な数値をグラフで説明することもあるでしょう。そんな中でこんな指摘を受けたことはありませんか? ・最終的に何を言いたいのか結論が見えないよ。 ・関係性が複雑すぎて理解しずらいんだけど。 ・要素が多すぎて全てを把握するのが大変。 ・何をどこから見れば良いの? ・結局一番言いたいことはなんなの? ・文字サイズがたくさんありすぎてまとまりがないね。 ・安っぽいチラシみたいでダサイなぁ。 ・全体的にバランスが偏ってて不安定。 ・

    誰も教えてくれない「分かりやすく美しい図の作り方」超具体的な20のテクニック
  • 誰でも絶妙な色調が作れるカラーパレッドツール5選HOUR BLOG | HOUR BLOG

    デザインのカラーを決める際、デザインカラーに悩んだ経験は一度はないでしょうか。今回、悩まず配色を決めれて大きくメソッドから外れない。自動配色サービスを紹介しています。 こちらでは、フラットデザインやマテリアルデザインに最適な配色パターンを掲載しているサービスを集めました。ひとつでも使用するとデザインの作業効率が短縮できるのではないでしょうか。 目次 1Coolors Coolors.co – The super fast color schemes generator 2.NIPPON COLORS 3.COLOURlovers 4.Material Design Color Palette Generator – Material Palette 5.Adobe Color CC 1.Coolors Coolors.co – The super fast color schemes ge

    誰でも絶妙な色調が作れるカラーパレッドツール5選HOUR BLOG | HOUR BLOG
  • PhotoshopやCSSを使い、背景だけを薄くしてデュオトーン加工する方法

    作成:2016/12/19 更新:2017/06/06 Photoshop > Webデザイン デュオトーンを採用したアーティスティックなWebサイトも増えてきたことですし、今回は「写真全体をデュオトーンに加工するのではなく、人物と背景の透過度を変えてデュオトーン加工を施しおしゃれに見せる」方法を書きます。 エンジニア速報は Twitter の@commteで配信しています。 デュオトーンとは デュオトーン(Duo Tone)は中間的な明るさを持つ色(グレースケール)と明るい色を重ね2色で表現します。使い方によっては、レトロでアーティスティックな外観を演出することができるし、白文字との相性もいいです。印刷用語では「ダブルトーン(double tone)」と呼ばれています。 デュオトーンを採用してあるサイトを色々見ていると、 1.写真全体をそのまま加工してあるタイプ Home | Plant

    PhotoshopやCSSを使い、背景だけを薄くしてデュオトーン加工する方法
  • デザイナー必見!! 女性向けWEBサイトデザインのポイント(1)配色編 | 津田祐典 | 街角のクリエイティブ

    こんにちは、ツダといいます。279-design(ツナグデザイン)という屋号で、フリーのWEBデザイナーとして活動しております。このたび、街角クリエイティブで主にWEB制作にまつわるちょっとしたコラムというかハウツーというか、記事を書かせていただくことになりました。普段は自分のブログでこういう記事を書いています。 DTP→WEBデザイナー転向時に、これやったら捗ったよリスト13 あの頃みんな若かった。国内有名16サイトの2008年→2014年のデザイン比較 一つ一つはそこそこバズったものの、10エントリーくらいしか書いてない泡沫ブロガーに記事を書かせていただけるなんて、街クリさんは勇気あるな(ありすぎるんじゃないかな)と正直思うわけですが、引き受けたからには頑張っていい記事を書いていきたいと思います。よろしくお願いいたします。 女性向けWEBデザインの配色について考えてみる 先日SNSでこ

    デザイナー必見!! 女性向けWEBサイトデザインのポイント(1)配色編 | 津田祐典 | 街角のクリエイティブ
  • 新着記事

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

    新着記事
  • Pinterest

    Discover recipes, home ideas, style inspiration and other ideas to try.

    Pinterest
  • Adobe Kuler を使い倒す!カラーテーマ作成から配色のテストまでの作業工程

    色んな配色パターンをつくれるのと、他の人がつくったパターンを見られるのがいいですね。 似たようなものにColor Schemerがありますが、こちらは有料ソフト。でもさすがにツールは使いやすく色盲のチェックやらサンプルサイトを表示できたりと優れています。ウェブ版はフリーですがそちらは用途が少し違うんですよね。 と、いうわけでコストの面もあってKulerに落ち着いています。 第1部 Kuler とは? Kuler とは? ツールを起動しよう ツールにアクセスする カラーテーマ作成画面へ移動する カラーを変えてみる Kuler とは? Kuler とは? KulerはAdobe製のオンラインカラースキーマで、カラーテーマをつくったり他の人が作ったカラーテーマを見ることができます。 デスクトップやFlickrの画像から色を抽出できたり、スウォッチにインポートできるファイル(.ase:Adobe

    Adobe Kuler を使い倒す!カラーテーマ作成から配色のテストまでの作業工程
  • 坂本邦夫の「基礎からわかるホームページの配色」

    ウェブサイトの配色を専門とするカラーコーディネーターが、読みやすく使いやすいホームページの配色についての記事を公開しているサイト。色彩の基礎知識から、配色の作り方、競合サイトとの色の比較方法や色のアクセシビリティまで、一通りの配色知識を学ぶことが出来ます。また最新の情報や成果などもここで発表しますウェブサイトのカラーコーディネートを専門とするカラーコーディネーター坂邦夫が、読みやすく使いやすいホームページの配色についての記事を公開しているサイトです。 色彩の基礎知識から、配色の作り方、競合サイトとの色の比較方法や色のアクセシビリティまで、一通りの配色知識を学ぶことが出来ます。また、最新の情報や成果などもここで発表していきます。 ビジネスブログの色に関する考察 先日、Twitter上でブログの色についてつぶやいてみました。内容はこんな感じです。 ブログの色について。検索などからブログにたど

  • Web制作に携わる人は見ておくべき、2011年のはてブ1500数以上の良記事31選 | URAMAYU

    2011年のWeb制作トレンドをはてブのホットエントリから振り返ってみました。 2011年でトレンドは、スマートフォン向けサイトやアプリの制作関連、HTML5関連、あとはFacebook対応のためのノウハウといった感じでした。 はてなブックマーク「コンピュータ・IT」カテゴリ内で、1500以上ブクマがついた記事を選出、その中からさらに私の主観も入りつつ、2011年Web制作系のエントリーの中でもベストな31記事をピックアップ、Webデザイン系、SEO系、HTML+CSS系、プログラミング系、スマートフォンサイト制作系、企画、ツール、その他系、素材系にそれぞれ分類しました。 Webデザイン系 1. 色彩センスのいらない配色講座  配色と色についてひじょーに分かりやすく、論理的に解説されたスライド。はてブ数ダントツ。 2. デザインの基礎力をワンランクアップしたい私(Webデザイナー

  • ウェブ配色ツール Ver2.0

    的な使い方 左上のカラーピッカーを使って、任意の1色を作れば、それに合わせた配色が作れるツールです。またロゴの文字や色は任意の物を指定できるようになっています(ただしフォントは変更出来ません)。 カラーピッカーの下のスライダーを利用すれば、メイングラフィックの変更や色相幅も変えることが出来ます。動きが必要な配色の場合には、2つめのスライダーを右に動かしてください。補色配色に近い配色が出来上がります。 色の一覧を押すことで、出来上がった色の一覧を表示しますので、コピー&ペーストしてお使いください。 この配色ツールについて この配色ツールはフォルトゥナによって提供されています。リンク等は当然のことながら自由にしていただいて構いませんが、無断で複製・転載するのはおやめください。 取材・執筆等のお申し込み このツールに関してのご質問、あるいはその他の色に関する取材・業務や講演などは、フォルトゥ

    ウェブ配色ツール Ver2.0
  • 1