CSS Talk vol.3に参加しました
4/22 (土) に TAMコワーキング 大阪(大阪市北区末広町3-7)にて、CSS Talk vol.3に参加しました。参加費は500円です。
vol.1、vol.2、をすっぽかしての参加。田舎者なもので場所がちょっと遠いんだよなぁ…
TAMに来させていただいたのはこれで二度目で、前回は「もしゃもしゃ会」と呼ばれる、デザインが強そうなWebSiteを模写する会。その時は学校の帰りにそのまま来させてもらった感じなので、帰りがとても遅くなってしまって、親は寝てるわ歩いて50分かかるわで萎えちゃった記憶があります。(バスも何もないので)
今回はそんなことがないようにきっちり親を召喚しておきました。駅まで迎えに来てもらいます。
あと、リアルタイムでブログを書くスタイルなので、誤字や文脈、謎のメモなどがあるかもしれませんが、ご了承ください。
さて、CSS Talk ですが、CSSをテーマに話をする勉強会、です。
- 「モダンなCSSの書き方を知りたい。」
- 「こういう時はみんなどうしてる?」
- 「いい方法がわかったので共有したい!」
といったような感じで、今回はデザイナー・ディレクター向けの内容となっているそうです。そのセッション内容はこちら。
- 「グリッドレイアウト これまでとこれから」森永哲平
- 「SC5 style guide generator の話」 後藤知宏
- 「エンジニアとデザイナーとの距離」安田学
僕はデザイナーでもディレクターでもありませんが、楽しみですね。
登壇者様の発表を聞いたメモをこちらにとりました。(こういうのって公開してもいいのだろうか)
CSS Talk vol.3に参加したメモ - HackMD
最初はCSS grid layout の話。最近実装(?)されてモダンブラウザがどんどん対応していったらしい。ただまたIEとEdgeが古い仕様のままなんだそうで…
使いやすそうだし今後に期待ですね!
ちゃんと伝えないと破綻するし、コミュニケーションが大事だよってことだったんですが、まぁうまいこといかないよねということで…
SC5-styleguideとか、スタイルガイドっていうツールがあるらしい。
これとても便利そうだなと思ったので、バイト先の設計でさっそく導入してみたさがあるんだけど、何するものかというと、サイトのボタンとかなんとかのコンポーネント集一覧みたいなのがWebで作れる。
プレビューみたいなやつとHTMLとCSSがコンポーネント別に書かれていて、説明とかをつけることで、だれでもポイントごとにどうなっているのかわかりやすくなる。
デザインにおける形の規約、ルールが作れるので、ルール内における変更に強くなるよ、っていうものだった。
CSS設計は必要ない場合の方が多いから、ガリガリ書いてもいいけど、大事な技術ではあるから、自分なりに頭の中である程度CSS設計を意識していると、何かの時に対応できるよ、とのことでした。
で、最後もCSS設計にかかわる話なんですが、CSS設計がうまくいかないのは、デザイナーとエンジニアの認識のずれが問題だという話。
その認識のずれをなくすために、デザインの意図やコンテキストを中心に考えた設計を行おうというEnduringCSS(ECSS)の考え方がいいんじゃないかと。デザイナーは、構造がどうだからとかという考え方より、ユーザーにどう印象を与えるかという所を考えてデザインしている。だから構造が変わっても、そのオブジェクトが持つ根本的な役割は変わらないというもの。それをコード名にすればいいんだよ。なるほど!!!頭いい!!!
もちろんデメリットもあるわけですが、デザインの目的がわかるエンジニアが本領を発揮する領域だなと感じたので、僕はとても可能性を感じています。
CSS設計やるなら、コミュニケーションをちゃんと取れ!
そのためのツールや考え方はこんなのがあるよ!
というかんじでした。
とても参考になったし、勉強になったので、次回もまた参加したいと思います。
で、懇親会ですが、学生が1人だけっぽかったので、ビールが出てきたときは場違い感が半端なかったのですが、デザイナーやディレクターの方などと色んなお話ができて楽しかったです。ただ、僕の専門は電気工学なのでそこでも場違い感を発揮しまして、驚かれました。
また、「PHPのイベントがあるんやけど登壇して、君の専門の話してもええんやで?」って言われたりしましたが、さすがにPHPの勉強会で半導体素子の話をするのはかなりやばいと思いますよ。絶対しませんからね!
やましーやら14sやらの話題も出て、楽しい懇親会になりました。
色んなイベントに呼ばれそうな予感がしているので、頑張ってこ!(ぜひ呼んでやってください)