タグ

webデザインと配色に関するyuki_2021のブックマーク (11)

  • 実例で学ぶウェブデザイン!参考にしたい最新スタイル見本厳選50個まとめ

    これからウェブサイト制作を行うひとが確認したい、創造力を高める最新ウェブデザインをまとめてご紹介します。さまざまな優れた実例サンプルを見ることで、デザイン案件のアイデアにも活用できます。 レイアウトや配色、フォント選びなどに加えて、最近ではアニメーションを有効活用したウェブデザインをさまざまな業種で見かけるようになっています。これからサイトを作成しようというひとや、打ち合わせでのきっかけ作りなどに活用してみてはいかがでしょう。 Webデザインのアイデア満載!創造力をアップさせる最新サイト50選 2018年に流行しそうな、注目Webデザイントレンド20個を大予想 人を惹きつける美しいデザイン!参考にしたいウェブサイト厳選まとめ Keus 水平方向へページが遷移していくウェブサイトで、オンラインショップもブログもどれも同じレイアウト。 The Test Center by Volvo オンライ

    実例で学ぶウェブデザイン!参考にしたい最新スタイル見本厳選50個まとめ
    yuki_2021
    yuki_2021 2018/07/24
    今は時間無い。あとでじっくり読もう。
  • 絵描きさんやデザイナーさんなどが配色パターンの参考として超重宝している本があるらしい

    &IDEA編集部(SBクリエイティブ) @and_IDEA 《新しい知識が、明日を拓く。》SBクリエイティブ株式会社&IDEA(アンドアイデア)編集部です。ITやデザインにまつわる技術書を出版しています。 ※書籍に関するご質問などは下記サイトのメールフォームよりお寄せくださいますよう、よろしくお願いいたします。 https://t.co/fQnLz30xff

    絵描きさんやデザイナーさんなどが配色パターンの参考として超重宝している本があるらしい
    yuki_2021
    yuki_2021 2018/03/28
    ふーん、後でポチる。
  • デザインの基本日記  「配色編」|Design Beginner

    配色がうまくいかない場合の多くはたくさんの色をついつい使ってしまった結果招いていることが多い。まずは2色で配色をしてその上で少しずつ色の調整をすることによって、まとまりのあるデザインが作りやすくなる。 一般的に言われている配色は、ベースカラー7割、メインカラー2割、アクセントカラー1割。一番表現したいことをアクセントカラーにすることで表現したいことが何かはっきりわかりやすくなる。 なんとなく落ち着いていて物足りない場合、色相環で反対の色をアクセントカラーに持ってくるとインパクトがでる。この色相環の反対の色を反対色や補色といったりもする。 逆にガチャガチャして色がうるさい場合は、色相環の隣り合った色数色を選び配色することで全体的にまとまった印象になる。この色相環の近くにいる色のことを近似色と呼ぶ。 配色を決める場合、いくつかの軸があるが、何を表現しなければいけないかというテーマによって配色を

    デザインの基本日記  「配色編」|Design Beginner
  • コピペで使えるオシャレな配色パターン見本 25 (全組み合わせWebカラーコード付) - LITERALLY

    今回はひたすら配色パターンを紹介していく。探しやすいように色ごとに分け、使いやすいように解説とWebコードも合わせて紹介する。プレゼン資料、Webデザインなどで目的に合った配色をそのままコピペして使って頂ければと思う。 ▼ 目次 カラフルな配色パターン 橙系の配色パターン 青系の配色パターン 緑系の配色パターン 黄色系の配色パターン 赤系の配色パターン 高級感を表現する配色 わび・さびを表現する和風配色 シンプルに格好良いグレーの配色 カラフルな配色パターン 1. 淡い「カラフル」 ■ #FF7D7D ■ #FFD580 ■ #B3E2B4 ■ #ABE7FF ■ #B8B2EA ■ #DBDBDB 淡いカラフルな配色は、白の背景に合わせると「透明感」を出すのに効果的。カラフル系の配色は扱いづらいので、上のコードをそのままコピペして使って頂くのが良いかと思う。 2. 力強い「カラフル」 ■

    コピペで使えるオシャレな配色パターン見本 25 (全組み合わせWebカラーコード付) - LITERALLY
  • 色彩理論の基礎に学ぶ、相性抜群な「色の組み合わせ」 | ライフハッカー・ジャパン

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

    色彩理論の基礎に学ぶ、相性抜群な「色の組み合わせ」 | ライフハッカー・ジャパン
  • ノンデザイナーのための配色理論

    「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、当のインサイトを見つけるUXデザインUXリサーチYoshiki Hayama

    ノンデザイナーのための配色理論
  • 0から学ぶアプリの配色 - Rejasupoem

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

  • 無料で配色シミュレーションができるカラーパレット系サービス6選【2022年最新】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、デザイナーのモモコです。 今回はデザインの重要な要素の一つである、色選びの時に使える配色シミュレーションができるツールやサイトをご紹介します。Webカラーのカラーパレット系サービスを中心にチョイスしましたので、配色などでお悩みの方はぜひご参考にしてみてください! 独学でつまずいていませんか? 配色やデザインの基礎を効率的に学びたい、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGでもWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。「今すぐスクールの概要を知りたい!」という方は、ぜひこちらより資料をご請求ください。 coolors https://coolors.co/ 直感的な操作で色の組み合わせのシミュレーションができるサイト。スペースキーを押すことで自動で配色を行なってくれます。何度でも押せる

    無料で配色シミュレーションができるカラーパレット系サービス6選【2022年最新】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • 人間の目に優しい色合いを設計するためのカラースペース -HUSL

    iOS 7にも採用されているような落ち着いたパステルカラー、同じ明るさで異なる色合いを組み合わせたカラースキームなど、人間の目に優しくより見やすくなるように色合いを設計するためのカラースペース「HUSL」を紹介します。 HUSL -Human friendly HSL HUSL -GitHub HUSLは「Human friendly HSL」の略で、RGBのカラースペースに幾何学的な変換して設計されています。カラーの定義はHSLのように色相(hue)と輝度(lightness)を使い、彩度に「saturation」ではなく「chroma 」を使用します。 彩度のsaturationとchromaの違いは、こんな式になるようです。 Saturation(彩度:S)= Chroma(C) / 明度(V) 参考:イメージクリエーションの構築と基礎知識の習得 どんな感じかは、デモですぐに試すこと

  • ノンデザイナーこそ押さえておきたい!グッとくるWebサイト配色パターン集 | Find Job ! Startup

    FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ

    ノンデザイナーこそ押さえておきたい!グッとくるWebサイト配色パターン集 | Find Job ! Startup
  • 新着記事

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

    新着記事
  • 1