WP-D Fes #03 in GMO Yours 大阪会場に参加してきた!

3月7日に開催された、「WP-D Fes #03 in GMO Yours 大阪会場 $ wpd –update webdev」に参加してきました。イベント名にもあるように「Web制作の環境をアップデートしよう!」というテーマのイベントでした。

長崎から飛行機(Peach)で行ったのですが、1日1便夕方のみしか便が無いので前日入り。飛行機の待ち時間にFacebookを見ていたら、イベントを主催されるWP-Dのメンバーの皆さんが飲み会をされるというのを発見、飛び込みOKとのことでしたので参加させていただきました。このとき初めて会場である GMO Yours に入ったのですが、巨大複合商業施設グランフロント大阪の23階、ガラス張りから見える都会の夜景、それで普段は社員さんの休憩室と、なかなかこんなところにお邪魔できることはありませんのでいろいろ驚きました。ホテルからグランフロントまでも迷いましたが、グランフロントに入ってからも20分くらい迷いましたし…。で、なんやかんやで当日スタッフもやることに。

photo by @webboyjp

会場案内をやる私 photo by @webboyjp

なんか見覚えのある人が僕にカメラ向けてるなーと思っていたらいつもの大原さんでした(^^;

これで大丈夫。Web制作で使うコマンドラインツールの名前と役割をざっくり理解する

まずはWP-D発起人の大串さん。最近よく目にするコマンドラインツールについてのお話でした。「黒い画面こわい」な感じでなるべく触らないようにしてきたのですけど、最近は情報も充実しているし使うだけならコピペで済んじゃいますので、僕もざっくりとした理解で使っています。でも大串さん、ざっくりといいつつ詳しく説明されていて、ディレクターさんなのにすごいなーと思いました。

プロトタイプとWebサイト設計のワークフロー

「後藤プロ」こと、よつばデザイン後藤さんのセッション。モバイルファースト・コンテンツファーストになってきている中で、これまでの制作フローを見直し、デザインカンプを作らずにプロトタイプを作るという方法がありますよという内容のお話でした。僕自身、Web制作を行っていて、マルチデバイス対応が当たり前になってきた中でPC用のデザインカンプをきっちり作って他のデバイスはよしなに、みたいなやり方が非効率的というか従来のようにハマらなくなってきているかな…というのは感じていたので、機会があればなるべくプロトタイプを使ったやり方でやっていきたいなと思いました。今は WordPress に限らず Bootstrap のテーマなんかもオープンなライセンスでたくさん配布されたりしているので、そのあたりでプロトタイプを作って調整していくというのはアリではないかなと。

制作ツールとしてのCMSを改めて考える

コンクリートファイブジャパン株式会社代表の菱川さんのセッション。CMS とはなんぞや、制作者ツールとして考えたときに重要なものは何か、というお話でした。

CMS というとサーバーサイドで動的に動くものというイメージでしたが、コンテンツを管理するだけであれば Git と組み合わせて JadeGrav というローカルで HTML を生成するツールを使う手もあると。確かに権限管理とかサーバーサイドでいろいろやる必要があるサイトでなければ、そういうのも良いなと。僕はほぼ WordPress 専門で、WordPress が不要そうなときは普通に HTML 書いたり Dreamweaver 使ったりって感じでしたが、Grav なんかは Markdown で簡単に書けるそうなので案件によってはこのあたりを使うとすごく良い感じでできるのではないかと思いました。

それ以上なものが必要な場合には、ということで October CMS という Laravel 製の CMS の紹介もありました。管理画面の UI もモダンな感じで、管理画面から API の実装ができたりいろいろすごそうな感じでした。僕にはちょっと難しそうに感じましたが、バリバリのプログラマーな方には今後良い選択肢になるのではと感じました。

High Performance Gulp

ファンタラクティブ株式会社代表の井村さんのセッション。Gulp をバリバリ使って開発を超効率化させようというお話でした。「東京でこの内容をやったときは中盤からお客さんが???状態になってしまったので、その点前置きしておきます。」ということで始まったセッションでしたが、僕も途中から???状態になってしまいました(@□@;)

僕も Gulp 自体は少し使ったりしているのですが、Sass をコンパイルさせたりちょっとファイルをコピーさせたりするくらいで、まぁそれで済んじゃうくらいのことしかしてないのでアレなんですけれども、井村さんは scss ファイルからスタイルガイドを生成したり、すごくナウい感じで JavaScript の結合をされていたりしていて、とにかく凄いなーと思いました。GitHub でもろもろ公開されていらっしゃるとのことなので、時間ができたら研究して自分なりのものを用意したいですね。

デザイナーのワークフローを変えるAdobeモバイルアプリの実力。

TIMING代表の北村さんのセッション。昨年秋に多数発表された Adobe モバイルアプリをいかに活用するかというお話でした。iPad で動画を撮影してちゃちゃっと加工してサイトに埋め込んだり、iPad のカメラで撮影したデータがそのままパスデータで読み込めたり、また、撮影した文字をフォントに変換して読み込めたりとデモを交えて紹介されていました。ちょっと前ならすごくお金と手間がかかったことが、iPad やアプリの登場で複雑でないものならすごく簡単に早くできてしまうのだなと驚きました。

2015年のサバイバル学習術 「Web開発技術の税引後利益」を最大化しよう!

破滅派の高橋さんのセッション。高橋さんのブログには他ではあまり載ってないニッチな Tips を掲載されており、以前から困ったときなどに良く拝見していて、勝手に親近感を抱いていたのでお会いできて嬉しかったです。セッションの内容は、流行りの技術やツールはいずれ廃れるけど、何か資産を残すことでそうなった時でも資産を活かせるようにしよう、というものでした。Flash や Grunt を例に挙げ、すごくおもしろいお話で、文章がおもしろい人は話してもおもしろいのだなーと。僕のブログは語彙が少なくて自分で読んでてアホに思えるときがあるので文章もしっかり書けるようにならなければと改めて思いました。

なんかちょっとズレちゃいましたけれども、実際ツールとかは理解することを放棄してただ使っているだけだと、それが無くなったときに本当に0になっちゃうので、ツールの使い方だけではなくて、概念だとかざっくりとした仕組みだとかぐらいは学ぶようにしたほうが絶対に効率的なので、このあたりは面倒でも放棄してしまわないように注意していかなければいけませんね。

今度こそ失敗しない。プロジェクトを円滑に進めるタスク管理とGitの連携の方法

最後は2度目の大串さんのセッション。ディレクターさん + コードも触る大串さんならではのお話でした。やりとりの管理は Backlog で、コードの管理は Git でやる、粒度を間違わない、言った言わないを防ぐためにこまめに残す、記録されていないものはやらないこと、などなど。ディレクターあるあるのときは特に賑わっていて、会場にはフリーランスの方も多くディレクションも制作もご自身でやられている方が多いからかなーと思いました。

Backlog に議事録を残したりやりとりをするとなるとクライアントにも Backlog を使ってもらうことになるかなと思うのですが、僕の周りの間隔だとちょっとハードルが高いかな?という感じもあるので、その辺りのノウハウもまた今度お伺いしたいなと思いました。

懇親会&LT大会

この後は同じ会場でそのまま懇親会&LT大会でした。僕もせっかく大阪まで行くのだから何かやろうと思ってLTに申し込んでいたのですが、あまりに早く申し込んでしまってLTの参加権をいただいたときにはどういう内容で申し込んだのか忘れてしまい主催の大串さんに聞く、という失態をおかしてしまいました^^;

内容が薄いので2、3分で済んじゃうのではないかと思いましたが、会場の盛り上がりと僕のテンパり具合が重なって時間ピッタリのLTとなりました。他にも3名の方とWP-Dの方々もLTをされていましたが、皆さんスラスラと本当に上手くて盛り上げ上手で。そんな中で僕一人だけスベり倒したらどうしようかと思っていましたが会場の皆さんとスタッフの皆さんのお陰で何とか無事?LTをやることができました。改めてありがとうございます。

地方にいると中々会ってみたい方がいても機会が無かったりするので、今回はお会いしたかった方にたくさんお会いできて楽しかったです。あまり時間がなくて皆さんとじっくりお話できなかったのが心残りですが、夏には WordCamp Kansai 2015 の開催も予定されているそうですので、またそこでいろいろお話ができればと楽しみにしています。WP-Dの皆さん、参加された皆さんありがとうございました!

大原さん、BizVektor作者の石川さんと。photo by @webboyjp

大原さん、BizVektor作者の石川さんと。photo by @webboyjp

MW WP Form

MW WP Form はショートコードベースのフォームプラグインです。多くの機能を持っており、例えば、多くのバリデーションルール、問い合わせデータの保存、そしてグラフ機能集計などを使用することができます。

さらに詳しく
Habakiri

Habakiri

Bootstrap ベースのシンプルな WordPress テーマ。レスポンシブ、多くのカスタマイズ機能。圧縮された CSS・JS を使用する高速化対策。Microformats 対応。Sass、クラスベースの functions.php。

さらに詳しく
basis-stylus

Basis

軽量なレスポンシブ Stylus/CSS フレームワーク。Flexbox ベースのグリッドシステム、疎結合なコンポーネント、バーティカルリズム。

さらに詳しく