2015/3/7

カナエールのWebリニューアル – プロが要らないDevOpsの仕組みづくり

今日とは言えど、まだ空が白む前、カナエールのWebサイトがリニューアルされました。最初にリニューアルをやろうという話で、僕が企画書書いたのが、もう1年以上前だから、思えば長丁場のプロジェクトだったなあと思います。実際に手を動かしたのは年明けてからですが。

カナエール | 児童養護施設からの進学を応援する奨学金支援プログラム

今回は、3人チームでやりました。システムとデザインは基本的にETで仕事としてやって、初期コンテンツに関しては実行委員のチーム3人で分担する形。Facebookグループで事務局含めてタスク振り合いながらの進行でした。皆、忙しいので、なかなか120%上手に連携できたかというと、僕の反省も残るんだけど、まず公開まで漕ぎ着けて良かったなあと思っています。

こんなことが書いてある。

カナエールのWebサイト リニューアルを行いました | カナエール

一方で、プロジェクトの魅力や、そのプロセスを、
なかなか皆さまにお伝えできていない部分もありました。

この辺に、ようは解決すべき問題があって、カナエールの夢スピーチコンテストはたった1日のイベント(3箇所開催だけど)。ただ、本当は120日間のスピーチ作りがある。もっと言うと、それに向けてほぼ通年プロジェクトは走っている(ざっくり夏と秋の間に2ヶ月くらい休みあるかなあくらいのイメージ)。という時に、やっぱり、時間軸でWebの情報が更新されないとしんどいなあ、というのはあるわけです。メディアの取材もあるのだけれど、コンテストが開催されることか、コンテストが開催されたことしか記事になりにくい(そりゃそうとも言える)。なんかすっぽり抜け落ちてしまうところ、ってやっぱり自分たちでやらないといけないのだろうと思うのですよね。

加えて、始まりと終わりしか話題にならないと、議論の材料にもなり辛い。社会問題の啓蒙はこのプロジェクトが果たすべき役割の一つだろうと思うのだけど、良いプロジェクトで終わってしまったり、内輪で盛り上がる枠の外に出れないというのも勿体なくて、門を立たせる必要はないにしても、もう少し取り組む問題が抱える本質的な議論に、このプロジェクトが参照されるようになる必要がある気がしていて、ただ、僕だけの問題意識ではなくて、これから別のチームを中心にプロジェクトとしての情報発信の厚みが増していく予定です。

さて、Webの話しましょうか。

コンテキスト

カナエール

まず全体のコンテキストについてなんだけど、これは基本的にはプロジェクトがこれまで言って来たことに準ずる。何か新しい文脈を言ったり、児童養護の問題そのものについては運営団体のブリッジフォースマイルのWebサイトにその多くがあるので、これまでの文脈をきちんと構造化してビジュアライズしながら伝えてあげる必要がありました。色々意見いただいたり、ミーティングしたりして、割とシンプルなところに落ち着いたんじゃないかなと思っています。後は走らせながらブラッシュアップしていきたいなと。

レスポンシブ

カナエール

まあ時代が時代なので、レスポンシブ対応しています。スマホ、タブレット、PCそれぞれでそれなりに見れるようになっています。実際は「最適化」と言えるほどバッチリはできてないのですけど、PCでは画面上にあるソーシャルボタンがスマホだと画面下に来る感じとか、ちょっと工夫をしてみたりしてます(カナエールのロゴが縦長なのもあり、ちょっと不思議な感じになってる)。ただほとんどの部分はシステムに吸収させています。

システム

カナエール

最後にシステムの話。周囲にはNPOのプロジェクトにEnfold入れる、って話をちょいちょいしてたんだけど、ETで仕事でも使っているEnfoldというテーマをカナエールのWebサイトに入れています。テーマって言うと、カッコイイデザインとか想像するかもですけど、僕がここ最近ひたすらこのテーマを導入しているのは、DBのコンテンツと連動するリッチなUIやレイアウト用のブロックを管理画面からコーディング不要で実装できる、というのが理由です。これ今、他の案件でも痛感してるんだけれど、きちんとセットアップがなされれば、かなりの部分をWebが専門じゃない人に渡せます。

だから、何がやりたいのか

今回、ずっと僕の課題としてあったのが、プロが要らないDevOpsの仕組みづくりです。

DevOps

