Top Banner
デザインの前の デザイン CSS Nite in SAPPORO, Vol.4 有限会社リーグラフィ 水越 佑介
32

デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

May 27, 2020

Download

Documents

dariahiddleston
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

デザインの前のデザイン

CSS Nite in SAPPORO, Vol.4有限会社リーグラフィ 水越 佑介

Page 2: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

水越 佑介有限会社リーグラフィ制作チームリーダー

Webサイトを作ること、Webに限らず「デザイン」が好き。森、山、植物が好き。Twitter : yumizuFacebook : yumizu8624

Page 3: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

「木」はやる気の木でもあります。

Page 4: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

デザインの前のデザインとは?

受注を受けてからマウスを動かす前まで

Page 5: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

デザインできました!

デザイナー

Page 6: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

STOP!思ってたのと違う!

by デザイナー以外

Page 7: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

どんなズレが発生しているか?

スケジュールのズレ

機能のズレ

デザインのズレ

Webデザイナーならでは

Page 8: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

ズレを解消するには?

Page 9: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

チームで意識共有

お客さん

ディレクター

コーダー

デザイナー

ズレを解消するには?

Page 10: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

その1「現状」その2「 Webサイトの仕様」その3「 制作スケジュール」

ズレを解消するには?

チームで意識共有

Page 11: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

サイトマップ(概略)簡易スケジュールを

ズレを解消するには?

共有!

Page 12: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

もっとズレをなくす、デザインの前のデザインとは。

Page 13: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

ズレのないデザインはこうしてできる!

ズレを解消するには?

Page 14: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

業界標準デファクトスタンダード(業界標準)の知識と情報を得る

それ、常識だよ?

ズレを解消するには?

Page 15: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

鉛筆の戦(失敗の繰り返し)

ズレを解消するには?

Page 16: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで
Page 17: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

何度も紙に書いて考えをまとめる。

Page 18: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

デザインの前のデザイン事例

具体的に、僕がどう動いたか。

Page 19: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

リアルなお客さんになってみよう。

消費者目線になる会社のサービスを受けてみる

Page 20: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

要望: スピーディで高級感のあるデザインKENT HOUSEhttp://www.kent-inc.co.jp/

Page 21: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

モデルハウスに行く(場の雰囲気、形、色を見る、社員の顔を知る)

デザインの実験をする

Page 22: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで
Page 23: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで
Page 24: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

要望:センスを発揮してほしい

inZONEhttp://www.inzone.jp/

Page 25: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

ショップに行く商品を買う、使うインテリアショップ巡りその他おしゃれショップ巡り

Page 26: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで
Page 27: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

要望:エステのような大人のエレガントさNAIL PLACE ARChttp://www.np-arc.com/

Page 28: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

ネイルをする(さすがにケアだけ)

Page 29: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

雑誌を見る性別を超えた視点を得る

Page 30: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

どのデザインも大きな修正はなく、打ち合わせは3~4回ほどで終わった

Page 31: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

リアルな体験をしてデザインの前のデザインをすることで、説明を加えなくてもみんなが納得してくれるデザインが提案できる。

Page 32: デザインの前の デザイン - CSS Nite in Sapporo · 制作チームリーダー ... デザインの前のデザインとは? 受注を受けてから マウスを動かす前まで

ありがとうございました。

有限会社リーグラフィ水越 佑介