タグ

デザインに関するgorodokuのブックマーク (7)

  • カテゴリー別配色アイデア100

    2017年6月30日 色彩 配色によってそのデザインの印象は大きく変わると思います。色は大切な要素のひとつですね!ということで、色の持つ印象別に配色アイデアをずらりと並べてみます。配色はおなじみ(?)のCOLOURloversから、「これは!」と思うものを選ばせて頂きました。素敵な配色がいっぱいのこのサイト、ぜひ覗いてみてください!また、今回紹介するのはあくまで一例ですので、自分なりにアレンジしてみるのも楽しいと思います。サイトの雰囲気にあう配色を探してみてください。 ↑私が10年以上利用している会計ソフト! 配色に関するおすすめサイト COLOURlovers 色をテーマにしたコミュニティサイト、COLOURlovers。自分の考えた配色を登録したり、お気に入りの配色を保存しておくことができます。今回はこちらから配色アイデアを選びました。iPhoneアプリは「ColorSchemer」と

    カテゴリー別配色アイデア100
    gorodoku
    gorodoku 2014/09/06
    マナさんの。ちょっと古い記事。ツールの紹介より下の方の組み合わせパターンを参考に
  • 無料で配色シミュレーションができるカラーパレット系サービス6選【2022年最新】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

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

    無料で配色シミュレーションができるカラーパレット系サービス6選【2022年最新】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • 「Webサイトの配色で困った!」→「HUE/360使えば良いじゃない」

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

    「Webサイトの配色で困った!」→「HUE/360使えば良いじゃない」
    gorodoku
    gorodoku 2013/03/13
    私はデザインとか真面目に勉強したことないのでこういうツールはありがたいのです。
  • CSSで文書の段組表現を行うcolumnプロパティの使い方

    CSSレイアウトやってると段組もボックス並べてやっつけちゃいたくなりますが、一連の文書を段組にそって記述するために途中でぶった切ってボックスまたいで書くのは面倒くさいし記述の方法としてももなんか変です。 というわけでビジュアルじゃなくて文書読ませるのに段組をするプロパティのご紹介。 段組にすると視線の横移動が少なくて済むお題のHTMLはこちら。 <div> <p>上海のある家の2階で、占い師をやっているインド人の老婆が、アメリカ人の商人と話し合っていた。商人は戦争で大儲けをする為に、日米戦争がいつ頃起こるのかを占って欲しいと頼む。始めは渋っていた老婆だが、前金として小切手をもらうと愛想が良くなり、自分にはアグニの神がついているから占いは絶対に外れないと言って引き受ける。商人が帰ると老婆は家にいる一人の少女を呼びつけ、今夜アグニの神にお伺いをたてるなどと話す。</p> <p>丁度その時、下の

    CSSで文書の段組表現を行うcolumnプロパティの使い方
    gorodoku
    gorodoku 2013/02/22
    テキスト量の多い場合に段組をどうするか、という話。
  • CSSでディスクを回転浮上させるエフェクトのサンプル

    CSS演出小ネタ連投です。 【borde-radius】で作った丸型の要素に対し、マウスオーバーでコンテンツを回転させながら浮かび上がらせる方法です。 transformで拡大と回転言葉で説明するのはとっても難しい(けどやってることは全然難しくない)のでさっそくサンプルをご覧下さい。 HTML <p> <span>Shop</span> <a href="#">More info</a> </p> 【p】のなかに【span】と【a】が並んで内包されています。通常時は【span】のみ表示させておいてhoverで【a】を浮き上がらせてこよう、という構想。 p,span,a{ display:block; position:absolute; width:100px; height:100px; border-radius:50%; font-size:16px; text-align:cent

    CSSでディスクを回転浮上させるエフェクトのサンプル
    gorodoku
    gorodoku 2013/02/15
    平面的に回転しながら拡大で浮き上がってくるように見えるボタン的なもののエフェクト
  • 人間の視野とディスプレイの関係 | 56docブログ

    人間の視野とディスプレイの関係 【Design】 wrote on 2012/12/19 http://blog.56doc.net/Entry/484/人間の視野とディスプレイの関係 一年ちょっと前に 人間の視野角と矩形・解像度について考えてみた こんなことを書きまして面白いテーマだと思いつつ放置してました。 最近改めて調べるともうちょっと人間の視野についてわかったのでその辺のまとめなどを。 スポンサードリンク 有効視野の中でも特に視力の優れる範囲は限られている 過去記事では主に「有効視野」と言うものについて調べ、矩形アスペクト比や解像度との関係について考えてみました。この中で「安定注視野」などという言葉も出てきて当時はその定義も良くわからないままだったのですがGoogleブックス検索で 眼・色・光 - 書編集委員会 - Google ブックス こんな書籍を発見。で、このなかの9

    gorodoku
    gorodoku 2012/12/19
    本題とまったく関係ないけど今回のアイキャッチは自分でも凄く気に入っている。
  • 年賀ソフト要らず?日本郵政の「はがきデザインキット」がフリーでなかなか使える件

    一応公式のマニュアルもあるんでコチラも参考に。 はがきデザインキットマニュアル|郵便年賀.jp 日郵政の郵便年賀.jpってサイトで、ここからダウンロードしたファイルを解答してインストールすればOK…なんですがchromeだけは「別のインストール方法」てのでadobeAIRとインストールファイル別々にダウンロードしなきゃダメみたいですね。ま、大した手間でもないんですけど。 指示通りインストール作業を終えたらさっそく起動してみます。 初回起動で若干の設定があります。「お使いのデザインキットを登録する」を押して次に進みます。 一部データをダウンロードし始めますので若干の待ち時間。そののち完了すると「デザインキットを起動」というボタンが表示されるのでクリックして上げましょう。 デザインの操作 デザインのスタートでは「郵便はがき」「年賀はがき」「かもめーる」の中から使用するはがきの種類を聞かれるの

    年賀ソフト要らず?日本郵政の「はがきデザインキット」がフリーでなかなか使える件
    gorodoku
    gorodoku 2012/11/21
    結構前からあるらしいですけど知りませんでした。フリーの割にはなかなか使えそう。
  • 1