Enviar búsqueda
Cargar
「Webデザイナーのためのタイポグラフィと文字組版」
•
217 recomendaciones
•
139,416 vistas
swwwitch inc.
Seguir
CSS Nite LP, Disk 11「Designer's High」Part 1でのセッション資料 講師:鷹野雅弘(スイッチ) http://lp11.cssnite.jp/
Leer menos
Leer más
Diseño
Denunciar
Compartir
Denunciar
Compartir
1 de 126
Descargar ahora
Descargar para leer sin conexión
Recomendados
2012年2月16日 福井工業高等専門学校で行いましたデザインセミナーでのスライドです。
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
Toshiaki Sasaki
デザインは誤解されることが多いと思います。 その一つひとつに答えながら、いいデザインのために組織の一人ひとりができることを共有します。
いいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができること
Masahiko Yoshikawa
ノンデザイナーのための配色理論
ノンデザイナーのための配色理論
tsukasa obara
2016年9月2日に開催された「Adobe MAX Japan」にて、crema design黒野明子と株式会社タガス浅野桜が発表したセッションのスライドです。
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
Akiko Kurono
@ 2015.11.26
コメントビュアーを作った話
コメントビュアーを作った話
健人 辻
これから本格的に Visual Studio Team Services (旧Visual Studio Online) や Team Foundation Server を使い始めるチーム(マネージャ・リーダー・メンバー)向けに、画面操作のデモ含めて約2時間の研修用の資料です。
ウォーターフォール・アジャイル・DevOps どんなチームでも開発・テスト・リリースでVSTS/TFSをフル活用する方法
ウォーターフォール・アジャイル・DevOps どんなチームでも開発・テスト・リリースでVSTS/TFSをフル活用する方法
慎一 古賀
npca2012年度第1回LT大会でのプレゼン
いいデザインと悪いデザイン
いいデザインと悪いデザイン
Takahashi Koki
2008-12-07_PTAM_Kansai.AR
2008-12-07_PTAM_Kansai.AR
masayashi Kobayashi
Recomendados
2012年2月16日 福井工業高等専門学校で行いましたデザインセミナーでのスライドです。
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
Toshiaki Sasaki
デザインは誤解されることが多いと思います。 その一つひとつに答えながら、いいデザインのために組織の一人ひとりができることを共有します。
いいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができること
Masahiko Yoshikawa
ノンデザイナーのための配色理論
ノンデザイナーのための配色理論
tsukasa obara
2016年9月2日に開催された「Adobe MAX Japan」にて、crema design黒野明子と株式会社タガス浅野桜が発表したセッションのスライドです。
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
Akiko Kurono
@ 2015.11.26
コメントビュアーを作った話
コメントビュアーを作った話
健人 辻
これから本格的に Visual Studio Team Services (旧Visual Studio Online) や Team Foundation Server を使い始めるチーム(マネージャ・リーダー・メンバー)向けに、画面操作のデモ含めて約2時間の研修用の資料です。
ウォーターフォール・アジャイル・DevOps どんなチームでも開発・テスト・リリースでVSTS/TFSをフル活用する方法
ウォーターフォール・アジャイル・DevOps どんなチームでも開発・テスト・リリースでVSTS/TFSをフル活用する方法
慎一 古賀
npca2012年度第1回LT大会でのプレゼン
いいデザインと悪いデザイン
いいデザインと悪いデザイン
Takahashi Koki
2008-12-07_PTAM_Kansai.AR
2008-12-07_PTAM_Kansai.AR
masayashi Kobayashi
DevLOVE現場甲子園2014 東日本大会 技
私がドメイン駆動設計をやる理由
私がドメイン駆動設計をやる理由
増田 亨
Event : UI温泉 in 綱島温泉 2015.02.07 Speaker : 割石裕太 / wariemon - UI Designer @KAYAC inc. / OH UI温泉 - UIと湯を愛するイベント - 4番目のスピーカーとして登壇させていただきました。 UI と 温泉 の共通点として「心地よい温度」を見出し、 そこに至るまでのフローを考えた内容となっております。
心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -
wariemon
2014年7月30日におこなわれたADC MEETUPでのセッションのスライドです。 Photoshop CC 2014を使用することを想定した内容となっています。
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
Hiroyuki Makishita
関西Javaエンジニアの会'13 7月度 発表資料 http://kanjava.connpass.com/event/2740/
ドメイン駆動設計入門
ドメイン駆動設計入門
Takuya Kitamura
このデザインのどこが悪いか?をより具体的に伝えることができるようになるため、これだけはしっておきたいUIデザインの基本の「き」
UIデザインの基本
UIデザインの基本
Roy Kim
Middle school and high school students analyze the advertisement to determine how the advertisers are using hyperbole to sell a product.See correlating handout with student prompts on www.literacystationinspiration.com.
Hyperbole in Print Ads
Hyperbole in Print Ads
Emma Zayas
車椅子の自動運転開発に携わった経験から得た見地をお話シアmす。ROSとSLAM、センサー周りから、機械学習によるロボットの外界認識について、3次元畳み込みニューラルネットワークを使った事例を紹介します。
ディープラーニングとROSで作る自動運転ロボット
ディープラーニングとROSで作る自動運転ロボット
Hiroaki Kaneda
どんなにすばらしいUXをユーザーに提供しようとしても、UIがUXのためのデザインになっていないとユーザーは体験することが出来ません。それはいろんな意味で残念。。UXを正しく考慮したUIをデザインするためには、どうすればいいのでしょうか?
UXのためのUIデザイン
UXのためのUIデザイン
Hironobu Aoki
社内勉強会向け資料
REST API のコツ
REST API のコツ
pospome
2012年7月7日 CSS Nite in OKAYAMA vol.3にて講演
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
Takuya Nishitani
Marp Next の紹介 https://marp.app/
Marp Next Tips !
Marp Next Tips !
Nobutada Matsubara
QiitaNight ~フロントエンド~で発表した資料になります。 https://increments.connpass.com/event/261907/
20221017_QiitaNight_ver2.pdf
20221017_QiitaNight_ver2.pdf
yuyayamaguchi6
事業計画 (ケース販売)
事業計画 (ケース販売)
政和 高橋
https://hakata-tech-juku.connpass.com/event/62050/
そろそろレガシーな.Net開発をやめなイカ?
そろそろレガシーな.Net開発をやめなイカ?
Yuta Matsumura
弊社の勉強会で発表した資料になります。Google Docsを使ってドキュメントを共有しておりましたが、Confluenceの方がベターだと思い書きました。
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
Narichika Kajihara
CEDEC2021のアカツキによる「モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後」
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
aktsk_corporate
授業でやったサーベイの一枚まとめをシェアします. 鬼コースでは週25本論文を読みます.
#FTMA15 第一回 鬼コース 全PDF
#FTMA15 第一回 鬼コース 全PDF
Yoichi Ochiai
医療分野におけるお
医療分野におけるオープンソースソフトウェアの開発と利用
医療分野におけるオープンソースソフトウェアの開発と利用
Shinji Kobayashi
2014/1/28に開催した「リーンカンファレンス2014」の講演資料です。
ソフトウェア開発を加速させるリーン開発の原則 公開用
ソフトウェア開発を加速させるリーン開発の原則 公開用
ESM SEC
Web担当者Forum秋のイベント 11月7日(月)14:05 KA1-4 セッションのスライドです。 「ウチの事業部の商品をWebサイトとアプリのトップに載せて!」 「新機能をとにかく目立たせろ! 利用数をとにかく増やして!」 Webサイトやアプリを運用していると、社内のあちこちから、さまざまな圧力や依頼が舞い込むものです。えらい人からの現場を知らない指示であったり、発言力の強い部署からの高圧的な依頼であったり、決裁者からの思いつきの要望であったり……。その多くは「その人の視点から見た世界」の個別最適であり、全体最適でのユーザー目線に欠けていたり、Webサイトやアプリの使いやすさを毀損する内容であったりします。Web担当者やプロダクトマネージャーは社内の不要な衝突を避けながら、決裁者からは予算を引き出し、ユーザーに価値を届けられるプロダクトのかたちを守り続けなければなりません。本セッションでは、業界歴20年超の発表者が、あるあるエピソードを取り上げながら、社内政治の泣き笑いと、落としどころの見つけかたを模索します。
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
Yoshiki Hayama
BP study #46
色彩センスのいらない配色講座
色彩センスのいらない配色講座
Mariko Yamaguchi
2011/04/16 ishikawa.crr #3
いますぐ使えるタイポグラフィ2〜書体のはなし
いますぐ使えるタイポグラフィ2〜書体のはなし
Shinichiro Yabu
Más contenido relacionado
La actualidad más candente
DevLOVE現場甲子園2014 東日本大会 技
私がドメイン駆動設計をやる理由
私がドメイン駆動設計をやる理由
増田 亨
Event : UI温泉 in 綱島温泉 2015.02.07 Speaker : 割石裕太 / wariemon - UI Designer @KAYAC inc. / OH UI温泉 - UIと湯を愛するイベント - 4番目のスピーカーとして登壇させていただきました。 UI と 温泉 の共通点として「心地よい温度」を見出し、 そこに至るまでのフローを考えた内容となっております。
心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -
wariemon
2014年7月30日におこなわれたADC MEETUPでのセッションのスライドです。 Photoshop CC 2014を使用することを想定した内容となっています。
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
Hiroyuki Makishita
関西Javaエンジニアの会'13 7月度 発表資料 http://kanjava.connpass.com/event/2740/
ドメイン駆動設計入門
ドメイン駆動設計入門
Takuya Kitamura
このデザインのどこが悪いか?をより具体的に伝えることができるようになるため、これだけはしっておきたいUIデザインの基本の「き」
UIデザインの基本
UIデザインの基本
Roy Kim
Middle school and high school students analyze the advertisement to determine how the advertisers are using hyperbole to sell a product.See correlating handout with student prompts on www.literacystationinspiration.com.
Hyperbole in Print Ads
Hyperbole in Print Ads
Emma Zayas
車椅子の自動運転開発に携わった経験から得た見地をお話シアmす。ROSとSLAM、センサー周りから、機械学習によるロボットの外界認識について、3次元畳み込みニューラルネットワークを使った事例を紹介します。
ディープラーニングとROSで作る自動運転ロボット
ディープラーニングとROSで作る自動運転ロボット
Hiroaki Kaneda
どんなにすばらしいUXをユーザーに提供しようとしても、UIがUXのためのデザインになっていないとユーザーは体験することが出来ません。それはいろんな意味で残念。。UXを正しく考慮したUIをデザインするためには、どうすればいいのでしょうか?
UXのためのUIデザイン
UXのためのUIデザイン
Hironobu Aoki
社内勉強会向け資料
REST API のコツ
REST API のコツ
pospome
2012年7月7日 CSS Nite in OKAYAMA vol.3にて講演
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
Takuya Nishitani
Marp Next の紹介 https://marp.app/
Marp Next Tips !
Marp Next Tips !
Nobutada Matsubara
QiitaNight ~フロントエンド~で発表した資料になります。 https://increments.connpass.com/event/261907/
20221017_QiitaNight_ver2.pdf
20221017_QiitaNight_ver2.pdf
yuyayamaguchi6
事業計画 (ケース販売)
事業計画 (ケース販売)
政和 高橋
https://hakata-tech-juku.connpass.com/event/62050/
そろそろレガシーな.Net開発をやめなイカ?
そろそろレガシーな.Net開発をやめなイカ?
Yuta Matsumura
弊社の勉強会で発表した資料になります。Google Docsを使ってドキュメントを共有しておりましたが、Confluenceの方がベターだと思い書きました。
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
Narichika Kajihara
CEDEC2021のアカツキによる「モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後」
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
aktsk_corporate
授業でやったサーベイの一枚まとめをシェアします. 鬼コースでは週25本論文を読みます.
#FTMA15 第一回 鬼コース 全PDF
#FTMA15 第一回 鬼コース 全PDF
Yoichi Ochiai
医療分野におけるお
医療分野におけるオープンソースソフトウェアの開発と利用
医療分野におけるオープンソースソフトウェアの開発と利用
Shinji Kobayashi
2014/1/28に開催した「リーンカンファレンス2014」の講演資料です。
ソフトウェア開発を加速させるリーン開発の原則 公開用
ソフトウェア開発を加速させるリーン開発の原則 公開用
ESM SEC
Web担当者Forum秋のイベント 11月7日(月)14:05 KA1-4 セッションのスライドです。 「ウチの事業部の商品をWebサイトとアプリのトップに載せて!」 「新機能をとにかく目立たせろ! 利用数をとにかく増やして!」 Webサイトやアプリを運用していると、社内のあちこちから、さまざまな圧力や依頼が舞い込むものです。えらい人からの現場を知らない指示であったり、発言力の強い部署からの高圧的な依頼であったり、決裁者からの思いつきの要望であったり……。その多くは「その人の視点から見た世界」の個別最適であり、全体最適でのユーザー目線に欠けていたり、Webサイトやアプリの使いやすさを毀損する内容であったりします。Web担当者やプロダクトマネージャーは社内の不要な衝突を避けながら、決裁者からは予算を引き出し、ユーザーに価値を届けられるプロダクトのかたちを守り続けなければなりません。本セッションでは、業界歴20年超の発表者が、あるあるエピソードを取り上げながら、社内政治の泣き笑いと、落としどころの見つけかたを模索します。
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
Yoshiki Hayama
La actualidad más candente
(20)
私がドメイン駆動設計をやる理由
私がドメイン駆動設計をやる理由
心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
ドメイン駆動設計入門
ドメイン駆動設計入門
UIデザインの基本
UIデザインの基本
Hyperbole in Print Ads
Hyperbole in Print Ads
ディープラーニングとROSで作る自動運転ロボット
ディープラーニングとROSで作る自動運転ロボット
UXのためのUIデザイン
UXのためのUIデザイン
REST API のコツ
REST API のコツ
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
Marp Next Tips !
Marp Next Tips !
20221017_QiitaNight_ver2.pdf
20221017_QiitaNight_ver2.pdf
事業計画 (ケース販売)
事業計画 (ケース販売)
そろそろレガシーな.Net開発をやめなイカ?
そろそろレガシーな.Net開発をやめなイカ?
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
情報共有は、なぜGoogle Docsじゃなく、 Confluenceなのか。
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
Cedec2021_モバイルゲーム事業で 大規模スクラム(LeSS)を 導入するまでの1年間とその後
#FTMA15 第一回 鬼コース 全PDF
#FTMA15 第一回 鬼コース 全PDF
医療分野におけるオープンソースソフトウェアの開発と利用
医療分野におけるオープンソースソフトウェアの開発と利用
ソフトウェア開発を加速させるリーン開発の原則 公開用
ソフトウェア開発を加速させるリーン開発の原則 公開用
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
Destacado
BP study #46
色彩センスのいらない配色講座
色彩センスのいらない配色講座
Mariko Yamaguchi
2011/04/16 ishikawa.crr #3
いますぐ使えるタイポグラフィ2〜書体のはなし
いますぐ使えるタイポグラフィ2〜書体のはなし
Shinichiro Yabu
いますぐ使えるタイポグラフィ
いますぐ使えるタイポグラフィ
Shinichiro Yabu
第25回 岡山WEBクリエイターズ「パララックス / CSS / タイポグラフィ 再入門」にて講演。[2014-04-19] ちょっとした工夫で“普通のテキスト”を“デザインされたテキスト”に変えることができます。今までのWEBデザインではデバイスフォントという制約もあり、DTPと比べるとタイポグラフィはあまり重要視されてきませんでしたが、高解像度のデバイスやウェブフォントの普及などにより、その必要性は高まっています。適切で根拠のあるテキストの扱い方を学び、あなたが制作するデザインに自信つくよう、DTP・WEB両方のデザイン経験を元にタイポグラフィと文字組版の基本を解説いたします。
デザインに自信がつく、タイポグラフィの基本
デザインに自信がつく、タイポグラフィの基本
Takuya Nishitani
ーーーーーーーーーーーーーーーーーーーーーーー schoo WEB-campusは「WEBに誕生した、学校の新しいカタチ」。 WEB生放送の授業を無料で配信しています。 ▼こちらから授業に参加すると、先生への質問や、ユーザーとのチャット、資料の拡大表示等が可能です。 https://schoo.jp/class/322/room ーーーーーーーーーーーーーーーーーーーーーーー
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
schoowebcampus
Kanazawa.rb #24 で使用したスライドです
ぼくがやってるぷろじぇくとまねじめんと
ぼくがやってるぷろじぇくとまねじめんと
Toshiaki Sasaki
WebSig会議 vol.33: http://websig247.jp/meeting/33/ 2ndセッション ハートに響くUIを生み出すためのデザインプロセス /土屋尚史(株式会社グッドパッチ 代表取締役)
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
WebSig24/7
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
Sasaki Kouhei
新作スライド ボッチなデザイナーがクラウドファンディングを始めようとしたら「それでは3200人あつめてください」と言われた件 - https://goo.gl/co5NRN 公開しました! ぜひコチラもお読みください! 読んでくれてありがとう!面白かったらぜひぜひシェアしてくれると嬉しいよ!(`・ω・´)b ダウンロードもプリントも配布もご自由にどうぞ!たくさんの人にみてもらえれば最高です! デザインが苦手な人ほどオススメ! Aさんはデザインはこうだという。 Bさんはデザインはああだという。 ああああああもう!!結局どっちが正しいんだよ!? そんな疑問がたった13ページで解決します! "デザイン"なのに真逆のことをいう人達がいるのは、 実はこういうことだった! もう、デザインが苦手なんてことない!
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
Ryoji Fujishita
2015/05/15 DevLOVE関西 クリエイターの技術持ち寄り発表会~デザインそもそも論 https://devlove-kansai.doorkeeper.jp/events/23681 こちらで発表したスライドです。
誰に何を伝える?わたしの デザインコンセプトの 作り方、探し方
誰に何を伝える?わたしの デザインコンセプトの 作り方、探し方
Ayaka Sumida
http://html555.jp/2012/04/25/cording-speed-up/
コーディングが上達するコツ
コーディングが上達するコツ
evol-ni
はじめての欧文書体
はじめての欧文書体
Shohei Itoh
レスポンシブWebデザインの概要から実装の基本まで。
レスポンシブWebデザインの基礎
レスポンシブWebデザインの基礎
Hiroyuki Ogawa
「webっちゃvol.1」で使用したスライドです。(一部修正あり)
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜
典子 松本
俺聞け4(2013/2/16)にて発表、これからの取り組み前に一度整理しておきたかったUXとUIの話。
はじめてのUXとUIの話
はじめてのUXとUIの話
Kazuki Yamashita
UIデザインの決定プロセスをより高速化するために、会議するのをやめました。会議をやめたことでより多くのフィードバックを得ることができ、デザインの修正コストを下げる事ができました。
UIの話は会議室でするな
UIの話は会議室でするな
Shingo Katsushima
勉強会で使用したスライドです。
UXとブランド
UXとブランド
Takehisa Gokaichi
AppStoreとGooglePlayの両プラットフォームに選ばれたBrainWarsが実践するプラットフォームに合わせたUI/UX最適化のノウハウを紹介します。
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
Hiroki Takaba
2012-05-30 ShibuyaUXのセミナー資料。 当日のTweetはこちら http://togetter.com/li/312567
ShibuyaUX - UX and Analytics
ShibuyaUX - UX and Analytics
Makoto Shimizu
[UX]はやめようというお話をしました。
[UX]は投げ捨てろ!
[UX]は投げ捨てろ!
c-mitsuba
Destacado
(20)
色彩センスのいらない配色講座
色彩センスのいらない配色講座
いますぐ使えるタイポグラフィ2〜書体のはなし
いますぐ使えるタイポグラフィ2〜書体のはなし
いますぐ使えるタイポグラフィ
いますぐ使えるタイポグラフィ
デザインに自信がつく、タイポグラフィの基本
デザインに自信がつく、タイポグラフィの基本
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
ぼくがやってるぷろじぇくとまねじめんと
ぼくがやってるぷろじぇくとまねじめんと
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
誰に何を伝える?わたしの デザインコンセプトの 作り方、探し方
誰に何を伝える?わたしの デザインコンセプトの 作り方、探し方
コーディングが上達するコツ
コーディングが上達するコツ
はじめての欧文書体
はじめての欧文書体
レスポンシブWebデザインの基礎
レスポンシブWebデザインの基礎
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜
はじめてのUXとUIの話
はじめてのUXとUIの話
UIの話は会議室でするな
UIの話は会議室でするな
UXとブランド
UXとブランド
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
ShibuyaUX - UX and Analytics
ShibuyaUX - UX and Analytics
[UX]は投げ捨てろ!
[UX]は投げ捨てろ!
Más de swwwitch inc.
2018年5月17日(木)に放映されたオンライン番組「Creative Cloud道場(CC道場)#212 エバンジェリストに聞け!鷹野雅弘」でのスライド
Creative Cloud道場(CC道場)#212 エバンジェリストに聞け!鷹野雅弘
Creative Cloud道場(CC道場)#212 エバンジェリストに聞け!鷹野雅弘
swwwitch inc.
2016年9月2日(金)開催 http://www.event-web.net/adobemaxjapan/
Adobe MAX Japan 2016「ベテランほど知らずに損してるIllustratorの新常識 あ、それ、今のIllustratorならこうします!...
Adobe MAX Japan 2016「ベテランほど知らずに損してるIllustratorの新常識 あ、それ、今のIllustratorならこうします!...
swwwitch inc.
スライド内で参照しているリンク先一覧 http://matome.naver.jp/odai/2145969573620076801 2015年12月26日(土)、ソラシティホールで開催したShift9:Webデザイン行く年来る年(CSS Nite LP43)のフォントセッションから http://cssnite.jp/archives/post_2859.html
2015年のフォント総括/鷹野 雅弘(スイッチ)
2015年のフォント総括/鷹野 雅弘(スイッチ)
swwwitch inc.
・テキスト:スライドのギリギリに置かない ・画像:スライドのギリギリまで使う
スライド制作で テキストや画像を配置するとき、 覚えておきたい2つのこと/鷹野 雅弘(スイッチ)
スライド制作で テキストや画像を配置するとき、 覚えておきたい2つのこと/鷹野 雅弘(スイッチ)
swwwitch inc.
【株式会社 帆風】第170回バンフーセミナー Illustrator・Photoshop・InDesignデータ駆動グラフィックの基本 http://www.vanfu.co.jp/seminar/170th.html http://www.dtp-transit.jp/seminar/vanfu/post_2118.html
第170回バンフーセミナー Illustrator・Photoshop・InDesignデータ駆動グラフィックの基本
第170回バンフーセミナー Illustrator・Photoshop・InDesignデータ駆動グラフィックの基本
swwwitch inc.
鷹野 雅弘(スイッチ) 再録記事 https://blogs.adobe.com/creativestation/dtp-photoshop-kihon-tips-sp アーカイブ動画 https://www.youtube.com/watch?v=YoXgJgrSC0E 2015年11月11日開催 http://www.event-web.net/adobelive2015/max/
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
swwwitch inc.
http://www.dtp-transit.jp/seminar/post_2055.html
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
swwwitch inc.
2014年4月25日(金)、六本木アカデミーヒルズ 49F タワーホールで開催されたCreate Now Design Tour Special「CS vs CC徹底比較セミナー・特別編」の『ユーザー目線からのCC VS CS徹底比較』セッションのスライドです。 http://www.dtp-transit.jp/seminar/post_1900.html 鷹野 雅弘(スイッチ)
Create Now Design Tour Special「CS vs CC徹底比較セミナー・特別編」ユーザー目線からのCC VS CS徹底比較
Create Now Design Tour Special「CS vs CC徹底比較セミナー・特別編」ユーザー目線からのCC VS CS徹底比較
swwwitch inc.
2014年3月15日、鴨江アートセンターで開催 http://www.dorp.jp/event/dorp-inspiration-2014/ DORP INSPIRATION 2014『地方から紐解くデザイナーのこれから』 「CSS Nite 9年目に見る勉強会の今とこれから」 鷹野 雅弘(スイッチ) --- フォローアップ http://takanomasahiro.tumblr.com/post/79071594220/dorp-inspiration-2014-css-nite-9
「CSS Nite 9年目に見る勉強会の今とこれから」鷹野 雅弘(スイッチ)
「CSS Nite 9年目に見る勉強会の今とこれから」鷹野 雅弘(スイッチ)
swwwitch inc.
2010年6月、表参道 The Gallery「station 5」 で開催したCSS Nite in Omotesando, Vol.3「Illustrator CS5 for Webデザイン」のスライドです。
Illustrator CS5 for Webデザイン
Illustrator CS5 for Webデザイン
swwwitch inc.
2013年11月21日(木)19:00-20:00、アップルストア銀座で開催されたCSS Nite in Ginza, Vol.72のスライド。 http://cssnite.jp/ginza/vol72/ 参照リンクなど http://bit.ly/1blGiqd
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
swwwitch inc.
2013年11月8日、JPタワー(東京・丸の内)で開催されたCREATE NOW / PLUS ONE DAYの「画像をなるべく使わずにWebをレイアウトするテクニック」セッションのスライドです。 http://adobe-createnow.jp/event
「画像をなるべく使わずにWebをレイアウトするテクニック」鷹野 雅弘(スイッチ)
「画像をなるべく使わずにWebをレイアウトするテクニック」鷹野 雅弘(スイッチ)
swwwitch inc.
http://www.dtp-transit.jp/seminar/ustream/post_1688.html
ここ数バージョンのIllustratorで強化されながらも見過ごされている(であろう)機能、ベスト10
ここ数バージョンのIllustratorで強化されながらも見過ごされている(であろう)機能、ベスト10
swwwitch inc.
http://www.adobe.com/jp/joc/design/books/ekinama/
マスクに関するアレコレ(「生でエキスパートが語る」第3回)
マスクに関するアレコレ(「生でエキスパートが語る」第3回)
swwwitch inc.
2008年10月15日、アップルストア心斎橋にて開催したCSS Nite in Osaka, Vol.12でのスライドです。 http://cssnite.jp/archives/post_1173.html
ベジェ再入門
ベジェ再入門
swwwitch inc.
2011年6月23日(木)、アップルストア銀座で開催したCSS Nite in Ginza, Vol.57での鷹野 雅弘(スイッチ)のセッション。
Dreamweaver CS5.5でワークフローはどう変わるのか?
Dreamweaver CS5.5でワークフローはどう変わるのか?
swwwitch inc.
Widthの発音について
Widthの発音について
swwwitch inc.
2010年12月16日、アップルストア銀座で開催したCSS Nite in Ginza, Vol.55(Shift 4)の『ツールの進化とこれからの制作環境 2010 』/鷹野雅弘(スイッチ)のスライドです。
CSS Nite in Ginza, Vol.55 (Shift 4)
CSS Nite in Ginza, Vol.55 (Shift 4)
swwwitch inc.
2010年8月10日、原宿のSINAPオフィスで開催されたSINAP TALK Vol.04の資料です。
SINAP TALK Vol.04「プレゼンテーションについて」鷹野雅弘
SINAP TALK Vol.04「プレゼンテーションについて」鷹野雅弘
swwwitch inc.
ADOBE CREATIVE SUITE 5 Web Premium 発売記念セミナーでの資料
Illustrator CS5、Photoshop CS5 Extended、Fireworks CS5、どれを使う? Webデザイナーのための使いどころ...
Illustrator CS5、Photoshop CS5 Extended、Fireworks CS5、どれを使う? Webデザイナーのための使いどころ...
swwwitch inc.
Más de swwwitch inc.
(20)
Creative Cloud道場(CC道場)#212 エバンジェリストに聞け!鷹野雅弘
Creative Cloud道場(CC道場)#212 エバンジェリストに聞け!鷹野雅弘
Adobe MAX Japan 2016「ベテランほど知らずに損してるIllustratorの新常識 あ、それ、今のIllustratorならこうします!...
Adobe MAX Japan 2016「ベテランほど知らずに損してるIllustratorの新常識 あ、それ、今のIllustratorならこうします!...
2015年のフォント総括/鷹野 雅弘(スイッチ)
2015年のフォント総括/鷹野 雅弘(スイッチ)
スライド制作で テキストや画像を配置するとき、 覚えておきたい2つのこと/鷹野 雅弘(スイッチ)
スライド制作で テキストや画像を配置するとき、 覚えておきたい2つのこと/鷹野 雅弘(スイッチ)
第170回バンフーセミナー Illustrator・Photoshop・InDesignデータ駆動グラフィックの基本
第170回バンフーセミナー Illustrator・Photoshop・InDesignデータ駆動グラフィックの基本
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
Create Now Design Tour Special「CS vs CC徹底比較セミナー・特別編」ユーザー目線からのCC VS CS徹底比較
Create Now Design Tour Special「CS vs CC徹底比較セミナー・特別編」ユーザー目線からのCC VS CS徹底比較
「CSS Nite 9年目に見る勉強会の今とこれから」鷹野 雅弘(スイッチ)
「CSS Nite 9年目に見る勉強会の今とこれから」鷹野 雅弘(スイッチ)
Illustrator CS5 for Webデザイン
Illustrator CS5 for Webデザイン
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「画像をなるべく使わずにWebをレイアウトするテクニック」鷹野 雅弘(スイッチ)
「画像をなるべく使わずにWebをレイアウトするテクニック」鷹野 雅弘(スイッチ)
ここ数バージョンのIllustratorで強化されながらも見過ごされている(であろう)機能、ベスト10
ここ数バージョンのIllustratorで強化されながらも見過ごされている(であろう)機能、ベスト10
マスクに関するアレコレ(「生でエキスパートが語る」第3回)
マスクに関するアレコレ(「生でエキスパートが語る」第3回)
ベジェ再入門
ベジェ再入門
Dreamweaver CS5.5でワークフローはどう変わるのか?
Dreamweaver CS5.5でワークフローはどう変わるのか?
Widthの発音について
Widthの発音について
CSS Nite in Ginza, Vol.55 (Shift 4)
CSS Nite in Ginza, Vol.55 (Shift 4)
SINAP TALK Vol.04「プレゼンテーションについて」鷹野雅弘
SINAP TALK Vol.04「プレゼンテーションについて」鷹野雅弘
Illustrator CS5、Photoshop CS5 Extended、Fireworks CS5、どれを使う? Webデザイナーのための使いどころ...
Illustrator CS5、Photoshop CS5 Extended、Fireworks CS5、どれを使う? Webデザイナーのための使いどころ...
「Webデザイナーのためのタイポグラフィと文字組版」
1.
2.
3.
キャンペーンサイトやビデオ共有サイトは除きます。
4.
今回はWeb Fontsについては言及しません。
5.
6.
7.
和文フォントは正方形の仮想ボディの中にデザインされています。
8.
出典:http://www.morisawa.co.jp/font/about/knowledge/face.html
9.
10.
11.
仮想ボディをそのまま並べたものがベタ組みです。
12.
字面を優先するのが「ツメ組み」。ほかにアケ組もあります。
13.
コミュニティ 新ゴやAxisなどモダンスタイルのフォントは字面が大きくデザインされています。
14.
画像化するキャッチはツメ組みにした方が可読性が上がります。
15.
16.
欧文フォントは文字ごとに異なる文字幅を持っています。
17.
18.
ベースラインから小文字のxの高さまでがエックスハイトです。
19.
大文字の上部がキャップラインです。
20.
小文字のhやlはキャップラインよりも飛び出すことがあります。
21.
22.
23.
重要なのは、この4つのラインです。
24.
中学生のときに使った英語のノートですね。
25.
欧文の場合、ほぼ行間なく並べても問題ありません。
26.
そのため、多くのブラウザではline-height: 1.2くらいがデフォルトです。
27.
しかし、日本語では窮屈です。
28.
150-190%くらいに設定します。
29.
このようにフォントのメカニズムそのものが異なります。
30.
混植するには大きさのバランスやベースラインを揃える必要があります。
31.
このようにパーレンやブラケットが混じる場合....
32.
半角の括弧類は、文字の中心よりもずれてしまいます。
33.
CIDの新ゴでは1バイトと2バイトの数字では、フォントのデザインが異なります。
34.
和文フォント付属の英数字は(主観によりますが)ちょっとな...と思ったり...
35.
下は欧文フォント(Myriad)を組み合わせました。どちらがいい感じでしょう?
36.
少なくてもグラフィックデザインの分野では混植が常識です。
37.
上は中ゴのみ。中央はUnivers、下はFF DINを組み合わせています。
38.
混植によって、紙面の印象も変わります。
39.
ただし、英数字のサイズやベースラインの調整が不可欠です。
40.
ご参考までにAppleのコーポレートフォントはこのように変遷しています。
41.
アドビのコーポレートフォントの変遷。
42.
混植を行うには「合成フォント」という機能を使います。
43.
上記は「小塚ゴシック」、下は「りょう」をかな部分に設定しています。
44.
合成フォントを前提に「かな」のみのフォントも多く出ています。
45.
46.
47.
48.
49.
デジタルフォントはモリサワの2書体からスタートしました。
50.
先の2書体と加えて基本7書体と呼びます。
51.
「新ゴ」ファミリーはウエイトが揃っていることもあり、大ヒットしました。
52.
リュウミンもファミリー化(「 龍文堂明朝」に由来)
53.
ゴシックMB101は、ゴシックなのに 飾り がある(セリフ?サンセリフ?)
54.
中ゴと見出しゴMB31は、ファミリー的に使うことがあります。
55.
テクニカル系の書籍で多用されています。
56.
ヒラギノ書体は、文字にうるさい人々に大絶賛されました。
57.
Mac OS Xにバンドルされたときには腰を抜かしました。
58.
AXISフォントは、新ゴとは違った表情を持ちます。
59.
雑誌AXISのためにデザインされました(前述したようにAppleも使用)
60.
61.
ここ数年、キテいるのがオールド系のフォント(復刻版を含む)です。
62.
「丸明オールド」は明朝体ですが、エレメントの端がすべて丸まっています。
63.
広告系に大量に使われています(使われすぎて食傷気味...)
64.
A1明朝、丸明オールド、こぶりなの共通点は...
65.
角が
66.
Illustratorで処理する場合、デフォルトの機能ではムリがあります。
67.
上:角処理なし 、下:角処理あり(まろやか)
68.
こんな感じに使われています。
69.
A1明朝の特徴は「墨だまり」。活字での印字をシミュレーションしています。
70.
手書きフォントは「かな」のみしかないものもあります。
71.
グランジはかすれ/汚れ処理のことです。
72.
最近、注目度が高いのがユニバーサルフォント。
73.
家電などにも多く使われはじめています。
74.
以上が最近のフォントのトレンドです。
75.
76.
77.
78.
79.
80.
81.
「巴里の咏」 「巴里の咏」
82.
83.
文字を入力しただけの状態。
84.
このあたり気になりませんか?
85.
自動カーニングを行っても、拗促音や中黒、括弧のアキなどの処理が必要です。
86.
最初の状態と比べてみてください。
87.
画像化するキャッチはツメ組みにした方が可読性が上がります。
88.
89.
90.
91.
92.
93.
少し多めの原稿はテキストをボックスの中に入れて処理します。しかし...
94.
句読点のアキや禁則、また、ジャスティファイ設定する必要があります。
95.
設定するポイントはこの5つ。
96.
調整を行った後。
97.
続けて、デバイスフォントの扱いです。
98.
文字を流し込んだ状態では、読もうと思う気持ちは失せてしまいます。
99.
最低限、行間(行送り)は広げる必要があります。
100.
1文字インデントを設定すると、行頭の ツラ がばらけて見えます。
101.
Webでは3-5行ごとにアキを入れるので、1文字インデントは不要です。
102.
103.
104.
矢野さんの書籍で、こんな言及があります。
105.
それぞれの環境で最適なフォントについて考えてみましょう。
106.
Osakaは太すぎるため、見出しとのコントラストが弱いので本文には向きません。
107.
MS Pゴシックは、MS Officeをインストールすると入ってしまいます。
108.
起こしの括弧の前後のスペーシングが不自然になることがあります。
109.
結論として、Mac環境ではヒラギノ角ゴが最適だと考えます。
110.
111.
文字原稿をどう読ませるかも、デザインの領域です。
112.
下は適切にひらいた状態。ずいぶん印象が変わります。
113.
サイト・パーソナリティ(人格)という観点からも不可欠です。
114.
小学校で習いますし、記者ハンドブックなどにも記載されているルールです。
115.
hosoku
116.
ライセンスの方が安く、たくさんのフォントが使え、表現の幅が広がります。
117.
しかし、フォントが増えるのも困りものです。
118.
オススメは無償のFontExplorer X Proです。
119.
まずは最小限のフォント環境を構築します。
120.
セットとして、フォントを登録していきます。
121.
セットごと、また、検索などを使って、使用するフォントのみを有効にします。
122.
フォント管理は、デザイナーにとって不可欠です。
Descargar ahora