デザインは奥が深い！日本語・英語フォントのデザイン知識・実践テクニックを学べる良書 -ほんとに、フォント。 | コリス

2019/02/19 46 users コリス 良書 見出し フォント テクニック

Webデザインでも紙のデザインでも、フォントや文字周りのデザインは奥が深いです。指摘されるまで気がつかないようなフォントや文字についてのデザイン知識、実践的なテクニックを学べるデザインの良書を紹介します。 日本語のロゴ、タイトル、見出し、コピーをはじめ、情報量の多いコンテンツやデータ、重要なテキスト... 続きを読む

[CSS]見出し、本文、リストなど、文字周りをrem指定で簡単に設計できる便利なオンラインツール | コリス

2018/08/03 94 users コリス SCSS 小見出し 行間 マージン

Webデザインで使用する見出し、小見出し、本文、リストなどフォントの基本サイズ、行間、それぞれのマージンなど、文字周りのデザインを実際のブラウザで確認しながら設計できる便利なオンラインツールを紹介します。 ルート要素を最初に定義して、それを元に見出しや本文を設計するので、rem指定も可能。また、SCSSもサ... 続きを読む

Webでも紙でも販促物でも商用利用無料！250種類以上の飾り罫、区切り線が揃った無料素材 | コリス

2017/04/27 34 users コリス Tex 販促物 アクセント web

250種類以上の飾り罫、区切り線が揃った無料素材を紹介します。 文字周りを飾ったり、アクセントとして利用したり、背景に添えたり、そのままでもパーツを組み合わせても楽しめる素材です。 Text Dividers and Enhancers: Lisa Glanz Text Dividers and Enhancersの中身 Text Dividers and Enhancersのダウンロード Tex... 続きを読む

Photoshopで文字をよりシャープにクリアに見せるこつ -1px未満のこだわり | コリス

2013/07/29 411 users コリス Dribbble ビジター コツ Photoshop

dribbbleに投稿されたデザインで、コメントのやり取りがちょっと興味深いものなので紹介します。 簡単に意訳すると、 ビジター「デザインきれいだな、文字周りの処理に秘訣とかあるの？」 オーナー「文字をクリアにみせるために、Photoshopでこういう風にやってるよ。」 という感じです。 Site テクニックの紹介の前に、まずは文字周りを実寸大にしたものから。 Site -実寸大画像 カラーのコン... 続きを読む

Photoshopでテキストを水彩風にする方法。 | Handy Web Design

2013/03/26 77 users Photoshop ブラシ 水彩風 テキスト タイトル

Photoshopは色々な機能がついていてややこしいですが、簡単な機能でもいろいろできるという意味もこめてご紹介しますー。手作業っぽい部分が多いので、タイトルなどの文字周りに使える方法だと思います。 1.文字を配置する とりあえず好きな文字を配置します。今回は水彩風に似合うタイトルを使ってみます。 2.文字の上に着色する 文字の上に新規レイヤーを作り、そこにブラシで色をつけます。ブラシはウエットメ... 続きを読む

Fireworksで覚えておくと便利な文字設定まわりのTips | Webデザインのタネ

2012/07/09 330 users Fireworks モック タネ Tips グラフィック

FireworksやPhotoshopなどのグラフィックツールでWebデザインのモックを作る際、文字ツールは矩形ツールより多く使うことが多く、文字設定のショートカットを覚えているだけでも効率は全然違います。グラフィックソフトで一番に覚えるべきショートカットは何かと聞かれたら間違いなく文字周りのショートカットです！ 今日はFireworksで覚えておくと便利な文字設定のTipsや拡張機能をまとめてお... 続きを読む