SlideShare a Scribd company logo
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
と い う こ と で や っ て み よ う
プ ロ ト タ イ プ に つ い て 考 え る
プ ロ ト タ イ プ の 使 い 方
プ ロ ト タ イ プ の 機 能
プ ロ ト タ イ プ に 使 え そ う な も の

More Related Content

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

20150417デザイン勉強会33
20150417デザイン勉強会3320150417デザイン勉強会33
20150417デザイン勉強会33
Takashi 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 .pdf
visumoInc
 
WP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura TahWP-D Fes03 Osaka Kitamura Tah
WP-D Fes03 Osaka Kitamura Tah
Takashi 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
 
ICT Letter - season 2 -
ICT Letter - season 2 -ICT Letter - season 2 -
ICT Letter - season 2 -
Kazuo Nakanishi
 
ペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプペルソナシナリオとプロトタイプ
ペルソナシナリオとプロトタイプ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.25
Tomonori Watanabe
 
すごいタスク管理(仮)
すごいタスク管理(仮)すごいタスク管理(仮)
すごいタスク管理(仮)
Kakigi Katuyuki
 
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
Tokyo.R女子部発表スライド「Rではじめるデータ解析の超基礎」
tokyorgirls
 
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
backlogを使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
machidalovers
 
どたばたかいぎ成果発表
どたばたかいぎ成果発表どたばたかいぎ成果発表
どたばたかいぎ成果発表
Eric Sartre
 

Similar to 第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を使ったテレワーク時代の社員教育「遠隔徒弟制度」 株式会社テンタス小泉智洋
 
どたばたかいぎ成果発表
どたばたかいぎ成果発表どたばたかいぎ成果発表
どたばたかいぎ成果発表
 

More from 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
 

More from 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. プ ロ ト タ イ プ に つ い て 考 え る プ ロ ト タ イ プ の 使 い 方 プ ロ ト タ イ プ の 機 能 プ ロ ト タ イ プ に 使 え そ う な も の