dwango creators’ blogをご覧の皆様、こんにちは！ はじめまして、来年度から新卒入社する、デザイナーの@Ln_northこと喜多です。（ドワンゴは2016年度からデザイナーの新卒採用をはじめましたので、デザイナーとしては初めての新卒となります。） ようやく卒論や発表が落ち着き、入社に向けて引っ越しや勉強、そして残り僅かな学生の自由な時間を過ごすことができるようになりました。先日まで数学（微分幾何）の卒論を書いていた身のため、少し文体が硬くなってしまうかもしれませんが、お許しください！ 2015年は春休みの3月、夏休みの7月〜9月と内定者インターンとして働いていました。そこでは主に、ニコニコ超会議の「超言論エリア」のロゴ・ロゴタイプのデザインや、先日このブログでも紹介されていた「DWANGO USABILITY LAB.」のロゴ・ロゴタイプやラベルのデザインなどを担当してい

フォントはデザインにおいて、非常に重要な要素です。 プロのデザイナーが当たり前のようにやっていることが、初心者には見落とされていたり、実践されていないこともあります。 持っている日本語フォントがそんなに多くなくても、文字デザインの表現の幅を広げる日本語フォントの組み合わせ方を紹介します。 先週紹介したスライドと同じく、日本語デザイン研究会中部の勉強会でプレゼンされた日本語のタイポグラフィのスライドで、特別に掲載許可をいただきました。 DTPの勉強部屋（名古屋）で登壇しました 日本語デザイン研究会中部は、タイポグラフィの大切さと楽しさを伝えるため・学ぶための交流の場として結成されました。 スライドは全部で51ページ。 フォントに含まれている全ての字形がバランスよく、カッコいいものはあまり多くはありません。多くのデザイナーが使用している各フォントの特徴を理解し、漢字と仮名、そして英数字・約物・

明日、いや今日からすぐに役立つ、日本語フォントの書体の選び方・組み合わせ方、そしてそれをどのようにデザインするのか、日本語タイポグラフィのテクニックを学べるスライドを紹介します。 スライドは、日本語デザイン研究会中部の勉強会でプレゼンされた日本語のタイポグラフィのスライドで、特別に掲載許可をいただきました。 DTPの勉強部屋（名古屋）で登壇しました 日本語デザイン研究会中部は、タイポグラフィの大切さと楽しさを伝えるため・学ぶための交流の場として結成されました。 スライドは全部で45ページ。 日本語の読ませるタイポグラフィについて、書体の選び方や組み合わせ方、実例とともにデザインのテクニック、どのように勉強すればよいのかまで掲載されています。

http://b.hatena.ne.jp/entry/news.mynavi.jp/articles/2015/06/11/mspg/ なんか、すっきりしない。ダサいダサい言いすぎというか。そもそも元の記事でＭＳゴシックがダサい理由を説明してるとはあんまり思えんのだけど、それは置くとして(置くのかよ)。 http://d.hatena.ne.jp/Narr/20150613　←13日16時ころの時点でのブックマークコメントの一部への返事。 追記ここから 黒線の文字の枠はＭＳＰゴシック、水色の影はＭＳゴシックです。文字そのものは「MSゴシックもMSPゴシックも同じ」形。Ｐゴで調節されているのは赤枠の部分、「文字と文字の間隔」です。「そ」と「ぞ」も、濁点の分だけ横幅が違ってるのが分かると思う。等幅だと赤枠が正方形になるわけです。 あくまで文字と文字の間の空白の調整をされてるのがＰゴです。ただ

デザインを語る上で重要な要素のひとつ、「フォント」。デザインを実際に手がける人だけでなく、それを見る多くの人にとってなじみ深いフォントとして、Windowsのプリインストールフォント「MS Pゴシック」は代表的なもののひとつかもしれません。 「MS Pゴシック」 「MS Pゴシック」は過去にマイナビニュースで実施した美大生の「お気に入りフォント」アンケートにも名前が挙がった実力派(?)ですが、実際に日々グラフィック/エディトリアルデザインを手がけているデザイナーの目には、この定番フォントはどう映るのでしょうか。 今回は、デザイン会社にてエディトリアルデザイン/Webのレイアウトデザインを手がけているSさんに、「MS Pゴシック」についての率直な思いを伺いました。 ――「MS Pゴシック」、デザイン業務で使うことはありますか? 私は主にエディトリアル(雑誌や書籍など)、グラフィック、Web領

