SlideShare una empresa de Scribd logo
1 de 29
Descargar para leer sin conexión
2 0 1 5 . 0 4 . 1 7
第 3 2 回 デ ザ イ ン 勉 強 会
「 w e b 制 作 の プ ロ ト タ イ ピ ン グ ツ ー ル 」
F a c e b o o k : t a k a s h i . k i t a m u r a . 9 9
T w i t t e r :   @ t a h _ t i m i n g
T I M I N G  北 村 崇
東 京 都 在
ロ ゴ マ ー ク 、 キ ャ ラ ク タ ー 、 グ ッ ズ 、 グ ラ フ ィ ッ ク デ ザ イ ン を 中 心
に 活 動 を 開 始 し 、 現 在 は W e b デ ザ イ ン 、 デ ィ レ ク シ ョ ン な ど も
行 っ て い る 。
「 W o r d P r e s s 『 テ ー マ カ ス タ マ イ ズ 』 徹 底 攻 略 」
「 W o r d P r e s s デ ザ イ ン の メ ソ ッ ド 」
  他
I n s t a g r a m : t a h _ t i m i n g
C h a r a c t e rL o g o m a r k
G r a p h i c D e s i g n
F l y e r P o s t e r G o o d s
W e b s i t e
C S M
W r i t e r
S p e a k e r
h t t p : / / t i m i n g - d e s i g n . j p /
デ ザ イ ン 勉 強 会 @ 赤 羽
次 回 : 5 月 中 旬   1 9 : 3 0 ∼ 2 1 : 0 0
内 容 未 定
W o r d C o m m u n i t y C h a n n e l / ス ク ー
h t t p : / / s c h o o . j p /
次 回 : 未 定
プ ロ ト タ イ プ ?
試 作 や 原 型
W e b 制 作 の プ ロ ト タ イ プ ?
な ぜ 作 る の か
スマホ•タブレット対応
触る
動く
U I
ユ ー ザ ビ リ テ ィ テ ス ト
コ ス ト の 削 減
設 計 と し て の 本 来 の デ ザ イ ン
本 来 の デ ザ イ ン
デ ザ イ ン は
見 た 目 じ ゃ な い の
プ ロ ト タ イ プ 作 成 の 方 法
当 然 で す が 一 例 で す
ペーパープロトタイピング
手 書 き す る だ け で O K
ま と め て い る ブ ロ グ な ど
i P h o n e 6 と か も あ っ た り
配 布 し て い る と こ ろ も あ る
プロトタイピングツール
簡 単 に 作 れ る も の
F r a m e r S t u d i o
ス ク リ プ ト で 細 か く 動 か す も の
P r o t t
F L I N T 0
その他ツールの応用
動 き だ け 作 っ て み せ る
B o o t s t r a p
C S S フ レ ー ム ワ ー ク な ど
A d o b e F l a s h
K e y n o t e
P i n g e n d o
と い う こ と で や っ て み よ う
プ ロ ト タ イ プ に つ い て 考 え る
プ ロ ト タ イ プ の 使 い 方
プ ロ ト タ イ プ の 機 能
プ ロ ト タ イ プ に 使 え そ う な も の

Más contenido relacionado

Similar a 第32回デザイン勉強会 「web制作のプロトタイピングツール」

20150417デザイン勉強会33
20150417デザイン勉強会3320150417デザイン勉強会33
20150417デザイン勉強会33Takashi Kitamura
 
バグなんて見逃しちゃえ
バグなんて見逃しちゃえバグなんて見逃しちゃえ
バグなんて見逃しちゃえssuser0be501
 
イマドキWEBデザイン/140712fsumi
イマドキWEBデザイン/140712fsumiイマドキWEBデザイン/140712fsumi
イマドキWEBデザイン/140712fsumiTakashi Kitamura
 
html5nagoya #11 デザインツールのあれこれ
html5nagoya #11 デザインツールのあれこれhtml5nagoya #11 デザインツールのあれこれ
html5nagoya #11 デザインツールのあれこれTakashi Ishihara
 
【採用ドキュメント】エンジニアサイド_1.3.1 .pdf
【採用ドキュメント】エンジニアサイド_1.3.1 .pdf【採用ドキュメント】エンジニアサイド_1.3.1 .pdf
【採用ドキュメント】エンジニアサイド_1.3.1 .pdfvisumoInc
 
WP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura TahWP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura TahTakashi Kitamura
 
赤外線センサーを使ったインタラクティブコンテンツ
赤外線センサーを使ったインタラクティブコンテンツ赤外線センサーを使ったインタラクティブコンテンツ
赤外線センサーを使ったインタラクティブコンテンツTakehisa Ikeda
 
Bottle使ってPython学習一緒にはじめませんか?
Bottle使ってPython学習一緒にはじめませんか?Bottle使ってPython学習一緒にはじめませんか?
Bottle使ってPython学習一緒にはじめませんか?Tatsuya Shinozuka
 
