Slide 1

Slide 1 text

Editorial web designing のす ゝ め ウ ェ ブ ・ エ デ ィ ト リ ア ル Yutaka SEKIGUCHI 関 口 裕 2017.4.6 FONTPLUS DAY

Slide 2

Slide 2 text

? Τ σ Ο τ Ϧ Ξ ϧ ͱ ͸

Slide 3

Slide 3 text

editorial e.g. the editorial policy / the editorial staff ฤूऀͷɺ ฤू ʢ্ʣ ͷɺ ʢ৽ฉͳ Ͳ ͷ ʣ ࣾઆͷ 【 エ ディト リ ア ル 】

Slide 4

Slide 4 text

ฤू͢ Δ ͜ ͱ ʢ௚઀తʹʣ

Slide 5

Slide 5 text

Τ σ Ο τ Ϧ Ξ ϧ σ β Π ϯ ࢴͷ σ β Π ϯ

Slide 6

Slide 6 text

ฤूతͳ ߦҝɺ ί ϯ ς ϯ π Λద੾ʹ Ճ޻ ɾ ੔ܗ͢ Δ ͜ ͱ 【 広 義 の エ ディト リ ア ル 】

Slide 7

Slide 7 text

΢ Σ ϒ ͷݱࡏ

Slide 8

Slide 8 text

Responsive Web Design Մม Ϩ Π Ξ ΢ τ マ ル チ デ バ イ ス が 一 般 化 し 、 ひ と つ の コ ン テ ン ツ が 取 り う る 形 は 幅 広 い グ ラ デ ー シ ョ ン に

Slide 9

Slide 9 text

Multi Touch Point Ϛ ϧ ν ɾ λ ο ν ϙ Π ϯ τ コ ン テ ン ツ へ の 接 触 点 は 媒 体 か ら 独 立 し は じ め て い る 。 ユ ー ザ ー を 流 入 さ せ る の で は な く コ ン テ ン ツ を 拡 散 さ せ る 考 え 方

Slide 10

Slide 10 text

Design System σ β Π ϯ ͷ γ ε ς Ϝ Խ コ ン ポ ー ネ ン ト の 考 え 方 に よ る 、 維 持 管 理 の で き る デ ザ イ ン の 必 要 性

Slide 11

Slide 11 text

governance 「 ウ ェ ブ の 現 在 」 に 求 め ら れ る こ と ʲ ౷࣏͢ Δ ͜ ͱ ɻ ͦ ͷ ͋ Β Ώ Δ ϓ ϩ η εɻ ʳ ʹ σ β Π ϯ ͷ ϧ ʔ ϧઃܭ Ψ ό φ ϯ ε

Slide 12

Slide 12 text

デザインの文脈で考えれば ΢ Σ ϒ͚ͩͷ ΋ ͷ Ͱ͸ͳ ͍ 普遍的な課題 こ れ ら は

Slide 13

Slide 13 text

Responsive Web Design Մม Ϩ Π Ξ ΢ τ ૊൛ ϑ Υ ʔ Ϛ ο τ ͷઃܭ 増 減 す る コ ン テ ン ツ や ス ペ ー ス へ の 対 応 を 考 慮 し た デ ザ イ ン 設 計

Slide 14

Slide 14 text

Multi Touch Point Ϛ ϧ ν λ ο ν ϙ Π ϯ τ ෳ਺Ξ Π ς Ϝ ͷల։ タ ッ チ ポ イ ン ト ご と の デ ザ イ ン の 最 適 化 と ト ー ン & マ ナ ー の 統 一

Slide 15

Slide 15 text

Design System σ β Π ϯ ͷ γ ε ς Ϝ Խ ά Ϧ ο υ γ ε ς Ϝ ɺ Ξ ʔ τ σ Ο Ϩ Ϋ γ ϣ ϯ 精 緻 で ロ ジ カ ル な デ ザ イ ン 設 計 や 、 媒 体 を 通 し た ア ー ト デ ィ レ ク シ ョ ン の 制 御

Slide 16

Slide 16 text

Τ σ Ο τ Ϧ Ξ ϧσ β Π ϯ ͷߟ͑ํͰ 【 ウ ェ ブ の 現 在 】 ରԠͰ ͖ Δ

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

?

Slide 20

Slide 20 text

