Webディレクションやってます blog

名村ですが、一昨年、宮崎県で「Webプロデューサー養成講座」の講師をさせていただきました。
その流れで、「Webプロデューサー要請構成」のセミナーを鳥取でも開催するという企画が立ち上がり、講師としてお声がけをいただきましたので、1月末に鳥取で「Webプロデューサー養成講座」の講師をさせていただきました。

一昨年の宮崎では10日間を6人の講師という内容だったのですが、今回は僕一人で3日間、という講座内容となりました。
あっ、ブログに書くタイミングを逃してしまいましたが、昨年の秋にも、同じく名村一人で3日間の「Webプロデューサー養成講座」を宮崎でさせて頂きました。

ということで、3日間の講座はこれで2回目になりますね。
今回の鳥取も、前回の宮崎も3日間なのですが、もともとが名村が以前から全5日間の内容でやっていたセミナーのカリキュラムを、3日間に圧縮しているので、若干端折っている部分とかもあるのですが、それでもなかなか中身の濃い3日間になりました。

---

---

今回の鳥取では受講生の方が既に現場で仕事をされている方々ががメインということだったので、そういう方々の温度感とかどこに疑問を持つのか？ってのは毎回悩むのですが、その部分を今回も一番考えながらさせていただきました。

そんな中今回は、15名の参加をいただきました。
この「15名」って人数ですが、最終日にワークショップをすることにしているので、これぐらいの人数を上限にしてもらっているんです。

初日はほとんどが座学になります。
朝の10時から4時半ぐらいまでずっと基本は座学なのですが、セミナーとして最初に伝えてご理解いただきたい内容ではあるので、ここだけはいつも長々話をさせていただくのですが、お付き合いをいただいています。
その後夕方からはアイデア発想法のため、5人ぐらいのチームに別れていただいて、ワークショップを実施。

---

毎回皆さんがいろいろ出してくれるアイデアを見ながら楽しませて頂いてるのですが、僕はそのアイデアそのものに対してどうこうという訳ではなくて、発想法の使い方の方が重要なのでそこには各班を回ってちゃちゃ入れをさせていただいています。

二日目は実際の仕事の上で、「ヒアリング」をおこなう上でのいろいろな注意点をお伝えして、問題の整理〜企画を作っていくまでの手段をお伝えしていきます。

その後15時前ぐらいから最終的なワークショップを開始。
このワークショップが一番メインになってきます。
内容としては、色々なビジネス的な数字もひと通り全部作った上で、あるクライアント役に名村がなります。
その名村相手にヒアリングを実施して、企画を作っていただき、プレゼンまでしていただくのがこの養成講座の最終的なゴールとなります。

---

3日目はほぼプレゼンの準備等に費やしていただくのですが、鳥取のこのセミナーでは、受講いただいた方のアプトプットがとてもレベルの高い内容でした。
正直びっくりしてしまって、普通に良い企画が沢山出てきました。

もちろん、ヒアリングをしてから、企画発表まで実質まる1日、セミナー会場での滞在時間で言えば5、6時間ぐらいしかないので、時間的な制約が相当厳しいですし、しかもチームを組んだのはそのセミナーで初めて会った人たち。
そういった制約の中で、今回の鳥取のセミナーに参加いただいた方々は、元々の地力が高い方々だったのだと思いますが、素晴らしい企画が出てきました。

ただ、「営業」的な側面とか、仕事を「勝ち取る」って部分での強さ弱さってのがあったので、そこにセミナーの主宰の方からの指摘が入りはしました。

ということで、3日間、なかなか濃い時間を過ごさせて頂きましたが、このセミナーを受講いただいたあと、最終的には「普段の仕事がしやすくなる」「今の仕事が次の仕事につながる」といったことに繋がっていっていただくのがメインです。

一昨年の宮崎のセミナーは10日間でしたし、名村よりももっとスゴイ内容をお伝えしている講師の方が5人もいて、充実度についても「10日分」というアドバンテージはあるのかもしれませんが、それでもそのセミナーからの2年間で、セミナーを受けた宮崎の方々の何社さんかは既に東京からの仕事を受注するようになったりします。

その流れって、ある意味では東京でやっている自分自身ももっと頑張らないといけない状況を作っているのですが、それでも、最終的に日本のWebサイトが良くなればいいと思っていますし、僕自身も自分たちの作っているものがちゃんとクライアントや世で価値のあるもの、と認められるようなモノを作っていくように、と思っています。

そういった「Webサイトの作り方」というよりも名村が考えている「Webという媒体を（主に）使って仕事をしていく上での進め方」ってのが何かしらお役に立てはそれはとても嬉しいですし、今後ご一緒に仕事をさせていただけるようになれば、もっとうれしいです。

ということで、これからも「Webプロデューサー・ディレクター養成講座」は細々と続けていますので、ご用命あれば、お気軽にご連絡ください！

