LIFE is 日々一歩(65)[web]田舎のネズミが、MAXがんばってきた話/森 和恵

投稿:  著者:  読了時間:6分(本文:約2,800文字)



こんにちは! 森和恵です。昨日から、ずいぶん冷え込みましたね。大阪でも、この冬の初雪がちらほらと降ってきています。

さてさて。前回は、登壇前の車中からコラムをお届けしましたが、おかげさまで無事に終えて、戻ってきました。

【Adobe MAX Japan 2017】
《Dreamweaver最新ワークフロー!PSDカンプからBootstrapページを世界最速コーディング》
https://www.event-web.net/adobemaxjapan/

という、大きめのイベントでお話をしてきました。





●「とにかく規模が大きかった!」イベント当日のこと

わたしのセッションには、300名近くの方々にご参加いただきました。本当に、ありがとうございました。

目の前の座席が、わーっと埋まっていたのを見たり、話している最中に頷いてくれる方に気づいたりしたのが、本当に心強く感じました。

デジクリの読者の方も、きっと見に来ていただいたんでしょうね。ありがとうございます。

当日は、テーマの「Dreamweaverを使った、Bootstrapページの制作」について、どんな機能があるか、そして利用したワークフローはどんな感じなのかをお伝えできたのではと思います。

セッションのスライド・使用したソースコードなどを、フォローアップページにて公開中です。

【Adobe MAX Japan 2017 担当セッションフォローページ:r360studio】
http://r360studio.com/seminar/max2017/

ひとりで参加していたので、登壇中の写真などがないのですが、当日の雰囲気はこんな感じでした。
http://r360studio.com/dgcr/dgcr-Lifeis65-1.jpg

とにかく、参加人数の多さや、会場全体の規模の違いに驚きました。さすが、東のイベント。当日は、3600名ぐらい参加されていたそうです。

登壇は大きなトラブルもなくクリアしたものの、馴れない人の多さにイベントを楽しむ余裕はありませんでした。

どこに行ったら馴染めるのかわからず、ただうろうろとあっちへ行ったり、こっちへ行ったりを繰り返す始末。

まさに、“田舎のネズミ”となっていましたね。トホホ。

次回参加のチャンスがあれば、今度はイベント全体をゆっくりと楽しみたいと思います。とくに、気づかずにタイミングを逃してしまった、次の3つを体験したいと思います。

・MAX Store(物販)は、会場に着いたらすぐに行く!
(欲しいものがすぐ売り切れてた)

・工房(体験)ブースも、興味のある所はすぐ行ったほうがいい。
(キーチェーンやコースターなどをその場で作れます)

・名物のAdobeソフトのカクテルは、2時間待ちだったそうです。
(気がついたら、みんな並んだ後で、売り切れてた)

●BootstrapありきをDreamweaverでサポートする

今回一番お伝えしたかったのは、Dreamweaverで楽をしましょうということでした。

ウェブを制作するときに、ひな形としてBootstrapを導入することで、ページの土台を短い時間で作ることができます。

しかし、そのデザインを変更するには、ブラックボックス化しているBootstrapのCSSを調べる必要があります。

Bootstrapの初期スタイル調べ、リアルタイムに変更するためのサポートがDreamweaverではできます。

例えば、Bootstrapの“ナビバー(navbar)”と“ジャンボトロン(Jumbotron)”の間にできた空白を消したいとします。

Dreamweaverでは、インスペクタという機能を使って、該当箇所のスタイルを調べられます。オレンジの帯担っている部分のスタイルを調べると、クラスセレクタ「.navbar」で、「margin-bottom(下余白)が20px」空いているのがわかります。
http://r360studio.com/dgcr/dgcr-Lifeis65-2.jpg

そのまま、クラスセレクタ「.navbar」で指定されたソースコードを打ち消すためのスタイルを作り、適用し、下余白を削除することができます。
http://r360studio.com/dgcr/dgcr-Lifeis65-3.jpg

思いつく個所を見たままに調べ、修正ができるのが、Dreamweaverの最大の利
点だと思います。

もちろん、「挿入パネル」や「カラム調整」など、Bootstrapを使うためのさまざまな機能がありますが、一番のよいところはここにあると考えています。

それを想定して、当日はこんなワークフローも提案してみました。

Bootstrapを土台にすることを前提として、ディレクター・デザイナー・エンジニアの3名で進める工程です。
http://r360studio.com/dgcr/dgcr-Lifeis65-4.jpg

ディレクターがラフをPSDで作り、ラフの段階でエンジニアに渡して土台になるページをコーデイング。その後、デザイナーに土台や素材を投げて、最終工程までブラッシュアップしていく方法です。

早い段階で、コーディングを始めることで、全員の意思疎通をはかり、戻りの少ない作業ができるのでは? と考えています。

……と、MAXのセッションでは、ここまで深く突っ込んでお話ができませんでした。が、近々お話できる機会を作ろうと思っています。

まだ、正式に告知前なのですが、大阪では「2月25日」にイベントをする予定です。そのあと、ゲストで呼んでいただく形で東京でも予定しています。

決まったら、私のTwitterなどで告知していきますので、お楽しみに。

●明日、MAXセッションの再演をライブ配信します。

まだまだ話したりないことがあったので、Youtubeライブ配信もしていきます。先日、その第0回を放送しました。


自分がホストになってのライブ配信はこれが初めてで、環境の準備が整わず、当日急にお知らせしての、ゲリラライブっぽくなりました。でも、当日よりもじっくりとお伝えができたのではと思います。

明日と来週の2回に渡って、本編を配信する予定です。

下記のチャンネルで告知していきますので、チャンネル登録をぜひ。
https://www.youtube.com/r360studio

……ということで、今回はここまで。

最後になりましたが、2017年のコラムはこれで終了です。来年は戌年。年女一歩手前なので、ますます気合いをいれていきます。

来年も、どうぞよろしくお願いいたします。

ではまた、次回お目にかかりましょう!
(^^)

【 森和恵 r360studio ウェブ系インストラクター 】
mail: r360studio@gmail.com
Twitter: http://twitter.com/r360studio

講座受付中:http://r360studio.com/seminar/