タグ

入門とwebデザインに関するmasayoshinymのブックマーク (6)

  • Webにも紙にも使える、囲み枠デザインの基本テクニック

    2016年1月20日 Webデザイン テキストを四角で囲ったシンプルな枠。もちろんWebだけでなく、印刷物でも多く使われていますよね。今回は、デザインをする上では欠かせないと言っても過言ではないこの囲み枠にフォーカスしてみようと思います。新米デザイナーさんや、デザイナーじゃないけど資料作成をする機会の多い営業さんの参考になれば幸いです! ↑私が10年以上利用している会計ソフト! 呼び方は「囲み枠」で正しいのか…謎ですが、テキストを囲んでいるボックスのことです。海外では「パネル」「テキストボックス」等と呼ばれています。 こんな時に使うと◎ 強調する時 「今なら20%オフ!」「期間限定!」等、注目して欲しい要素に利用されます。Webサイト上ではアラートメッセージでよくみかけますね。図はBootstrapのアラート要素。 要素の差別化 補足や注意書きなど、メインのコンテンツと区別して表示したい時

    Webにも紙にも使える、囲み枠デザインの基本テクニック
  • ページを作ったあとの改善フローのセオリー | Webデザインセオリー Advent Calendar 2015

    ページを作ったあとの改善フローのセオリー | Webデザインセオリー Advent Calendar 2015 2015/12/24 | カテゴリー: Creative | タグ: EC, まとめ, 考え方 タイトルとURLをコピーする Tweet yatさんに直接声をかけていただいたので Webデザインセオリー Advent Calendar 2015 というお題に対して記事をかいてみました。 Webデザインセオリー Advent Calendar 2015 とは デザイン、レイアウト、フォント、カラー、イラストなど、デザインに関するブログを書きましょう。 Webデザインを作る上で使う、ツールの使い方なんかでもOK! 小ネタやTipsから、ガッツリとした記事、どんな形式でも構わないので、やってみませんか? といった企画のアドベントカレンダーです。 最初に Webデザインセオリーと聞いてす

    ページを作ったあとの改善フローのセオリー | Webデザインセオリー Advent Calendar 2015
  • Webサイトのデザインの完成度をアップする、小さなディテールだけど効果が確実にある改善方法

    Webサイトのデザインで大切なのは、小さなディテールの積み重ねです。一つひとつは些細なことかもしれませんが、それらをおろそかにしてしまうとWebサイト全体が台無しになってしまいます。 アマチュアのデザイナーが普通によくやってしまう間違いとその改善方法を紹介します。 Top 10 Mistakes that Make your Website Look Unprofessional 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 1. デザインされたテンプレートを使う時の注意点 2. Bootstrapのデフォルトのデザインを使ってませんか? 3. コンテンツを分かりやすくするフォントの使い方 4. 暗いカラーの背景はデザインが難しい 5. 似たようなボタンを数多く配置するのは逆効果 6. 空白スペースを効果的に使うシンプルなルール 7

    Webサイトのデザインの完成度をアップする、小さなディテールだけど効果が確実にある改善方法
  • プロ御用達!WEBデザインに役立つデザインツール13選

    更新日: 2017年9月26日公開日: 2015年6月10日プロ御用達!WEBデザインに役立つデザインツール13選 忙しい web デザイナーの方、web デザイン勉強中の方、CSS やプログラミングからチョット目を離してデザインツールを見直してみませんか? 今までやっていた作業、可視化に時間のかかっていた作業を劇的に変えてくれるツールがたくさん存在します。チョット作業の手を止めて、以下のツールを覗いてみてください。きっとこれからのあなたの web デザインを快適にしてくれますよ! WEBデザインに役立つデザインツール 13選プロ顔負けのデザインツール「webflow」 webflow 対応 / MacWindows 価格 / 無料 ~ $84 /月 表示言語 / English Free トライアル / 有 デザインには自信があるけれど、実はプログラミングはチョット苦手、という方にお勧

    プロ御用達!WEBデザインに役立つデザインツール13選
  • デザインの原理原則がわかる8つの記事 | creive

    デザインをする際に、IllustratorやPhotoshop、Sketchが使えるといった、小手先の技術はもちろん大切ですが、そもそも「良いデザインとは何か」という概念的なことを知っておくのは大切です。 そこで、今回は、ノンデザイナーでも押さえておくべき、デザインの原理原則がわかる8つの記事を簡単な説明とともにご紹介します。 企画書の作成、簡単なモックアップをつくる際にも役立つものばかりです。 配色技法 デザインをしていて「良い配色」が思い浮かばない… なんて時に読むと考えがまとまる記事です。 「良い配色」という、なんとなく持っている概念を、論理的に説明したい時には重宝します。ドミナントカラー、トーンイントーン、カマイユなど7つの配色技法を、具体的な例を用いて説明しつつ、配色によってもたらされる効果を知ることができます。 → 配色に悩んだときに、きっと役立つ7つの配色技法【基】 配色パ

    デザインの原理原則がわかる8つの記事 | creive
  • エンジニアこそ色彩デザインを学ぼう - ppworks.jp

    学ぼうよ、と思っていて、 新人デザイナーのための色彩デザイン・配色のルールを学べる 作者: 柘植ヒロポン出版社/メーカー: ソシム発売日: 2011/10/01メディア: 単行 クリック: 1回この商品を含むブログを見る を読んでいました。 @ken_c_lo氏が以下のスライドで触れていますが、エンジニアがデザイン学ぶのマジオススメとのことです。よっしゃ、学ぼう。 新人デザイナーのための色彩デザイン・配色のルールを学べる 新人デザイナーのための色彩デザイン・配色のルールを学べる 作者: 柘植ヒロポン出版社/メーカー: ソシム発売日: 2011/10/01メディア: 単行 クリック: 1回この商品を含むブログを見る WEBというより印刷のデザイナー向けのなのかな?という印象なのですが色の使い方という意味では勉強になりました。 特色の話やCMYKプロセスカラーの話は一旦無視しながら

    エンジニアこそ色彩デザインを学ぼう - ppworks.jp
  • 1