---

関連タグ：講師 

先日m-schoolさんでやっている「ここがすごい！CSS3入門講座」を受講してきました。
講師は関西つながりでもある森 和恵（もり かずえ）さん。
講座名で受講を決めたので、講師が誰かを知ったのは当日の午前中だったという（笑）

内容は実際に手を動かす内容もあり、カリキュラム的にも入門講座として疑問に思っていたところが網羅されていて、講師の森さんも教え上手で、とてもいい内容でした。

で、こういった技術系のセミナーをガッツリ受けるのは、実は結構久しぶり。
色々な理由はあって、

• 自分自身が以前より実装の現場から離れてしまっている。
• 昔より技術の知識習得に対して腰が重くなってきている。
• 何が出来るかよく分からず、動けなくなっていた。

っていうのが結構大きなところ。
どの比率が高いわけでもなく、それぞれがぼんやり絡まって、なかなかそういったセミナーに行くことをしなくなっていた感じです。

使えるHTML5とCSS3、使えないHTML5とCSS3？

特にHTML5とCSS3は完全に食わず嫌いでした。
それにはいくつか理由がやっぱりあって、結局は「勉強していないから」に帰結するんだけど、

• HTML5で追加されたタグの利用価値と内容が分からない。
• CSS3ってグラデーションとかアニメーションとか動画貼り付けとかってあるけど、結局何が「今」使えるのか分からない。

って理由から、「よく分からない」という感覚になっていて、どこから手をつけていいか分からなくなっていました。
まぁ、最初に腰を上げられていなかった、ってことですね。

でも、そう思ってしまっていた理由が、今回のセミナーを受けてやっと晴れてきました。
今回は特にCSS3のセミナーでした。
ですので、CSS3に集約すると、実際「今」出来ることってのはそれほどあるわけではない、ことが分かったのは大きいです。

今回の講習では、

• CSS3とは？
• レイアウト枠を角丸に（border-radius）
• レイアウト枠やテキストに影を指定（box-shadow／text-shadow）
• テキストにWeb Fontsを指定（@font-face）
• レイアウト枠のボーダーに画像を指定（border-image）
• グラデーションボタン（background-image:linear-gradient）
• 透過指定（background:rgba／opacity）
• 背景画像の複数指定やサイズ指定（background-size／Multiple Background）
• 回転させる（transform:rotate）
• ボックスレイアウト（display:box／box-ordinal-group／box-flex）
• アニメーション指定（transition）
• Internet Explorerへの対応
• HTML5について

といったアジェンダ。
一つ一つ半ハンズオンな感じだったので、自分でもコードを触りながらの学習、個々はそれぞれ「すげー、こんなこと出来るようになるのかー！！」ということばかり。

ただ、結局そこには「対応ブラウザ」の壁があります。
少なくとも名村がお手伝いをしているお客様の案件はどう説得しようと

「IEでちゃんとデザインどおりに見えてほしい、だってログ解析の結果、うち（＝お客様のサイト）にくるユーザーのブラウザのほとんどがIEなんだもん。」

という現実。

ということはIEで使えない要素は、文字通り「仕事で使えない」要素になってしまうわけです。
そのサイトをFirefoxやChromeでほとんど見られていないサイトに、「CSS3で角丸を！」といってもそれは「現状は」制作者のエゴや趣味でしかありません。
ですので、何か角丸のデザインを出してお客様がOKを出したら、現状のIEで、しかも下手したらIE6で、角丸を表現する技術を使わないといけない訳です。

そういった理由からまず第一の判断として、

「そうか、CSS3はまだほとんど使えないと思っていてOKだ。」

という判断が自分なりにはっきりしました。

使えない＝使わない？

ここで大事なのは「使えない」から、「使わない」と判断するのではないってこと。
「使えない」という判断がはっきり出来たからこそ、「じゃぁ、分からないように趣味で使っていこう」という研究対象としての位置づけが明確になりました。

全部のブラウザでは使えない時点で、マークアップエンジニアであったり、デザイナーであったりにとって重要になってくるのは、

• どのブラウザ使える要素かを理解している。
• 全体工数の中でどこで使えばいいかの「勘」が働くレベルまで持っていくこと。

です。

最近よく言われる「プログレッシブエンハンスメント」の考え方。
これは2004年ごろにCSSレイアウトを初めてやり始めた時からある考え方です。

事実僕も2004年ごろの現場でまだガリガリHTMLを書いていたころは、

• 自分の知っていて血肉になった技術から実装。
• ブラウザで実際に反映出来る要素、セレクターから実装。

という事をOJTで繰り返していました。
その試行錯誤の結果として身についたのは、技術論ではなくて、

• ここはCSSでレイアウトしても大丈夫。
• ここは、HTMLの冗長化が防げるので、あとで楽そう。

