だから、Webディレクターはやめられない Z
-
Upload
yasufumi-nishiyama -
Category
Internet
-
view
1.227 -
download
0
description
Transcript of だから、Webディレクターはやめられない Z
![Page 1: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/1.jpg)
SaCSS vol.58 2014.09.27 (Sat) at 札幌市民ホール会議室
だから、 Webディレクターは やめられない
![Page 2: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/2.jpg)
自己紹介
![Page 3: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/3.jpg)
西山 泰史 にしやま やすふみ
株式会社ジャクスタポジション 札幌市在住のWebディレクター Movable Type でのサイト構築 2013年よりMT蝦夷を主宰 三度の飯より食べることが好き
![Page 4: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/4.jpg)
• 2004年4月創業
• Webサイト構築/システム開発などそこそこ規模の企業サイト/ECサイトなど
• 主に外部スタッフ(フリーランス)とチームを編成
• CMS(主にMovable Type)を利用した実績が多数
![Page 5: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/5.jpg)
ジャクスタと言えば
![Page 6: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/6.jpg)
Webデザイナーのためのショッピングカート
SKELETON CART http://skeleton.juxtaposition.jp/ !Movable Typeの画像アップロード機能補助プラグイン
ImageUploadUtility http://skeleton.juxtaposition.jp/image-upload-utility/
![Page 7: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/7.jpg)
西山と言えば
![Page 8: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/8.jpg)
ラーメン!
![Page 9: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/9.jpg)
ミッションコンプリート
![Page 10: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/10.jpg)
本題へ戻しましょう
![Page 11: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/11.jpg)
Director’s Night から1年
![Page 12: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/12.jpg)
「Webディレクター」という肩書とその役割
http://f-shin.net/fsgarage/2156
![Page 13: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/13.jpg)
LIGさんのサイトで 紹介されちゃった。
![Page 14: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/14.jpg)
ディレクターに注目が集まりつつある? !
そんな今だからこそ あらためて、Webディレクターの仕事、 そのあるべきカタチを考えてみたい
![Page 15: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/15.jpg)
こんな経験ありませんか?
![Page 16: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/16.jpg)
友:西山ってさ、何の仕事してんの?
:Webサイト作ってるよ。
友:あぁ、Webデザイナーね!
:うん、まぁ、そうじゃないんだけどね。
友:でも、ホームページ作ってるんでしょ?
:うん、まぁ、そうだよね。
友:んじゃ、やっぱWebデザイナーじゃん。
:うん、まぁ、だいたいあってる。
![Page 17: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/17.jpg)
Director’s Night 終了後のアンケートより
![Page 18: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/18.jpg)
ワタシ、Webディレクターやってます誰もがそう自信を持って言える世の中にしよう
でもそのためにはしっかりと「ディレクション」をしないとね !
あと…毎日飲み歩いているわけではありません…念のため
![Page 19: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/19.jpg)
本日のお品書きWebディレクターってなんだ? Webディレクターに必要な能力 Webディレクターの心構え Webディレクターにありがちな罠 Webディレクターの仕事、楽しい?
![Page 20: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/20.jpg)
Webディレクターってなんだ?ディレクションという仕事の「おさらい」
![Page 21: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/21.jpg)
Webディレクターという仕事
2004年4月当初 …日本全国総Webデザイナー時代
↓ 約10年 ↓2013年の時点では …まだまだ業務分担がはっきりしない
IT/Web系企業の代表=ホリエモン
![Page 22: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/22.jpg)
いつからWebディレクター?① 案件規模が拡大 ② 制作に関わるメンバーが増える ③ お客さんとの連絡(≒営業) ④ メンバーとの連絡 ⑤ スケジュールの管理
→ ディレクター誕生の瞬間 (業務の延長型)
![Page 23: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/23.jpg)
または
![Page 24: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/24.jpg)
いつからWebディレクター?① 上司に呼び出される ② 君、明日からディレクターね♥ ③ Σ(・∀・;)
→ ディレクター誕生の瞬間 (キャリアパス型)
![Page 25: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/25.jpg)
業務を回す人=ディレクター(現場監督)
![Page 26: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/26.jpg)
Webサイト制作会社の業務
現状把握 戦略策定
構築作業完成
(終わらないけど
)
サイト設計
![Page 27: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/27.jpg)
① 問題(依頼)の本質 → リニューアルすれば良くなる?
現状把握(ヒアリング)
② 組織の横のつながりを把握 → 部署同士の「言った/言わない」など
③ 社内の雰囲気づくり(周知) → みんなでやりますよー!
④ その他、競合調査/ログ分析などなど
![Page 28: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/28.jpg)
① プロジェクトの目標(中間目標) → 売上?資料請求?求人?などなど
戦略策定(プランニング)
② ユーザーニーズの把握 → 必要とされている情報って?
③ サイト構成チャート(情報整理)の設計 → 目的達成のための施策
![Page 29: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/29.jpg)
サイト設計
① ワイヤーフレーム → UI/UX、レイアウト案
② 原稿や素材の手配
③ スタッフのアサイン → デザイナー、プログラマー、ライター、カメラマンなどなど
④ レギュレーション策定 → HTML/CSSルール、ターゲットブラウザなどなど
![Page 30: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/30.jpg)
構築作業・テスト
① デザイン/モックの確認 → PSDとか、仮HTMLとか
② プロトタイプの制作(動作確認) → スマートフォンサイトなど
③ スケジュール・進捗管理 → プロジェクト管理ツールなど
![Page 31: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/31.jpg)
完成 終わりじゃないけど
![Page 32: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/32.jpg)
Webディレクターの業務
戦略を練る
基本設計詳細設計
制作作業
修正対応
見積もり
スケジュール作成
進捗管理
文章作成
資料準備
議事録作成
打ち合わせアジェンダ
飲み会幹事
請求書作成
電話応対 コピーライティング悩み相談
![Page 33: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/33.jpg)
デザイナー/プログラマーなど 専門職以外の仕事全般
![Page 34: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/34.jpg)
何でも屋=Webディレクター
だったら「デキる何でも屋」になりたい
![Page 35: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/35.jpg)
Photoshop/illustrator、バッチリです! もちろん、HTML5/CSS3、jQueryもOK! PHPもメールフォームぐらいならやります!
もちろん出来たほうが良いけど…
![Page 36: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/36.jpg)
Webディレクターにとって本当に必要なのは Webでどんなことができるか
それを提案する能力に長けていること そしてそれを実行(目的達成)する能力
![Page 37: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/37.jpg)
Webディレクターに必要な能力ディレクターが養うべき「8つの能力」
![Page 38: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/38.jpg)
責任感
① お客さんはもちろん関わる人にコミット → この仕事は「自分(達)がやるもの」という意識
② 責任は取るものではなく果たすもの → なにがなんでも自分でやってやる!は正解?
③ 提案のできない作業者はディレクターではない → やらされているのではなく「やっている」
![Page 39: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/39.jpg)
① 逃げ道を作らない → 誰かが言ったからという「責任転嫁」
意志の強さ
② 人の話に流されず取りまとめるのが仕事 → いろいろな意見を聞くのが仕事だけど、 それに惑わされるだけなら「優柔不断」
③ ディレクターたるものリーダーたれ → 指揮棒を振るのは誰なのか
![Page 40: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/40.jpg)
好奇心・向上心
① Web以外のことも知る → Webの知識を蓄えるのは当たり前 お客さんの要望をジャッジする必要がある
② 法律やセキュリティの基礎も大切 → 個人情報保護方針、SSL暗号化通信
③ すべてが自分でできる必要はない → 人の力を借りよう。でも「知らない」のはNG
![Page 41: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/41.jpg)
決断力・コミュニケーション能力
① 常にジャッジが伴う → 要望に対し好き嫌いじゃなく 目的や予算、スケジュールなどを踏まえて考える
② 相手に理解してもらおうという気持ち → 専門用語、略称、横文字の羅列 → 押し付けになっていないか
③ 都合のいい事を言わない → 信頼関係が大切、間違いがあれば謝ること 他人の助けがあって実現できていると意識する
![Page 42: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/42.jpg)
提案力・実行力ここまでの6つの能力が
この提案力と実行力へとつながる
![Page 43: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/43.jpg)
Webディレクターの心構えディレクターはどう行動するべきか
![Page 44: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/44.jpg)
自分が存在する価値ってなんだ? なぜその存在が必要なんだ?
連絡係・伝書鳩に出来ないこと=ホウレンソウ !
今何がどうなっているかを報告 今後のスケジュールを常に連絡 心配ごとがあるなら事前に相談
![Page 45: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/45.jpg)
時間と目的=中長期的な目標を意識する
自分の仕事は後回しにできるけど、 人の仕事は後回しにしちゃいけない !
忙しいのは自分だけじゃない 人の時間を預っているという意識をもつ
![Page 46: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/46.jpg)
自分一人と思わず、メンバーを信頼して任せる
技術的なことだけじゃなく お互いを認め合える関係性を作る
受け身にならなず自分をもち、 指示を待つのではなく自ら動く
![Page 47: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/47.jpg)
徹夜しなければならない状況を作らない クライアント側をもコントロール
!
スタッフを守るのもディレクターの仕事
事前の準備・段取り・先回り
![Page 48: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/48.jpg)
忙しい時ほどしっかり仕事する 資料やドキュメントをまとめる
① 期限を守るため ② 指示をカタチに残すため ③ 議事録(メモ)をシェアするため
![Page 49: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/49.jpg)
間違えを認めること 迷惑をかけないために
![Page 50: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/50.jpg)
Webディレクターにありがちな罠ディレクションにまつわる「あるある話」
![Page 51: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/51.jpg)
【1】なんかこのデザイン、違うやっと担当者からOKもらったのに、意思決定者がNG
![Page 52: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/52.jpg)
クライアントチェックを減らす → 承認する際に意思決定者にも参加してもらう
Webデザイナーとよく話し、その意図を理解する → 意思決定者に対して、その意図を説明する
![Page 53: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/53.jpg)
【2】お客さんが時間を守らない資料がまだ届かない → スタッフ待機 → いつ着手? → 資料到着次第で!
→ 結局リスケ(他の仕事できたのに…) → スタッフに怒られる
![Page 54: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/54.jpg)
なぜそのスケジュールなのか、 それが遅れるとどうなるのか、 お客さんと目標を共有することが大切
![Page 55: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/55.jpg)
【3】公開日に間に合わないローンチ直前、手に汗握るスリリングな1日
![Page 56: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/56.jpg)
中長期のスケジュール管理ができていない → 最終的になんとかなる(寝なければ?
バタバタからのリスケ → 管理が行き届かずクオリティの低下
お客さんの要望を丸呑み(追加追加で納期変わらず) → 断り方を忘れてしまったディレクター
スタッフもお客さんも泣く → 誰が得するのか、回避することはできなかったのか
![Page 57: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/57.jpg)
Director’s Night 終了後のアンケートより
コンティンジェンシーとは 事件・事故・災害などの不測の事態が発生することを想定し、 その被害や損失を最小限にとどめるために、あらかじめ定めた対応策や行動手順のこと。
![Page 58: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/58.jpg)
Webディレクターの仕事、楽しい?そんなに大変なのに喜びってあるの?
![Page 59: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/59.jpg)
でも大変なのはどんな仕事だって同じ。 !
「やらされている」じゃなく この仕事をやっていると思えるかどうかで 楽しいと思えるかどうかが決まる。
Webディレクターの仕事ってとにかく大変
![Page 60: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/60.jpg)
【1】自分のイメージしたWebをカタチにできる
これほど楽しい仕事はない!と思えるポイント
【2】お客さんや仲間と喜びを分かち合える いろいろな人と出会える、一緒に仕事できる
【3】Webディレクターは何にもできない何でも屋 常に新しいことにチャレンジできる
![Page 61: だから、Webディレクターはやめられない Z](https://reader038.fdocuments.net/reader038/viewer/2022102608/558a39e0d8b42ab31d8b46e8/html5/thumbnails/61.jpg)
だから私も Webディレクターを やめられない
「だから、Webディレクターはやめられない」 これは島元大輔さんの書籍から引用しています。
http://amzn.to/11wkodP