「明朝体をもう一度日常に」――Webサイトやデジタルデバイスの普及で見かける機会が減っている明朝体。今の時代に適した新たなスタンダードを目指し、「AXIS Font」を手がけるタイププロジェクトが開発したのが横組みに特化した「TP明朝」だ。なぜ今、あえて明朝体なのか。生みの親の鈴木功社長に聞いた。 明朝体とゴシック体、逆転する存在感 明朝体は、毛筆の楷書体が様式化された書体で、ゴシック体と並ぶ基本スタイルの1つ。基本的な地の文の書体として広く使われてきたが、縦の線が太く横の線が細い、縦書きの視線運びを意識した形式であることから、デジタル化の進展とともに利用シーンが減っている。Webの日本語表示はゴシック系がほとんどだ。 鈴木社長は「以前はカジュアルなゴシック体が脇役的な使われ方をしていたのに、現在は逆転している印象。スマホやPCが基本の若い人たちにとっては、もはや見慣れないフォントになって

「東方Project」に登場するキャラクターの持つイメージをフォント化するプロジェクトが「Toho font project」で、記事執筆中の段階では「博麗霊夢」「霧雨魔理沙」「西行寺幽々子」という3キャラクターをイメージしたフォントが4種類リリースされており、すべて商用利用OKとなっています。 Toho font project Vol.1 / 博麗霊夢&霧雨魔理沙 http://font.heartx.info/c85/ 「Toho font project」としてリリースされている4つのフォントは以下の通り。 ◆Reimu Roman 博麗霊夢のイメージから作られたフォント。 英大文字 英小文字 数字 記号や合字まであります。 ◆Reimu-dispaly Roman 同じく博麗霊夢のイメージから作り出されたフォントですが、こちらは英大文字のみ。対応文字数が少ない代わりに華美なデザイ

結論1：アルファベットでウエイトなしだけでも、すべてのモダンブラウザに対応可能です。ただし、旧バージョンのSafariやFirefoxでは対応がまちまちであったため、それらに対応するには併記します。 游ゴシック体と游明朝体はWinodws 8.1では日本語名、OS X Mavericks（10.9）ではアルファベット名のみの対応であるため、両名の併記が必要となります。 疑問2：「ヒラギノ明朝 Pro」と「ヒラギノ明朝 ProN」のどちらを記述すればいいのでしょうか。 「ヒラギノ明朝 Pro」を改訂し、JIS X 0213:2004の例示字体に対応させたものが「ヒラギノ明朝 ProN」です。 参考： ウィキペディア - ヒラギノ 「ヒラギノ明朝 Pro」と「ヒラギノ明朝 ProN」の違い CSSのfont-family指定はこれで決まり！（2013春） 結論2：新しい字形に対応をしている「ヒ

個人や商用で利用できる、無料の日本語フォント164種類を紹介します。 年賀状の宛名にも使える縦書き対応のフォント、かわいい手書きフォント、読みやすいゴシックなどが揃っています。同人誌や印刷物などでの利用も明記しました。 毎年まとめていますが、初紹介のものから既存のものまでダウンロード・ライセンスを改めて確認しています（※情報はこの記事の執筆時のもの）。 最新版を公開！フォントの数が大幅に増えています。 2020年用、日本語のフリーフォント 417種類のまとめ フォント紹介の前に各フォント制作者からのお願いごと。 フォントを利用の際には必ず利用条件やライセンスをご確認ください。 では、多彩なデザインが揃った「FGシリーズ」からご紹介。 FGゼロ 個人・商用サイトで無料利用可。同人誌や各種印刷物なども可。 零式艦上戦闘機に使用されていた文字を現代風にアレンジしたフォント。レトロでシャープな字形