といった所謂「脳内マークアップの勘」です。
この勘が働くか働かないか？ってのは、エンジニアにとっては凄く重要。

それはPHPやPerlなどのアプリケーションエンジニアでも同じ。
どういう変数やクラスを使ってどういうインデックスを張ればいろんな意味で、工数も負荷も下げられてセキュアなコードになるか？を脳内で考えるのが早い人はやっぱり優秀です。

その意味で、これからの時期はその「勘」を磨く時期かな？という判断になりました。
これだけでも、個人的に「やらないといけないんだろうなぁ・・・でも、どこから手をつければいいんだろう・・・」ってフラストレーションが晴れました。

デザイナーとマークアップエンジニアの境界

今回のCSS3の講習を受けて思ったことは他にもありました。
以前のCSSレイアウトは多少の異論はあると思いますが、言ってしまえば「レイアウト」を主とした技術でした。
ですので、デザイナーとマークアップエンジニアの職域は、名村が関わった案件ではある程度の区切りがはっきりありました。

しかし、CSS3の角丸（border-radius）やグラデーション（background-image:linear-gradient）、ドロップシャドウ（box-shadow／text-shadow）などは、デザイナーとマークアップエンジニア同士で、

「画像として作ることを想定しているのか、CSSで実装することを想定しているのか？」

を共有していく方式を取らないと難しいなぁ・・・ということです。

例えばこんなボタンの画像が来たときに、これは結構迷うと思うんですよ。

---

---

このクオリティだったら、CSS3で実装が出来ます。

ただ、一昔前のアクアなデザインのボタンの上のテカリ部分とかを見てみましょう。

---

---

このデザインだった場合、厳密に再現するのは簡単には無理でしょう。


こういった判断をするのが結構難しくなってくるなぁ・・・ということです。
そういった判断をする上でもやはり実際にCSSを書く人が上で書いた使いどころを判断する「勘所」に敏感になっている必要があると思っています。


一方でココがCSS3を使う事をちょっと難しくしているなぁ・・・と思っているのは、じゃぁ、

• デザイナーがCSS3での表現を十分理解していなくてはならないのか？
• CSSコーダーよりデザイナーの方がCSS3での表現を知っていた場合？
• CSSコーダーはデザイナーから上がってきたデザインを独自に判断する？

といった感じで、CSS3の技術はどのレイヤーの人までが知っていればいいのかなぁ？と、思ったりしました。

この境界は以前、マークアップエンジニアがガリガリJavascriptを書く訳ではなかったけど、最近は習得技術となってきている流れのように、今後、CSS3を理解しておくのは、デザイナーも含めて、というような、習得技術の流れがまた変わってくるだろうなぁ・・・と思っています。

やっぱり勉強は大事

今回のCSS3の講座受講と、先日ちょっとしたご縁でHMTL5の勉強会に参加してきたことで、それぞれの概要がなんとなく自分なりに見えてきました。
そういったことから、自分にとっての注力するべき点と、今後の「何を」勉強するか？ってのもおぼろげながら見えてきました。

そういう意味では、勉強はやっぱり大事ですし、その時間は意図して取っていくようにしないと、自分の中も枯渇していきますし、頭がどんどん固くなっていくのを痛感しました。
これからも現場にはいたいと思っているので、ちょっと色々棚卸をして、勉強しなおしていこうと思います。

---

関連タグ：CSS3 HTML5 

先日Twitterで「演劇やダンスを習ってみたい」という友人のツイートをきっかけに、演劇のメソッドを使ったセミナーを開催する事となりました。

このセミナーではCSSとかHTMLとかは全く関係ありません（笑）

内容的には、セミナーとかプレゼントか人前で話をしたりすることがある人もいると思います。
そういった方々の中で「人前に立つと緊張して・・・」って方もいるかと思います。
かくいう僕も相当上がり症です、いや、マジで。

あと、鷹野さんもセミナーとかで時々仰っている「お客さんにお尻を向けないで・・・」ってこと。
これとかも普通は、自分の話す内容に集中しちゃったら、そこまで意識が持って行けないものなんですよね。

と言うこともあって、

• 人前ですらっと立ってみたい。
• お尻をお客さん側に向けずにいられるようになりたい。
• 自分が話す内容に集中しながらも、自分がどのように見られているかを把握してみたい。
• ひいては外面的な立ち姿、歩き方といった事を制御することで、自分の伝えたいこと＝内面を伝えられる助けにしてみたい。

と言ったこととの一助になれば、ってことで企画をしています。

ただ逆に、「科白の内面を・・・」とか「感情の起伏を表現・・・」とか「科白の解釈を・・・」とかっとはほぼ一切しません（笑）
それは、流石にその先の目的がちょっと違うってことなので、ご了承ください（笑）


