WEBCRE8.jpウェブクリ8.jpwebデザイナーによる、デザインとwebを楽しむ情報ブログRSSABOUT会う。WEBCRE8.jpが出会った人や参加したイベントの様子を報告するカテゴリです。Basics」を開催したので簡単なレポートと、主催側視点の話を書いてみます。Basics」というイベントを行いましたのでそのレポートをざっくりとお送りします。主催側の思惑や、この100人規模のイベントを開くにあたって工夫した点やイベント後のデータなども伝えてみたいと思います(文中敬称略)。Peatixこの記事がCSSや今後のこのイベントに興味のある人、また自分もイベントをやってみたいと思うような人の役に立てば幸いです。会場は恵比寿のDMMオフィス私とこじーはhtml5jでマークアップ部という活動をしているのですが、今回はそのスピンオフイベントとして開催しています。実際のイベントでも最初にこじーが、なぜこのイベントをやろうと思ったかの話をしました。意欲的なWeb制作者の新しい技術の話に対する関心は比較的高く、CSSの話題で言えばプリプロセッサー、CSS設計、いわゆるCSS3の新しいプロパティーなどに注目している人は多いでしょう。このイベントではそういったキャッチーなトピックではなく、むしろ知ってて当然と誰もが思うようなことにフォーカスを当てて、より深い理解を得ようということに主眼を置いています。中級者の人でもある程度わかっているから仕様をちゃんと読んだことはない、正確な構文パターンまでは知らないという人は少なくないはずです。イベント全体として、仕様書と向き合うということをメッセージとしています。参加者はほとんどが実務でCSSを書く人たち参加者の職種はWebデザイナー、マークアップエンジニア、フロントエンドエンジニアを想定しており、実際にそのようになっています。内容のレベルとしては前述のとおり中級者を中心としていますが、それなりに勉強している人であれば初心者でもついてこれることを意識しています。やってみたこと受付スタッフが遊んでます。ここには普段美人受付がいる発起人のこじーとイベントについてディスカッションしたとき、いくつかの試みを行うことを考えました。有料、事前支払い勉強会イベントを主催する人たちの間では、無料イベントは募集の3〜4割が来ない(そしてほとんどがドタキャン)と言われています。これは構造上しかたないところもあって、規模が大きくなると要はただのパーティーのように、出入り自由、行っても行かなくても自由みたいなイベントに感覚が近くなってくのかもしれません。なんか相手もいちいち応対面倒なのではって思っちゃうこともありますしね。実際には、別にこちらの手間はたいしてかからないので都合が悪くなったらキャンセル手続きをしてもらえると、イベント主催者は助かることのほうが多いです。Basicsでは有料、しかも事前決済サービス(Peatix)を使うことで、参加者それぞれに明確な参加意識を持ってもらえないかと考えました。結果、参加者は募集人数の9割と高い参加率をキープできました。都合が悪くなるということは誰だってありますし、これ以上は仕方ないかなと。雨が降っていようとも行かなかったら損する!と思ってもらえるようなイベントメイキングを心がけたいです。豪華と言えるLT陣の参加がありがたかった大きめなイベントのLTってわりと余興的な位置づけのことが多いです。懇親会の一角で行われたりすることもあったりして、そうでなくても長丁場のイベント終盤では参加者がうまく集中力を維持できないことも少なくありません。そのためLTのタイミングをイベント中盤に配置しました。これは確かこじーの提案だったような。30分のセッションと5分のセッションでは聞く際の心構えも違うので混乱しやすいのではという懸念もありましたけど、概ねうまくいっている気がします。今回はLTを一般募集したのですが、その応募者がそうそうたるメンバーすぎて...そりゃみんな聞くよねみたいなラッキーな部分も大きかったですwイベントをやった側の私がいうのもなんですが、今回は本当にお得だったと思います。アンケートの工夫アンケートでセッションの評価をチェック方式でしてもらいました。このアンケートへの記入を重視しているということを参加者にアピールしました。セッションの間にアンケート記入のタイミングを置き、その提出をイベント最後のプレゼント抽選会の参加権としました。これは当然今後のイベントでのセッション立てのための参考情報になります。全参加者の85%程度の提出を得られています。LTについては人気投票を設けました。7本のLTのうち、特に面白かった、もっと聞いてみたいというものにチェックを入れてもらい、人気の高かったものは次回以降で30分セッションとして再オファーを出させてもらう、というふうにアナウンスしています。そもそも掘り下げにくいものや、イベントの主旨と合っていない(LTはバラエティー重視にしました)ものもあるので、これは参考情報として使う感じです。内容の工夫SlackとGitHubで進捗、レビューを管理スピーカー全員のスライドを他の全員でチェック、レビューし、クオリティーを担保することに努めたり、Slackでディスカッション、GitHubで共有してブラッシュアップと、スピーカー全員が一つのイベントのチームとしてお互いのスライドを練り上げました。スピーカーはもともと仲のいいメンバー中心だったのですが、これも結構大きかったのではないかなと思っています。こじーと二人で企画した今回のイベントですが、スピーカー陣の皆さんにはセッション内容だけでなくイベントの進行までかなり提案してもらったので、実質的にはスピーカー兼スタッフといった感じになっていました。ちなみにLTの方は内容についてはそこまで厳正にチェックを行わなかったのですが、ベテランの人ばかりだったのでその辺はあまり心配していなかったです。寿司は最高スポンサーにもついてもらっていたので、お寿司を頼みました。勉強会の懇親会でお寿司食べられるの最高っていう自身の経験に基づいてのものですね!w実際懇親会はやはりスピーカーや似た業務に従事する人たちと交流できる大事な場ですから、その時間を楽しく過ごせることにとても気を使いました。人が密集しすぎてちょっと暑かったりしましたし、少し寿司が足りなかった感じもあるので、次回は量を考えないといけないですね...。イベントのボリュームを考えるとそこまで不満になるようなほどではないはず。ちなみにみんな大好き銀のさらで注文しました。リーズナブルな価格で出前をお願い出来て便利!★スライド一覧セッションフロア全体CSSにまつわる5つのメインセッションはひとつ30分5つのメインセッションと7つのスライド一覧を掲載します。2015-08-30まとりさん(@ub_pnr)のセッション。このイベントの他のセッションでは随所に仕様書の話題が出てくるので、そもそも仕様書がどういうものかわからないという人のために仕様書の話になりました。後半はCSSで使える単位やデータ型について。基礎知識とはいえ、普通にやっているだけでは意識しない話題も多く、アンケートでもっと詳しく知りたいというチェックの一番多かったセッションでした。リセットCSS仕様について知った次はブラウザーについて。ブラウザーのデフォルトスタイルシートと、リセット系CSSの話を主催者のこじー自ら解説しました。デフォルトスタイルシートには通常書くことはないプロパティーも含まれているため、初めて知ったということも多くあったようです。全セッションの中でも特に説明がわかりやすく、言葉も聞き取りやすかったということでした。セッション3:ご存じですか?colorプロパティ(@GeckoTang)仕様書を読むことの面白さを語るげこたんご存じですか?colorプロパティここからは一つのセッションでCSSプロパティーいずれか一つを中心に扱ったものになります。誰でも書いたことがあるような普通のプロパティーを題材とすることにしていましたが、その一発目がげこたん(@Geckotang)のcolorプロパティー。colorプロパティーの指定を参照するプロパティーの解説とともに、currentColor値の解説が中心となった内容です。コードの通常の記述例、スライド内容を踏まえた記述例、実行結果と示す形のスライド、説明のわかりやすさが共にアンケートで高評価でした。colorプロパティという記事でも読めます。名前を聞けば多くの人が「ああ、あの人だ!」という印象を持つような鉄壁の布陣って感じです。一人5分で7本ものセッションを、それもかなり内容の濃いものばかりだったので脳が追いつくのも大変だったと思います...。@448jpLTはCSSに関係した話しならある程度何でもオッケーという感じになっているのでわりと上級者向けの話もあるかと思います。深みへようこそLTをはさみ、再びメインセッションのくぼしょーさん(@kubosho_)のセッションでは、background-imageとbackground-sizeの2つのプロパティーの挙動について、実際のデモをはさみながら解説していきます。背景画像のアニメーションに関するブラウザーごとの挙動、backgroundプロパティーのショートハンド指定におけるbackground-sizeの扱いの違いという2つの話題を軸に、だんだんと細かい話になっていくというもので、ちょっと難しかったという感想も多かったです。Basics」に行ってきたという記事を書いています。fixed;チョットデキル最後のセッションはおちさん(@o_ti)。全セッションの中でもさらに限定的なposition:fixed;についての話。内容としてはposition:fixed;の仕様、ブラウザーの実装、バグ、実際によくあるパターンで起きる問題という風にわかりやすい展開です。謎な部分についてはちゃんと仕様書に書いてあるし翻訳もされているよということ、でもバグも多いしうまく実装されてないことも多いし、本当に必要かどうかを考えてねということ、そしてどうしても使いたい場合の有効な手段という真っ直ぐな流れをキレイに説明したなーという感じでした、アンケートでも面白かったという評価が一番高かったです。今回は参加費を1000円と安く抑えていますが、懇親会にはお寿司を用意しました。これは多くのスポンサーのおかげで実現しています。感謝!スポンサー会社は以下のとおり(順不同)。DMM.comラボの方には会場の提供のほか、スタッフの方々の様々なサポートを頂きました。その他のスポンサー会社からは協賛金のほか、イベントの最後のプレゼント大会の賞品や、参加者全員プレゼントのノベルティーなどを提供して頂きました。賞品のプレゼント大会。当選者が欲しいものを選べる今回のイベントではチラシの配布などはしましたが、スポンサー企業の皆さんからの告知時間などは特別に割いていませんでした。今後はスポンサー企業の要望なども頂きながら検討していきたいと思っています。Basicsではさらにスポンサーを求めております。現場ではハッシュタグの質問に答えたりもしている参加者の反応についてアンケート、ツイート、その他リアクションを紹介します。アンケートアンケートは設問への回答にふさわしいと思われるものに複数チェックするチェック欄と自由記入欄をイベント全体とセッションごとに設定していましたが、前述の通りとてもたくさんの提出を頂きました。今回は紙でのアンケート用紙を配布しましたが、フォーム入力も欲しいという声もありました。アンケートの回答内容については公開する予定がなかったのでざっくりになりますが、仕様について理解が深まった、もっと自分でも読んでみるようにしたいというような仕様に関すること、話す内容を絞ったことでとても深い話が聞けたというコンセプトに関する評価を多数いただきました。これは今後も貫いていこうと思います。アンケートの集計結果のひとつ。イベント全体について一方で、休憩時間が短すぎたなど、進行やプログラムについての問題もわかりました。機材のトラブルなどもあり、この辺りについてはしっかり見なおしていきたいと思います。Togetterまとめ今回はツイートでかなりのリアクションをもらえていたようで、途中でハッシュタグの#btbcssがTwitterのトレンド入りするということがありましたwその他のリアクション今回のイベントでは、過去私が行ったイベントの中では比較的イベント後のリアクション、つまりブログによるレポートが少なく感じました...というか先週の時点ではブログを全然見かけなかったです。この記事を公開する直前に探して見つけたものだけリンクします。皆さん時系列順にスライドを紹介してくれていたり、かなりがっつり振り返ってくれていたりで、セッションの雰囲気はそこからも読み取れるかと思います。blogしかし今回は他にもちょっと変わったリアクションをもらえました。セッション1のまとりさんのセッションのスライドを韓国の方が翻訳してくれたり。2015-08-30イベント全体をクイズ形式にしてまとめてスライドを作成してくれた方がいたり、ということがありました。2015.08.30どちらも今までにない形のリアクションで嬉しかったです!今後も何かの形でリアクションが貰えると嬉しいですし、もうしばらく日も経っちゃってますがまだまだ感想ブログ記事など、書いていただけたら嬉しいです。まとめ今後も行っていく予定ですというわけで、主催者側視点からのイベントレポートというか、報告としました。今後もここで書いたようなコンセプトを軸にイベントを行っていく予定です。最後に今回参加してくださった参加者の皆さん、イベントの企画段階からディスカッションに加わってくれたスピーカー陣の皆さん、LT参加を申し出てくださったLTスピーカーの皆さん、また私とこじーの段取りの至らぬところを高いよしな力でカバーしてくれたスタッフの皆さん、会場を提供してくださったDMMラボの皆さん、スポンサーの皆さんに深く感謝を申し上げます。写真:@poyosi、@yuki_m015tweethatenafacebook_likewebcre8はTwitterを使っています。