Appleの日本向けWebサイトなど、企業サイトなどで多く採用されている「AXIS Font」が、リリースから15年を前に大幅アップデートされた。文字を取り巻く環境やデバイスが大きく変化するなか、「時代の流れを先読みして社会に必要となるフォントを提案するのがフォントデザイナーの仕事」――タイププロジェクトの鈴木功社長とデザイナーの両見英世さんに話を聞いた。 「AXIS Font」はデザイン雑誌「AXIS」の専用フォントとして2001年に誕生した。日英併記の横組みの同誌に合わせ、和文・欧文の統一感を重視したバイリンガルフォントであることが特徴だ。採用当時から読者や企業から利用したいという問い合わせが多く、03年に一般向けに発売。発売から10年以上経つ今も人気が高い。 Appleやポーラ、カンペール・ジャパンなどデザイン志向の強い企業を中心にブランディングツールとしてWebサイトやカタログなど

次期Windows10・IE日本語版の個人的予想を検証するために 近々いろいろと細かくレポートする予定です。 今日は個人的なたんなる予想と 現在で噂されている事項をまとめてみます。 WindowsとMacの今後のOSで言えることは デザインはフラットへ、フォントは細めへ あらゆるモニタサイズ・デバイスへ対応に この方向でデザイン的に良いのかは別として（個人としてはNO） iOS、Andoroidもしばらくはこの傾向と思って間違いないでしょう。 ウェブサイトやアプリも含めてデザイナーは認識が必要です。 今月のMac OS Yosemiteの評判によってWinOSも 影響は出るかもしれませんね。なにしろWin10は来年ですから。 OSのレンダリングが変わる フォントレンダリングは多少変わるみたいです。 次期のMacでもOS標準フォントは（HelveticaNeueに）変わりますが Window

標準で入ってると思われるフォントのリストです。日本語・英語以外の言語用のフォントも混じってます(ただしきちんと英数字が含まれるもののみ)。 フォントのキャプチャ画像の下に、CSSでフォント指定をしています。インストールされていればそのフォントで表示されるはずですが、ブラウザや設定によっては指定が効かないフォントもあります。斜体以外の文字の太さ・幅のバリエーションも拾いだしてみました。ページデザインの参考にどうぞ。 各枠右上の三角印をクリックするとCSSを表示し、×印のクリックで閉じます。また右側のピンク色の枠へドラッグして取り置きすることができます。取り置きを捨てたり並べ替えたりもできます。(IE9以前とスマホ・タブレットでは取り置きできません) なお、Mac用で枠の右端が赤いものは、必要に応じてダウンロードできるフォントです。(言語を日本語としてmacOSをインストールした場合は下のフォ

2014年7月16日に、Google と Adobe がリリースした Noto Sans（Adobe からは Source Han Sans という名称でリリース）というオープンソースのフォントファミリーは「日本のWebデザイン史上に残る画期的なフォント」だと思ったので記事にしました。 これまでの問題 ウエイトの不足 普段Webデザインなどの仕事をされている方でないとあまり気にすることはないかもしれませんが、たとえば Android は、アプリによっては下記のように日本語部分と英数字部分で大きくウエイト（フォントの太さ）が異なることがありました。 ※この画像は、Nexus 7（Android 4.4）で Twitter 公式アプリを表示した時のものです。 Nexus 7 では Chrome ブラウザーなどでは日本語・半角英数字ともに丸ゴシックで表示され、ウエイトもおかしくないのですが、アプ

フォントフリーについて FONT FREE（フォントフリー）は、無料で使える日本語フリーフォント投稿サイトです。 漢字やカタカナ、ひらがなをはじめとした日本語の無料フォントを、明朝やゴシック、手書きなどのカテゴリーから探すことができます。紹介ページリンクからダウンロードもすぐにできます。 あなたの欲しかったフォントが、すぐに見つかりますように。

個人でも商用でも無料利用できる、日本語のフリーフォント707種類を紹介します。 Webデザイン、アプリ、動画、紙のデザインをはじめ、クライアントのプロジェクトでも販売する同人誌まで、幅広く利用できる無料フォントが満載です！ 前年の647からフリーフォントが50種類くらい増えています！ ※サイト閉鎖などでかなりのフォントが減っています。気になったフォントはダウンロードできるうちにダウンロードしておくことをお勧めします。 本記事は定期的に、全フォントを確認して、更新しております。 初紹介のフォントから既存フォントも改めてリンク・ライセンスを確認しています（※情報はこの記事の執筆時のもの）。ライセンスはWebデザインだけでなく、同人誌や印刷物などでの利用も確認しました。 更新情報 2024/6/4: フォントを10種類追加 2024/2/20: フォントを11種類追加 2023/12/26: フ