なんて堅苦しく書いていますが、当日はゆるゆるした空気で、ほとんど身体をつかったワークになると思います。

当日のワークのアジェンダ

• ストレッチの方法について
• 立ち姿の矯正のコツ
• 歩き姿の矯正のコツ
• 簡単な科白のやりとりから、科白への集中をしながらも自分の状態を把握する

といったことをやろうかなぁ・・・と思っています。

ということで、ATENDに上げていますので、もしご興味がある方がいらっしゃったら、ご参加いただけると楽しいです（笑）

演劇メソッドによる何か
http://atnd.org/events/16109

堅苦しい事をするつもりも予定もありませんので、お気軽にご参加ください～！

---

関連タグ：演劇 講師 発声 

静岡でいつも頑張っているデータファームの勝又さんが企画をされた「TalkNote（トークノート）」の第二回が開催されるようです。

TalkNote（トークノート）とはなんぞや？と思う方がいらっしゃると思うので、サイトをから抜粋。

---

TalkNoteの由来

---

静岡県でも、Webのことや、いろんなこと。もっともっと気軽に勉強できる集まりがあれば。
そんな気持ちで「TalkNote」を立ち上げました。
ネーミングは色々悩んだのですが（最初は「気軽な会議」と日本語でいいかな？と思っていました）が、結果的にそこは英語で「TalkNote」に。

「トークノート」と読んでください。

「TalkNoteとは？」ページより

---

今回の内容はこのような内容になってるらしいです！

---

---

そして何より震災復興に出来る事から！という事で、サイトにも書かれているのですが、講師の方々、主催の勝又さん含め、今回のこのイベントをチャリティイベントとして運営されるとのこと。
「参加費用は、全額日本赤十字の義援金として寄付させていただきます。」とありました。

名村は実はそれでなくても行くかどうかを悩んでいたりするのですが（翌日に所用があって、体調整えておかないとヤバイのですが、それも色々で検討中）、他でもない勝又さんの応援にも、ご紹介！

静岡界隈の方は既にこのイベントはご存じの方も多いかと思います。

ただ少し足を伸ばせば静岡に行ける方！
少なくとも僕が実際に会って存じているというだけでも、角掛さんの話は聞いて損はないと思います。

ということで、

---

TalkNote（トークノート）第２回

---

第2回は「Webの運営とマネタイズ」に決定しました！
利益をあげるポイントを、実例を交えて勉強します！

---

ぜひ、サイトをみて、ご参加してみてください！！

---

関連タグ：セミナー 

TwitterでKICKS Webの千貫さんが投げていたのをみて、当初いち参加者をして行くつもりだった「東京フリーランスミーティング　とうきょうふりみー」で話をさせていただくことになりました。

当初はホントに一緒に仕事をさせていただけそうなフリーランスの方とのコンタクトを取れるようになれれば・・・という思いだったのですが、縁もあって話をする側にさせていただいたという感じです。

当日話をさせていただくのは、

---

会社の方がフリーランスと付き合う際に、
・どういった点を重視するか？
・どういったメリットを感じるか？
・就職したいフリーランスの方なら、どの程度のスキルや入社後の活躍を求めるのか？

---

といったことを内容として、主催側からご連絡をいただいています。

確かに僕自身も昔（90年代）はフリーランスだったわけですし、そういった時期を経て、就職をして、現在独立をして法人格になりました。

そういった流れを経てきた中で、今の名村としてフリーランスの方とのお付き合いの仕方であるとか、クライアントとの契約の中で第三者委託についての規定があったりする場合、フリーランスの方がどういった所をケアしていただいていれば、サクっと仕事をお願いできるか？とかって話は、アリかなぁ？と思っています。

ただ、これも名村が一方的に話す訳ではなくて、フリーランスの方もある意味、依頼を受ける相手を取捨選択する指標として、ご自身が「そんな第三者委託の契約で云々いう相手とは仕事をしなーい」って思えるようになるのもありだと思ったりしていて、そこは話をさせていただいた後かもしれませんが、双方で話し合いが出来るようになればベターかなぁ？と思ったりしています。

セミナー自体はすでに満員になってしまっている（2日で満席になってしまったらしいので、告知が間に合わなかったんです）のですが、終わった後にフィードバックをさせていただければ・・・と思っています。

もしここをご覧の方でフリーランスの方がいらっしゃれば、何か法人との仕事の事で気になることがあれば、コメントに書いていただければお答えさせていただきます！


また弊社（サービシンク）では、現在マークアップエンジニア、デザイナー、ディレクターを募集していたりもします。
何分小さい会社なので、一番求めているのは、現在はマークアップエンジニアをしているけど、今後ディレクション方面に進んでいきたいと考えている人だったりもします。

そういった希望を持っているフリーランスだけど就職も視野に入れているって方はやっぱりご連絡ください！

---

関連タグ：セミナー