? ΢ Σ ϒ ϝ σ Ο Ξ ͸ ϖ ʔ δ ͳ ͷ͔

Slide 21

Slide 21 text

࣮ྫΛࢀর ͠ ͯ Έ Δ

Slide 22

Slide 22 text

ϑ Ο ϧ Ϝ Ξ ʔ τ ࣾ h t t p : / / f i l m a r t . c o . j p FONT PLUS

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

৽ைࣾ h t t p : / / w w w. s h i n c h o s h a . c o . j p

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

LISSAGE MEN h t t p : / / w w w. l i s s a g e . j p / m e n /

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

ࢴͷ Α ͏ ͳ ΢ Σ ϒ ɺ ΢ Σ ϒ ͷ Α ͏ ͳࢴɻ

Slide 29

Slide 29 text

Θ͔ Β ͳ ͍ɻ ΢ Σ ϒ ϝ σ Ο Ξ ͸ ϖ ʔ δ ͳ ͷ͔

Slide 30

Slide 30 text

た だし、

Slide 31

Slide 31 text

΋ ͏ ׬શʹɺ ࢴͱ ͔ ΢ Σ ϒ ͱ ͔ ݴ ͬ ͯ Δஈ֊ ͡ Ό ͳ ͍

Slide 32

Slide 32 text

͞ · ͟ · ͳ ϝ σ Ο Ξ ͷ ҧ͍͕ຒ· ͬ ͯ ͖ ͯ ͍ Δ

Slide 33

Slide 33 text

͜ Ε͔ Β ͷ ΢ Σ ϒ

Slide 34

Slide 34 text

΢ Σ ϒ ͸ރΕ ͍ͯ ͘ 技 術 の 進 歩 で 表 現 は 枯 れ て い く 。 印 刷 媒 体 の よ う に 、 枯 れ た メ デ ィ ア に 向 か っ て い る

Slide 35

Slide 35 text

枯れた技術の水平思考 ԣ Ҫ ܉ ฏ ೚ ఱ ಊ 1 9 4 1 – 1 9 9 7 「最先端ではないが、すでに広く使われてノウハウも固まり不具合も出し尽くして安定して使える技術」 をうまく使い、 「今まで無かった使い道を考える」 という考え方、 視点のこと。 「枯れたメディア」 こそ本質的なデザインが必要なのでは。

Slide 36

Slide 36 text

զʑ ͷखݩʹ໭ ͬ ͯ ͘ Δ ΢ Σ ϒ ͷ σ β Π ϯ

Slide 37

Slide 37 text

ΘΕ Β จࣈ Ϋ ϥ ε λ ͷ ग़൪ͩ

Slide 38

Slide 38 text

Content is King By Bill Gates 1996 ί ϯ ς ϯ π ɾ Π ζ ɾ Ω ϯ ά © 2 0 0 1 M i c r o s o f t C o r p o r a t i o n . A l l r i g h t s r e s e r v e d . Te r m s o f U s e

Slide 39

Slide 39 text

Τ σ Ο τ Ϧ Ξ ϧͷ ࿹ͷ ݟͤॴ

Slide 40

Slide 40 text

Instagram や Airbnb などの UI デザインに見る新しい トレン ド | UX MILK http://uxmilk.jp/48364 ༨෼ͳ ΋ ͷ͕࡟ ͗མͱ ͞ Ε ͍ͯ ͘ Π ϯ λ ʔ ϑ Σ Π ε

Slide 41

Slide 41 text

The Future of Mobile Content: Facebook Instant Articles vs. Google AMP http://www.business2community.com/brandviews/upwork/future-mobile-content-facebook-instant-articles-vs-google-amp-01589166#E86CERx0y6rvcIQt.97 ί ϯ ς ϯ π ͸ ͻ ͱ Γ Ͱʹग़า ͘ Α ͏ ʹͳ ͬ ͨ

Slide 42

Slide 42 text

࠷ޙʹ࢒Δ ͷ ͸ ฤू ͱ λ Π ϙ ά ϥ ϑ Ο

Slide 43

Slide 43 text

Typography is King Content is King, in other words, λ Π ϙ ά ϥ ϑ Ο ɾ Π ζ ɾ Ω ϯ ά

Slide 44

Slide 44 text

ະདྷ͸໌ Δ ͍

Slide 45

Slide 45 text

Enjoy, editorial !

Slide 46

Slide 46 text

おわり 。