デザイナーはなぜMS Pゴシックを使わないのか? - エディトリアルデザイナーに聞いてみた
デザインを語る上で重要な要素のひとつ、「フォント」。デザインを実際に手がける人だけでなく、それを見る多くの人にとってなじみ深いフォントとして、Windowsのプリインストールフォント「MS Pゴシック」は代表的なもののひとつかもしれません。 「MS Pゴシック」 「MS Pゴシック」は過去にマイナビニュースで実施した美大生の「お気に入りフォント」アンケートにも名前が挙がった実力派(?)ですが、実際に日々グラフィック/エディトリアルデザインを手がけているデザイナーの目には、この定番フォントはどう映るのでしょうか。 今回は、デザイン会社にてエディトリアルデザイン/Webのレイアウトデザインを手がけているSさんに、「MS Pゴシック」についての率直な思いを伺いました。 ――「MS Pゴシック」、デザイン業務で使うことはありますか? 私は主にエディトリアル(雑誌や書籍など)、グラフィック、Web領
エンジニアのための配色まとめ - Qiita
無彩色 白と黒との混合で得られる色（白と黒自体も含む）の総称。 白・黒・さまざまな濃度の灰色が含まれる。 彩度が0であることを表す。 無彩色でない色は、有彩色である。 via 写真技術 色と陰影（手代木さんblogより） - 写真技術と光への道でフォトディレクション-Jimdo撮影編 有彩色 白、黒、灰色以外の色味を持った色のこと。 有彩色にはさらに、純色、清色、中間色に分類される。 以下のような図を、 等色相面 と言う。 via 純色、清色、中間色｜株式会社ノイエデザイン 純色 各色相において、最も彩度が高い色。 ただし、色空間によっては純色以外にも彩度が最大になる色がある。 清色 清色はさらに、明清色、暗清色に分類される。 清色にはくすんだ印象がなく、濁りがない色という特徴がある。 明清色 純色に白だけを加えた色。 ピンクや水色など 暗清色 純色に黒だけを加えた色。 紺色や茶色など 中
Bootstrapで日本語をより美しく表示させることにこだわった無料のテーマ -Honoka
Bootstrapは人気のフレームワークですが、日本語のコンテンツを表示するために最適化されているとは言えません。フォント指定・文字サイズをはじめ、日本語をより美しく表示するためのさまざまなアプローチを取り入れたテーマ「Honoka」を紹介します。 単に使用するだけでなく、他のものでも日本語を美しく表示させるのに役立ちます。 Honoka Honoka -GitHub 日本語フォントは、たくさんのフリーフォントがあります。 2017年用、日本語のフリーフォント 259種類のまとめ Honokaの特徴 Honokaのデモ Honokaのアプローチ -Bootstrapでの日本語表示最適化 Honokaの利用方法 Honokaの特徴 Honokaは、Bootstrapでより美しく日本語を表示させることにこだわったオープンソースのテーマファイルで、これをベースにWebサイトを作成したり、既にBo
Materialize - マテリアルデザインのためのCSSフレームワーク MOONGIFT
レスポンシブでWebデザインを組むのは当たり前、今のトレンドはマテリアルデザインにあるという時代になってきました。フラットUIを踏襲しつつ、アニメーションを効果的に使うことでさらにユーザビリティ高いデザインを可能にします。 主にモバイルアプリ用に使われていますが、Webデザインにおいても十分利用が可能です。今回はマテリアルデザインを実現するスタイルシートフレームワーク、Materializeを紹介します。 Materializeの使い方 今回はスクリーンショット多めに紹介します。 Materializeはレスポンシブかつマテリアルデザインのフレームワークになっています。開発の高速化、ユーザ体験重視、ドキュメントとサンプルを多めにして学習コストを低くするといった特徴があります。 MaterializeはHTML5/JavaScript/CSS3製のオープンソース・ソフトウェア（MIT Lic
クソエンジニアが最速でそれなりのWebデザインをできるようになる方法 - UIU
趣味などでWebサービスを作るときにもっとも悩ましいことのひとつがデザインだと思う。外観は重要な要素だとは理解しているし興味も一応あるけれど、実践に乏しいからどうしていいのかわからない。かといって、タダで頼めるような都合のいいデザイナーはいない。結局めんどうになって、Twitter Bootstrapで体裁だけでっち上げた妙にオタク臭いデザインになってしまう。僕もかつてはデザインを気にも留めないクソエンジニアだったけど、必要に迫られて勉強したらそれなりに手を動かせるようになったのでその方法を紹介する。僕が今年入社したスタートアップにはデザイナーがおらず、新機能を作るときなど仕方なくデザインをこなす必要があった。結果的に、仕方ないなりにPhotoshopを使ってプロトタイプを作りHTML/CSSコーディングするくらいはできるようになった。ここに書くのは仕方なくそれなりのWebデザインをする方
フリーフォント22選【日本語対応／商用可／無料】
最初から入っている標準フォントだけでは、ブログの画像にキャプションを入れたいとき、WEBサイトのメリハリを付けたいとき、ロゴを作りたいときなど、かっこがつかない！そんなふうに思うことありますよね。 しかしフリーフォントって、あまりに種類がたくさんありすぎて、どれを使っていいのやら困ってしまいがち。欧文フォントは種類も豊富だけれど、日本語対応(漢字も対応)フォントを探し出すのはひと苦労。 そこで！今回は使うだけでサイトや印刷物がかっこよく仕上がる、そんな日本語フリーフォントをご紹介いたします。 誰でも自由に無料ダウンロード！商用利用も可日本語対応上記を満たすフォントの中でも、特にクオリティが高く、様々なシーンで使用できそうなフォントを中心に集めました。（参考：サイト改善 10のポイント） 誰でも上手いキャッチコピーが作れる！ノウハウ記事17選とテクニック集 1. スタイリッシュにまとめたい
あなたは見分けられる！？定番フォント代わりに使えるGoogle Fonts 27書体 | WebNAUT by Beeworks
※この記事は2014年1月6日に執筆された記事です。現在は内容が異なる可能性があります。 あけましておめでとうございます！定番フォントを愛してやまない、デザイナーのタカハマです。今月からTypeSquareの「MORISAWA PASSPORTプラン」が始まるようで、国内サイトでもWebfontの使用が一気に増えそうですね！ そこで今回は、WebNAUTでも使用しているWebfontサービス「Google fonts」から、定番フォントの代わりに使えそうな書体をリストアップしました。 定番フォントをカタチ別にピックアップ 今回は定番フォントの偏りを防ぐために、誠文堂新光社「ABCのみほん〜かたちで見分けるフォントガイド〜」を参考に次のようなカテゴリで分類させて頂きました。 Historical Script 歴史的書体 Serif セリフ書体 Hybrid ハイブリッド書体 Sans Se
女性誌にみる女性向けデザインを研究したまとめ
どうも、シンプルやかっこいいWebデザインよりも甘いガーリーテイストのWebデザインが好きなガリザワです。 女性向けのデザインをする時に、女性ファッション誌を参考にすることがあります。しかし一概に女性ファッション誌と言っても数多くありその発行されている雑誌の種類は100種類もあります。そんな中で、主な女性ファッション誌の傾向とデザインの分析をまとめてみました。 女性ファッション誌エディトリアルデザインに学ぶ 女性ファッション誌には、WEBデザインには無い女性デザインの雰囲気を感じれる、WEBサイトではあまり見かけないようなデザインパーツなんかも数多くあるので、デザインをするときに参考にしている。 特に女性向けのデザインをするときに、ターゲット層が細かく分けられており、そのターゲット層にあったデザインをする必要がある。その上でターゲット層に合った雑誌の傾向をまとめてみた。 （伊藤忠ファッショ
ズルいデザインテクニック2013 + セミフラット version
[大阪] プログラマー向けデザイン勉強会で発表させていただきました。 http://connpass.com/event/3086/ --- [あわせて読みたい] KSSで作るパターンライブラリ by @machida https://speakerdeck.com/machida/k…
最近流行りのウェブ開発系ツールまとめ（主にデザイン） | keisuke.tsukayoshi
最近、ウェブデザイン周りの優良ツールがたくさん出てきていて、しかもちゃっかりみんな買っちゃうしアドオン系のソフトウェア界隈にも良い流れを感じるこのごろ。今回は、ぼくが買ったツールのうちこれは手放せないなとおもったものをピックアップしてアフィリンク付きでゲス顔で紹介したいと思います。主にMacです。 マークアップ系 Slicy PSDファイルから画像素材が出力できるアプリ。PSDファイルを読み込ませるだけでほとんど自由自在に画像素材を書き出せます。使い方はPhotoshopのレイヤーやフォルダに.pngなどの拡張子をつけておくだけ。 マークアップするときの画像書き出し作業が全然億劫じゃなくなったのが一番嬉しい。一度読み込ませると、あとはPSDが更新されたら自動で書きだす機能なんかもあります。スマホのRetina用に半分の画像も一緒に書き出せたり、MacのRetina用に二倍の画像も一緒に書き
ノンデザイナーこそ押さえておきたい！グッとくるWebサイト配色パターン集 | Find Job ! Startup
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
これはウェブページです｡
たいしたページではありません｡ あるのは言葉だけ｡ それをあなたは読んでいます｡ オシャレなデザインや､レスポンシブなレイアウト､魔法のようなスクリプトに私たちは魅了されてしまいました｡ でも､ウェブで一番強力な道具は､今も昔も言葉です｡ 私が書いた言葉を､あなたが読んでいる｡これこそ魔法です｡ 私はブリティッシュコロンビア州の小さな都市にいますが､あなたは別のどこかにいることでしょう｡私は2013年6月20日の早朝にこれを書きましたが､あなたは違う日時にこれを読んでいることでしょう｡私はノートパソコンでこれを書きましたが､あなたは携帯電話でこれを読んでいるかもしれないし､タブレット端末やデスクトップ端末で読んでいるかもしれません｡ 私とあなたがこうして繋がることができたのは､私が書いた言葉をあなたが読んでいるからです｡ウェブとはそういうものです｡場所や端末､タイムゾーンが違っても､このシ
美しいWebデザインをタイプ別に！見ないと損するパーツ別ギャラリーサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
中型ライダー（二輪）免許を持っているライターの内藤です。 本日は、ライダーキック並みの強烈さで役に立つ見本サイトをまとめてみたいと思います。 Web屋さんはご存じの方も多いかもしれませんが、ブログをしている一般の方、Webデザイン・DTPに興味のある方、お店を持っている方なども必見です！ 部品に特化した見本 部品に特化した見本サイトをご紹介します。 見出しデザイン（h1,h2,h3……その他DTPでも） はじめは見出しデザインに特化した見本サイトまとめ。 見出しデザイン.com http://midashi-design.com/ 見出しタグ（h1,h2,h3……）のデザインの見本ですが、DTPなどでもヒントになるものがたくさんあります。 カテゴライズは、グラデーション・テキストのみ・テキスト非画像・上線・下線・丸・四角・囲み線・斜線・点線・角丸。 ヘッダー部分に凝っても見出しが適当だと全
今年絶対おさえておきたいフラットデザインのまとめ | 株式会社LIG
こんにちは。ライターの内藤です。 恥ずかしながら、最近になって「フラットデザイン」を意識しはじめました。 装飾を最小限におさえることによって、特定のメッセージや製品、アイデアを直球勝負で伝えるデザイン。 フラットデザインは、もともとスマートフォンの小さな画面でシンプルに見せるものから派生したのだと思われますが、Windows8やGoogleの新デザインがきっかけとなって一躍注目を浴びるようになったようです。 もう知っている方も、まだ知らない方もいらっしゃると思いますので、目次のお好きなところから読んでください。 最初から全部読まなくても大丈夫です！ フラットデザインとは まずはどんなものか、百聞は一見にしかず、サンプルを見てみましょう。 フラットデザインの例 http://builtbybuffalo.com/ http://www.squarespace.com/templates/ ※
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
Flipsblog.jp