eXtreme planning porker
eXtreme planning porkereXtreme planning porker
eXtreme planning porkerEiichiro Ogura
 
気の合う人達と社外で社内勉強会
気の合う人達と社外で社内勉強会気の合う人達と社外で社内勉強会
気の合う人達と社外で社内勉強会Yu Shibatsuji
 
ペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプShuhei Iitsuka
 
5分でわかった気になるインセプションデッキ
5分でわかった気になるインセプションデッキ5分でわかった気になるインセプションデッキ
5分でわかった気になるインセプションデッキTakao Oyobe
 
音声認識超比較、各社コグニティブサービス全部入り
音声認識超比較、各社コグニティブサービス全部入り音声認識超比較、各社コグニティブサービス全部入り
音声認識超比較、各社コグニティブサービス全部入りtakuino
 
oTreeの概要と実験方法の展開可能性について
oTreeの概要と実験方法の展開可能性についてoTreeの概要と実験方法の展開可能性について
oTreeの概要と実験方法の展開可能性についてAkira Goto
 
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25Tomonori Watanabe
 
すごいタスク管理(仮)
すごいタスク管理(仮)すごいタスク管理(仮)
すごいタスク管理(仮)Kakigi Katuyuki
 
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」tokyorgirls
 
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋machidalovers
 
どたばたかいぎ成果発表
どたばたかいぎ成果発表どたばたかいぎ成果発表
どたばたかいぎ成果発表Eric Sartre
 

Similar a 第32回デザイン勉強会 「web制作のプロトタイピングツール」 (20)

20150417デザイン勉強会33
20150417デザイン勉強会3320150417デザイン勉強会33
20150417デザイン勉強会33
 
バグなんて見逃しちゃえ
バグなんて見逃しちゃえバグなんて見逃しちゃえ
バグなんて見逃しちゃえ
 
イマドキWEBデザイン/140712fsumi
イマドキWEBデザイン/140712fsumiイマドキWEBデザイン/140712fsumi
イマドキWEBデザイン/140712fsumi
 
html5nagoya #11 デザインツールのあれこれ
html5nagoya #11 デザインツールのあれこれhtml5nagoya #11 デザインツールのあれこれ
html5nagoya #11 デザインツールのあれこれ
 
【採用ドキュメント】エンジニアサイド_1.3.1 .pdf
【採用ドキュメント】エンジニアサイド_1.3.1 .pdf【採用ドキュメント】エンジニアサイド_1.3.1 .pdf
【採用ドキュメント】エンジニアサイド_1.3.1 .pdf
 
WP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura TahWP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura Tah
 
赤外線センサーを使ったインタラクティブコンテンツ
赤外線センサーを使ったインタラクティブコンテンツ赤外線センサーを使ったインタラクティブコンテンツ
赤外線センサーを使ったインタラクティブコンテンツ
 
Bottle使ってPython学習一緒にはじめませんか?
Bottle使ってPython学習一緒にはじめませんか?Bottle使ってPython学習一緒にはじめませんか?
Bottle使ってPython学習一緒にはじめませんか?
 
eXtreme planning porker
eXtreme planning porkereXtreme planning porker
eXtreme planning porker
 
気の合う人達と社外で社内勉強会
気の合う人達と社外で社内勉強会気の合う人達と社外で社内勉強会
気の合う人達と社外で社内勉強会
 
ICT Letter - season 2 -
ICT Letter - season 2 -ICT Letter - season 2 -
ICT Letter - season 2 -
 
ペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプ
 
5分でわかった気になるインセプションデッキ
5分でわかった気になるインセプションデッキ5分でわかった気になるインセプションデッキ
5分でわかった気になるインセプションデッキ
 
音声認識超比較、各社コグニティブサービス全部入り
音声認識超比較、各社コグニティブサービス全部入り音声認識超比較、各社コグニティブサービス全部入り
音声認識超比較、各社コグニティブサービス全部入り
 
oTreeの概要と実験方法の展開可能性について
oTreeの概要と実験方法の展開可能性についてoTreeの概要と実験方法の展開可能性について
oTreeの概要と実験方法の展開可能性について
 
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25
DIST.17「こんなに変わる!npmとwebpackを使ってWEB開発をもっとラクに。」2017.08.25
 
すごいタスク管理(仮)
すごいタスク管理(仮)すごいタスク管理(仮)
すごいタスク管理(仮)
 
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
 
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
 
どたばたかいぎ成果発表
どたばたかいぎ成果発表どたばたかいぎ成果発表
どたばたかいぎ成果発表
 

Más de Takashi Kitamura

38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」
38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」
38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」Takashi Kitamura
 
「人にやさしいデザイン(はモテる)」
「人にやさしいデザイン(はモテる)」「人にやさしいデザイン(はモテる)」
「人にやさしいデザイン(はモテる)」Takashi Kitamura
 
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」Takashi Kitamura
 
