第1回メンバー全体Zoom MTG｜Webサイト制作ガイドライン共有化構想［#07］

5月19日、専用Slackにジョインしてくれたメンバーさん達と、初の全体MTGをZoomで行いました。今回もその内容を公開の議事録として、こちらで記録したいと思います。

［Webサイト制作ガイドライン共有化構想とは］
全国のWebサイト制作関係者が同じガイドラインを利用することで、クリエイティブに集中できる環境を作ることを目的とした、ガイドラインの共有化構想です。
・決意表明：Webサイト制作ガイドライン共有化構想［#00］
・マガジン：Webサイト制作ガイドライン共有化構想

１．自己紹介

まずは、皆さんで自己紹介を行いました。

写真の左上から、
稲富さん（@inatomi1717）
ヒカル（@design_hikaru）
ケンタロウさん（@kentaro_koga）
桑島さん（@mika_kuwa）
園川さん（@kazukisonokawa）
吉永さん（@go9006ob）です。

２．企画書のプレゼンテーション

僕の方から企画書のプレゼンテーションをさせてもらいました。この内容については、今回のMTGにて大幅なブラッシュアップを行うことになりましたので、公開はもう少々お待ち下さい…

３．参加について

園川さん：
「この共有ガイドライン制作に参加する前に、まずはそれぞれコミュニケーションを取ってみる必要を感じます。」

確かにその通りです。

・どの程度のコミットが必要か？
・GitHubなどオープンソース開発レベルの情熱が持てるか？
・作業量が多ければ必然的にマネタイズが必要かも？

など、まだまだ不明点が多すぎるので、参加メンバー内でディスカッションをしてみる事からスタートしました。

４．意見出しチャンネル

園川さん：
「はじめは自分たちのニーズから話し合ってみたいですね」

この流れで、専用Slack内に［意見出しチャンネル］を設けることにしました。

例えば「idとclassはどう設定している？」など、自身が迷ったり悩んでいることを議題に挙げて、それについて回答を出していこうという意図です。

５．共有ガイドラインがカバーする案件の規模

桑島さん：
「共有ガイドラインでカバーする案件の規模はどのくらいですか？」

園川さん：
「規模に応じてガイドラインを切り替える必要があり、静的なのかWordPressなのかで、そもそも作る環境自体が異なります。」

この辺りはどの案件でも利用できるガイドラインがベストですが、精査するのが難しそうです。

６．CSS設計の乗り換え

ケンタロウさん：
「CSS設計をガイドラインに組み込んだ時に、普段書き慣れている方法から移行するのは大変になりそうです。」

現時点でCSS設計思想は分かれている状態なので、どれかひとつを選ぶのは無理があるかもしれません。

吉永さん：
「BEMを利用してますが、SCSSと相性が良く、コンポーネントを作っていきます。」

これには納得です！
僕は現状SMACSSを使っていますが、BEMも良さそうだなぁと。

桑島さん：
「独学でCSSを書いているので、自分の方法が正解なのか分からないです。」

共有ガイドラインの利用目的として、最低限の品質を担保したいという部分があります。問題が発生しにくい方法を取り入れたいですね。

７．LPで効率が良いCSSの書き方は？

ヒカル：
「LPみたいに繰り返しの要素が少ないデザインでも、効率よくCSSを書く方法はありますか？」

吉永さん：
「ユニークな部分はそのまま書くしか無いですが、コンバージョンの部分は繰り返すのでコンポーネント化します。」

園川さん：
「LPでは無いですが、下層ページがある場合はトップではfront-aboutなど、下層ページ用にクラス名（about）を残しておきます。」

やはりCSSの部分は規定するのが難しそうで、一つの方法に絞るのは難しいかもしれません。

８．共有ガイドラインの利用者について

吉永さん：
「この共有ガイドラインの利用者は、設計などに詳しくなくて、自分のルールを持たない人だと思います。詳しい人は自走するので、そもそも共有ガイドラインは使わないかと。」

なるほど、確かにそうだと思います。僕が想像しているペルソナも「忙しくて手が足りないから協業したいけど、ガイドラインを持っていないから仕事を振りにくい」という方です（僕です）。

９．共有ガイドラインは必要ですか？

ここで僕からそもそもな話を質問してみました。

ヒカル：
「みなさん、共有ガイドラインって必要だと思いますか？（笑）」

これについて、みなさんからの回答を箇条書きで列挙します。

稲富さん：
・今の所共有したガイドラインの必要性を感じていない
・詰まったらネット検索で解決策を調べる
・しかし、困っている人がいるなら必要かも
・利用する人を設定してはどうか？

桑島さん：
・上級者は自分で勉強するから共有ガイドラインは不要
・必要なのは独学で業務を行う人
・小規模な制作を行う人に必要だと感じる
・みんながどう作っているのか知りたい

吉永さん：
・強い人は自走するから不要だと思う
・マネタイズを考えると初学者の最低品質向上で寄与できるかも
・このガイドラインはネットに存在している流派のひとつ
・アップデートのコストが高そう
・暗中模索中の人には共有ガイドラインは必要
・ターゲティングがハマれば必要なものだと思う

ケンタロウさん：
・ゴリゴリのエンジニアには必要ない
・ガチガチのガイドラインだと使いづらい
・「あったらいいな」があると使ってもらえる
・ガイドラインがあればカオスなカンプは来ないかも

園川さん：
・強い人、自走できる人は使わない
・技術についてガイドラインを規定するのは闇が深い
・認識の部分であれば可能かもしれない
・大風呂敷を広げると難易度が高くなりすぎる

メンバー内で共通だったのは「上級者や自走できる人には不要」と「技術的な所より認識の共有がしたい」という所でした。

１０．まず認識を共有できるガイドラインを作る

ここではじめの［意見出しチャンネル］に戻るんですが、技術を揃えるのは難しいポイントが多いので、まずは認識の部分をガイドライン化して行きたいと思います。

例えば以下のような意見を出して、それについてSlack内で談義していこうと思います。

例：
・idとclassはどう設定している？
・font-sizeの単位は［px］［rem］［%］？
・IE11どうする？（これは決めかねるかも…）

メンバー間で意見出しと談義を行いつつも、みなさんからもそんな「決めかねている問題」についてアンケートを取ったり、質問箱も用意してみようかと思います。

１１．風呂敷を畳みました

今回のMTGで、僕が広げていた大風呂敷を畳んでもらいました（汗

まだ構想の段階なので、談義やMTGを行う中で可能性が広がるタイミングもやってくると思います。まだ未確定ですが、フェーズを分けて進めるのが良い気がしています。

まずは［認識部分のガイドライン化］を行うべく、専用Slack内で引き続き談義を続けたいと思います！！

１２．専用Slack

共有ガイドラインを一緒に作成してくださる有志の方を、引き続き募集しております！

Slackへ参加ご希望の方は、僕のTwitter（@design_hikaru）まで、ご連絡よろしくお願いいたします。

最後までお読み頂き、ありがとうございました！