DevOps(デブオプス)は、ソフトウェア開発手法の一つ。開発 (Development) と運用 (Operations) を組み合わせたかばん語であり、開発担当者と運用担当者が連携して協力する開発手法をさす。ただし2013年現時点では厳密な定義は存在しておらず、抽象的な概念に留まっている。

ここではソフトウェア開発の話ではないから、それこそすごい抽象的な意味合いで使っているのだけれども、WordPressでサイトを更新できるようになります、とは言え、実際に触れる範囲はどうしても限られてきたり、デザインにかかるようなものはプロの手が必要になることも。なかなかページ増やすのも見せ方変えるのも難しかったりします。しばしば、作ることと、走らせることは乖離していました。ただシステムの利便性を確保して、運用のリテラシーをある程度の閾値まで持ってくれば、これまで以上に作ることと走らせることの距離を縮めることができる、そういうトライアルが今回の僕にとってのカナエールのWebリニューアルです。

勿論、サイトのデザインを変えるのは難しいけど、先に上げたリッチなUIやレイアウト用のパーツでページを修正できるし、そこで生成されるコンテンツは予めレスポンシブ対応が想定されて設計されている。そうするとデザインやテクニカルなことだけでなく、結果的にコンテキストを走らせながら強化していくことにも繋がる。これが僕が今回考えたカナエールでのDevOpsです。

世の中はますます便利になっていて、Strikinglyや先日発表されたAmeba Owndのように、誰しも簡単に本格的なWebが作れる、という流れは少しずつ浸透しています。一方で、今日現在、まだまだその環境が十全でないというのも確か。多分、今回用意した仕組みは当面走らせられると思います。中身を少しずつ増やしながら、変えながら。

まとめ

というわけで個人的には宿願の(大袈裟だ)Webリニューアルが完了したのでした。勿論これからが大事だし、あと100日少しで2015年のスピーチコンテストを迎えてしまうわけで、むしろ心持ちとしては何とか間に合ったという気持ちの方が強いのだけれども、とりあえず一段落しているところです。

これから徐々に設計とかデザインとかの意図が、実際のプロジェクトにおける利便性や有益さに反映されていけば良いなあと思います。

先日もカナエールにChromebookがやって来た話を書いたけれど、今、世の中には「続けていくための先端技術」というのがいくつかある気がしていて、Chromebookとか、今回のEnfoldとかもそう。ある目的に対して最適な技術、というのは先端技術でありながら、活用にかかるコストやストレスを最小限にして、いくつかの妥協のポイントを伴いながら、けれども続けていくためのソリューションになる可能性があると思っていて、ハイスペックだったり、ステートオブアートである必要は必ずしもないと思っています。そういう現実問題と技術の帳尻合わせみたいなことは、その「現場への実装」を考える上で面白いとも思っています。そんな簡単にもいかないと思うんだけれどもね。

最終的には「僕がいなくてもいいようにする」というのが、どういう仕事に関しても僕の基本的なスタンスで、カナエールの場合でも仮に僕がWeb担当するのを終えても、付き合いはETとして担保できるので、今回のリニューアルがきちんと続けていくための仕組みになれば良いなあと思っています。Webに関しては。

とりあえず、態勢は整ったのかなあというところ。改めて、関わった皆さん、お疲れ様でした。

ひとり仕事: フリーランスという働き方
(2012-10-5)
売り上げランキング: 14,705
100円
WordPressデザインレシピ集
狩野 祐東
技術評論社
売り上げランキング: 197,569
WordPress 高速化&スマート運用必携ガイド
こもりまさあき 岡本渉
エムディエヌコーポレーション
売り上げランキング: 435,263

加藤 康祐 / 企画・設計

1980年1月12日生まれ。フリーランス歴15年。プランナー、デザイナー。加藤康祐企画設計代表。学生時代にデザイン会社でWebデザインを経験。2005年よりフリーランスとしてキャリアスタート。これまでに個人から上場企業まで、100以上のクライアントとのプロジェクトを経験。主な仕事としてベンチャー企業でのサービスのUXデザイン、独法との防災メディアの編集・運営、社会的養護の子どもたちの自立を支援するNPOのサポート等。趣味はラグビーと料理。Keep the head up, Bind tight & Stay low.

加藤康祐企画設計

是非、フォローしてください!
Twitter / Instagram