WordCamp Tokyo2015 (Lt kitamura)
WordCamp Tokyo2015 (Lt kitamura)WordCamp Tokyo2015 (Lt kitamura)
WordCamp Tokyo2015 (Lt kitamura)Takashi Kitamura
 
2014/03/29 WordBench TOKYO
2014/03/29 WordBench TOKYO2014/03/29 WordBench TOKYO
2014/03/29 WordBench TOKYOTakashi Kitamura
 
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMOTakashi Kitamura
 

Más de Takashi Kitamura (8)

38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」
38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」
38回/デザイン勉強会@赤羽「これからはじめるWebデザイン〜Webデザイナーに必要なもの〜」
 
「人にやさしいデザイン(はモテる)」
「人にやさしいデザイン(はモテる)」「人にやさしいデザイン(はモテる)」
「人にやさしいデザイン(はモテる)」
 
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
 
WordCamp Tokyo2015 (Lt kitamura)
WordCamp Tokyo2015 (Lt kitamura)WordCamp Tokyo2015 (Lt kitamura)
WordCamp Tokyo2015 (Lt kitamura)
 
2014/03/29 WordBench TOKYO
2014/03/29 WordBench TOKYO2014/03/29 WordBench TOKYO
2014/03/29 WordBench TOKYO
 
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO
2014/02/01 WP-D Fes #01(sat) Megane Fes in GMO
 
W ctokyo2012 timing
W ctokyo2012 timingW ctokyo2012 timing
W ctokyo2012 timing
 
Osc2012tokyo timing
Osc2012tokyo timingOsc2012tokyo timing
Osc2012tokyo timing
 

第32回デザイン勉強会 「web制作のプロトタイピングツール」

  • 1. 2 0 1 5 . 0 4 . 1 7 第 3 2 回 デ ザ イ ン 勉 強 会 「 w e b 制 作 の プ ロ ト タ イ ピ ン グ ツ ー ル 」
  • 2. F a c e b o o k : t a k a s h i . k i t a m u r a . 9 9 T w i t t e r :   @ t a h _ t i m i n g T I M I N G  北 村 崇 東 京 都 在 ロ ゴ マ ー ク 、 キ ャ ラ ク タ ー 、 グ ッ ズ 、 グ ラ フ ィ ッ ク デ ザ イ ン を 中 心 に 活 動 を 開 始 し 、 現 在 は W e b デ ザ イ ン 、 デ ィ レ ク シ ョ ン な ど も 行 っ て い る 。 「 W o r d P r e s s 『 テ ー マ カ ス タ マ イ ズ 』 徹 底 攻 略 」 「 W o r d P r e s s デ ザ イ ン の メ ソ ッ ド 」   他 I n s t a g r a m : t a h _ t i m i n g
  • 3. C h a r a c t e rL o g o m a r k G r a p h i c D e s i g n F l y e r P o s t e r G o o d s W e b s i t e C S M W r i t e r S p e a k e r
  • 4. h t t p : / / t i m i n g - d e s i g n . j p / デ ザ イ ン 勉 強 会 @ 赤 羽 次 回 : 5 月 中 旬   1 9 : 3 0 ∼ 2 1 : 0 0 内 容 未 定 W o r d C o m m u n i t y C h a n n e l / ス ク ー h t t p : / / s c h o o . j p / 次 回 : 未 定
  • 5. プ ロ ト タ イ プ ?
  • 6. 試 作 や 原 型
  • 7.
  • 8.
  • 9. W e b 制 作 の プ ロ ト タ イ プ ?
  • 10. な ぜ 作 る の か
  • 14. U I
  • 15. ユ ー ザ ビ リ テ ィ テ ス ト
  • 16. コ ス ト の 削 減
  • 17. 設 計 と し て の 本 来 の デ ザ イ ン
  • 18. 本 来 の デ ザ イ ン
  • 19. デ ザ イ ン は 見 た 目 じ ゃ な い の
  • 20. プ ロ ト タ イ プ 作 成 の 方 法
  • 21. 当 然 で す が 一 例 で す
  • 23. 手 書 き す る だ け で O K ま と め て い る ブ ロ グ な ど i P h o n e 6 と か も あ っ た り 配 布 し て い る と こ ろ も あ る
  • 25. 簡 単 に 作 れ る も の F r a m e r S t u d i o ス ク リ プ ト で 細 か く 動 か す も の P r o t t F L I N T 0
  • 27. 動 き だ け 作 っ て み せ る B o o t s t r a p C S S フ レ ー ム ワ ー ク な ど A d o b e F l a s h K e y n o t e P i n g e n d o
  • 28. と い う こ と で や っ て み よ う
  • 29. プ ロ ト タ イ プ に つ い て 考 え る プ ロ ト タ イ プ の 使 い 方 プ ロ ト タ イ プ の 機 能 プ ロ ト タ イ プ に 使 え そ う な も の