CyAC

サイトの概要

弊社の別事業部が運営するゲーマ向けのソーシャルネットワークサービスです。ゲーマー向けのおもしろ記事を提供し、ユーザーが自由に様々な形式の大会を開催できるサービスなどをメインに展開しています。

2014年2月の時点で使用モジュール数が約100個、ユーザー数が5万人弱、様々なタイプのノードが約3万件ある比較的大規模なサイトです。

諸々の事情で外注開発していた Drupal 7 で制作されたサイトなのですが、開発スピードと品質を向上させるためStudio Umiで受け持つことになりました。

目的

• 今後更に需要が拡大すると思われるスマートフォンやタブレット端末へ完全に対応し、それらの端末の集客率アップ
• 前バージョンのでの不具合解消
• サイトパフォーマンスの改善
• 新機能の実装
• 月々の保守費用の削減

挑戦

前任者が開発した数万行に及ぶモジュール群の調査・分析して引き継ぐ必要があり、またパフォーマンスを改善するため、モジュールを取捨してテスト、本番移行する作業に困難が予測されました。

保守費用の削減とパフォーマンス向上

コスト削減のためのサーバー移転

スタンドアローンのサーバーを利用していたのですが、リソースを調査した所性能がありあまっていることが判明し、また月々のコストがかなり高額のため、サーバー会社を他社へ変更することにしました。

月間ページビュー数が60万、同時アクセス数が多い時で500人近くになるため、そこそこの性能のサーバーが必要です。root権限が使えて様々なチューニングができ、コストパフォーマンスの良い、と言うことが条件でしたので、VPSしか選択肢がありません。これまでの弊社の経験を活かせ、なおかつ調度良いプランがあるさくらインターネットのサービスに変更することにしました。

サーバー移転後のコストは以前と比べ、約10分の1まで削減することができ、またサーバーパフォーマンスに関してはソフトウェアのチューニングで同程度以上の能力を保つことができました。

モジュールの取捨

使用されていないモジュールがくつも有効となっており、無駄なオーバーヘッドが発生していたため本当に使用されていないかよく調査し削除する必要がありました。削除後は劇的とは言えませんが、ページ生成速度をやや改善することができました。

各種サーバーソフトウェアのチューニング

前サーバーでは8GBもあるメモリが上手く使いこなせていなかったため、新しいサーバーではApache、MySQL、PHPのチューニングを行うことで無駄なディスクIOが発生しないように工夫しています。

リバースプロキシー

フロントにリバースプロキシーのVarnishを置くことで、未ログインのユーザーに対しての負荷をキャッシュし、アプリケーションサーバーへ無駄なリクエストが発生しないようにしました。

機能開発

レスポンシブ・ウェブデザイン

利用者のスマフォ・タブレット率が5割を超えるサイトでしたので、それらの端末で機能を失ったりアクセシビリティが低下しないことも重要な課題の一つでした。前回まではDrupalの有名なベーステーマである Adaptive theme を利用して開発されていたのですが、レイアウトの多様性求め一からスクラッチ開発することになりました。

ある程度慣れ親しんだユーザーが居ると考慮したため、レイアウトを殆ど変えずにCyACのコーポレートカラーを取り入れ、流行のソリッドデザインを基調としてデザインしています。

主なターゲット層が10代〜20代の若者が使用するモダンブラウザのみでしたので、通常の案件よりは動作チェックの意味では楽だったと言えます。

スマートフォン向けの解像度では、ヘッダーにあるメニューが隠れてスライドボタンになるなど、Java Script を多用し、インタラクティブ性とユーザービリティを両立しています。

YouTube Live 機能

CyACでは大会をする際に、YouTubeのライブ配信サービスを利用してリアルタイムでゲームの実況中継を行なっています。しかし動画放送をする場合はTwitterやサイト上のお知らせ記事で告知するしか方法がありませんでした。

動画での広告収入がCyACを支えているため、視聴者数の拡大が急務でしたので、サイト上でもっと目立つ方法で告知する必要があると考え、独自のYouTube Live告知用のモジュールを開発し流入数を増やすことになりました。

案件概要

クライアント名	CyAC 様
URL	なし
Drupal バージョン	Drupal 7
ジャンル	ゲーマ向けSNSサイト
デバイス	PC／スマートフォン／タブレット
当社スコープ	デザイン／Drupal導入／コーディング
プロジェクト期間	なし