株式会社サン・レッツ様のサンライズビルサイトリニューアル制作を、セキュリティの高い国産CMS『a-blog cms』を使用して構築を行いました。

サンライズビルサイトでは、東京と大阪でイベントホールの貸出サービス提供をしています。 サイトは大きく分けて「総合サイト」「大阪ホールサイト」「東京ホールサイト」の3つで構成されています。 『a-blog cms』は1つのCMS内で別々のサイトを制作し、それぞれにデザインを当てることが容易に可能なので、今回のサイト構築する上で最適のCMSでした。

また、サイトリニューアル後の運用はお客様が主体で行うことになっていたので、更新頻度の高いページはコーディングの知識のない方でも簡単にページの編集が行えるCMS。という観点からも『a-blog cms』を導入することになりました。

リニューアル前はお客様が更新できる部分がトピックス記事の投稿のみでしたが、 会場活用事例、フォトギャラリー、レンタル備品料金表、よくある質問など更新頻度の高いページを、お客様側で作業が可能となり、サイトの運用面を向上させることに貢献できました。

トップページの構成について

大阪ホールの「緑」、東京ホールの「青」、そしてそれぞれに馴染む「ゴールド」を共通カラーとし構成しました。 ホールの雰囲気が伝わりやすいよう写真を多用しています。 上質さをデザインからも届けられるよう、テクスチャやリンクのhoverアクション、グラデーションなど繊細な表現を意識しました。また訴求は催事従事者の「求める」もしくは「メリットに感じる」情報を目立たせています。

大阪ホールの「緑」、東京ホールの「青」、共通カラーを「ゴールド」とし構成

3つのユーザーにとってわかりやすいサイト構築

「新規客（催事従事者）」「既存客（催事従事者）」「訪問者（イベント参加者）」という3つのユーザーがおり、トップページは主に「1.新規客が魅力を感じる構成にすること」に焦点を当て作成しました。 また訪問者（イベント参加者）が不要なコンテンツ（催事従事者のための情報）を避け、目的の情報（アクセス）にたどり着きやすいよう、PCもSPもアクセスページへの導線は差別化しています。

トップページは主に「1.新規客が魅力を感じる構成にすること」

アクセスページの強化

アクセスページのユーザーは「新規客（催事従事者）」も含まれますが、メインは「訪問者（イベント参加者）」です。訪問者のネットリテラシーは開催イベントにより異なり判別できないため、多角的で十分なコンテンツ量を確保しました。

具体的には、地図や路線図の印刷・ダウンロードボタンの配置や地下鉄出口から会場までの順路図、また遠方から参加し東京・大阪の土地勘の無い訪問者のために広域路線図や主要駅から最寄駅までのおよその所用時間の表記、同じ参加者に情報をシェアできるようSNSボタンの配置などです。

アクセスページの強化

「既存顧客」「新規顧客」「エンドユーザー（会場を利用する方）」を意識したスマホレイアウト

タップエリアは年齢の高い方でも押しやすいよう高さや幅をある程度確保しました。また横スクロールが発生する場所はスワイプの動作が必要であることを補足で入れています。

またページの情報量が多く、縦に長くなり長距離スクロールしないと目的のコンテンツにたどり着けないようなページは上部にページ内リンクを配置しています。

どの端末からも共通して同じ状態が映るWEBフォントの採用は行わず、訪問者のスマホアクセス数も考慮し、デバイスフォントを使いページの読み込み速度の方を優先させました。

スマホレイアウト

「活用事例」「フォトギャラリー」「レンタル料金一覧表」「よくある質問」「トピックス」をお客様側で更新可能に

活用事例

複数の画像を投稿してスライダーで閲覧できるようにしています。 イベントの概要説明、開催種別、使用ホール、収容人数なども簡易的に表示できるように実装しました。また、カテゴリーごとに投稿を絞り込むことも可能です。

フォトギャラリー

「施設内」「外観・車路・搬出入EV」「活用事例」など、大カテゴリーごとにタブ切り替えを設けて写真を掲載しています。 さらにその中に子カテゴリーを設けて、数多くの写真を種類別に見やすく表示させることができます。 画像の掲載、削除作業はもちろん、カテゴリー部分もお客様側で編集可能となっています。

フォトギャラリー一覧ページ

フォトギャラリー 作業画面

レンタル料金一覧表

料金表の編集、追加、削除ができるようにすることはもちろん、合わせて掲載している画像の差し替えも簡単にできるように制作しました。

レンタル備品料金表ページ

レンタル備品料金表 作業画面

よくある質問・トピックス

QAの編集、追加、削除ができるように設定しました。 トピックスでは記事の投稿ができるようにように設定しました。また、お客様側で簡単に画像のモーダル表示ができるよう、専用のユニットも実装しました。

よくある質問ページ

よくある質問 作業画面

a-blog cmsで構築してよかった点

今回は大きく分けて「総合サイト」「大阪サイト」「東京サイト」の3つに分かれます。 a-blog cmsでは、マルチブログの運用に適しているのでその強みを活かせたものになったと思います。

お客様から、更新頻度の高いページに関しては簡単に項目や記事の編集、追加が行えるようにという要望があったため、豊富なカスタマイズ機能により実装することができました。

実装後の状況・反響（サン・レッツ様よりの声）

今回のリニューアルで管理等の面で変わったところ

リニューアル前は更新できる部分がトピックス記事の投稿しかできませんでしたが、活用事例、フォトギャラリー、レンタル備品料金表、よくある質問など更新頻度の高いページの編集作業が可能となり、自分たちで運用できる範囲が広がりました。

リニューアル後のお客様（サンライズビル様のお客様）の反応

イベントホールの活用事例は実際にホールをどのように利用しているのかをイメージしやすいようになっている。とコメントをいただいています。

株式会社 菅組様のコーポレートサイトを制作させていただきました。

菅組様は、同じ香川県の建築会社で、三豊市仁尾町を拠点に数々の建造物を手がけられています。

今回のサイト制作にあたって、建築会社のコーポレートサイトとしての役割はもちろんですが、 地域に密着した活動や、自然を保護し、自然と寄り添う企業としての思いなどもあり、 それらもサイト上で表現しています。

今回制作させていただいた、菅組様のサイトの強みはコンテンツの充実度です。 菅組様の理念や歴史・伝統を反映した濃いコンテンツと、積極的に更新・追加いただいている ブログや竣工作品などの大量のコンテンツがあります。

a-blog cmsを導入したことによるメリット

今回、a-blog cmsを採用することでブログや竣工作品、自社で発行する季刊誌のWeb版など、 お客様自身でもコンテンツを追加いただきやすくなり、積極的にコンテンツを作成いただいています。

せっかく素敵なコーポレートサイトができあがっても、 コンテンツの更新ができず、サイトの時が止まっている というのはありがちな話ですが、CMSの活用に関する密なコミュニケーションや 担当の方の熱心な更新で存分にサイトをご活用いただくことができています。

特に竣工作品ページは、以前のサイトではすべて表現しきれていなかった、 数々の実績が目に見えるようになり、建築会社としての信頼性の高さや 医療福祉施設からリノベーション、古民家改修まで手がける菅組さんの幅の広さなどを 表現できるいいコンテンツになったと思っております。

竣工作品の一覧ページ

濃い内容のコンテンツたち

また、CSRコンテンツとして作成した「自然と寄り添う」では、 菅組様の自然の恵みを利用した家造りや、環境や地域に対する強い思いを 素敵な写真と文章で表現しています。

ここまで、内容が充実していて、かつ読み応えあるCSRコンテンツは 他にはなかなか無いかと思います。

自然と寄り添う（CSRコンテンツ）

香川の建築・住宅・リノベーション 株式会社 菅組 | 株式会社 菅組

香川の建築・住宅・リノベーション 株式会社 菅組 | 株式会社 菅組

一世紀以上前から讃岐の地に根づき、建築にたずさわってきた私たち。それは同時に地域の木を使い、風景をつくってきた歴史でもあります。

またデザイン面においても、デザイナー自身も何度も足を運び、 社長から直接サイトにかける思いやご要望をお聞きしました。

サイトの印象を決める写真についても、お客様自身で撮影された 素敵な写真を存分に使用しています。

お客様とのタッグでサイトが完成し、公開後もCMS機能を存分に活用されて どんどんとコンテンツが充実していく、生きたサイトとして、 菅組様のサイトを紹介させていただきました。

GeoLocation(ジオロケーション)によるサービス強化

以前のサイトは、Movable Typeで作られており、バージョンも古くスマホ、SSL対応含めたリニューアルのご依頼をいただきました。サイトリニューアルに際して以下のようなご要望をいただきました。

今回、サイト自体のデザインは、踏襲して大幅に変更しない前提で、Movable Typeからa-blog cmsに変更し、GeoLocationを使った店舗情報を表示することで、エンドユーザーの位置情報から一番近いお店を上位に表示することで本部への電話による問い合わせの軽減を測りました。

左の写真はリニューアル前、右の写真はリニューアル後の店舗一覧です。 右側は、ジオロケーションで現在いる位置から近い順に表示され、距離も合わせて表示されるようになっています。

サイトリニューアル後に電話自体の件数は、残念ながら増加しました。理由としては、サイトをリニューアルしたことでアクセスボリューム自体が増えたため、電話の総数自体が増えたからです。結果としては、GeoLocationを使うことで、日々変わる現場で急ぎで必要となる資材を近くのお店で調達できるようになり、多店舗展開の利点を生かしたお店の紹介が可能な仕組みになり、お客さんが増えたので嬉しい悲鳴となりました。

また現場の担当者が、ブログを簡単に更新できるようになったことから、以前より頻繁にアップしてくれるようになりました。ダイレクト編集機能を使うことで画像の変更も変更したい画像の上でクリックして簡単に変更できるなど、ITリテラシーが高くないユーザーでも簡単に対応できるようになりました。

他にも店舗担当者の移動があるということで、ユーザー管理画面にカスタムフィールドで所属店舗などの情報を持つことで、将来、店舗が変更しても簡単に変更できるようなカスマイズをしました。

a-blog cmsを選択した理由

以下の理由から今回の制作においてa-blog cmsを選択いたしました。

• ジオロケーションの機能が基本機能として実装されており、位置情報を使った並び替えが容易にできる
• ユーザーのカスタムフィールド機能のおかげでユーザー管理が容易にできる
• ブログの登録・編集がみたまま操作することが可能で、ユーザービリティが非常に良い

最後に、a-blog cmsには、WEB制作において必要な機能がディフォルトで実装されており、工夫次第で色々なことに柔軟に対応できます。ライセンスは有償ですが、結果的にメンテナンスコストなどを考えると非常に安価と言えます。

多数のキッチン関連商品を開発・製造・販売するアルファミック株式会社様。クッキングシートやくっつかないホイル等のイチオシ商品の使い方やメリット、開発の経緯等を掲載し、商品の魅力をしっかりとアピールできるウェブサイトにしました。BtoB取引も活発で、ウェブサイトからはOEM製造のご相談を受け付けており、丁寧なヒアリングで正確に要望を聞き取り、販売先や展開先もご提案する、手厚い取り組みを行っています。

ウェブサイトにa-blog cmsを導入することで、企業広報だけでなく、「商品情報」を自由に変更できる仕組みを導入しました。

商品をCSVで一括登録

アルファミック様は、取り扱う商品のジャンルが多彩で、その中に紐づく商品点数も多く、さらに商品の名称やサイズ、内容量もさまざま・・・。大量で複雑な商品情報をCMS管理に移行する必要があったため、テーマの設計が完了し、数点の商品登録テストを行ったあとは、商品情報を一括でインポートできる「CSVファイルからのインポート」を利用しました。

CSVファイルは、Google スプレッドシートでお客様に用意していただいた「商品管理シート」から出力し、インポートできる形式への微調整を行いました。一つ一つ商品を登録するよりも、遥かに少ない工数で、商品登録が済みました。

商品の情報はカスタムフィールドグループで管理

商品には、例えば「アルミホイル」というカテゴリーの中に、6種類の商品ジャンルが属します。さらに1種類に付き、取り扱い商品が数種類存在します。この取り扱い商品を一つ一つをエントリーにしてしまうと、編集画面が膨大な数になり、管理がしずらくなってしまいます。効率良く管理していただくため取り扱い商品を「カスタムフィールドグループ」で管理し、1つのエントリー編集画面で見通すことができ、かつ順番変更が容易な仕様にしました。

CMSで管理するコンテンツは、その情報構造が複雑であればあるほど、管理画面はより操作性の高いものであるべきだと考えます。a-blog cmsは管理画面をHTMLベースでカスタマイズできるため、クライアント様の要望以上に管理しやすい管理画面を構築できます。

制作意図・経緯

「山形を旅するように楽しむ」をコンセプトに、山形県内の写真を中心としたストックフォトサービス「YAMAGATA IMAGES」を開始しました。従来のストックフォトサービス（レンタル写真／写真素材サイト）と大きく違う点は、商用素材の提供に加えて、山形県内の名所・名物の紹介文と紹介サイトへのリンクを併載していることです。

写真利用を目的としない方にも、山形県の美しい風景や貴重な歴史文化施設などを提示し、山形への旅や観光を促進すること、山形のファンづくりを目的に運営しています。

アピールポイント

ストックフォトの検索はキーワードだけでなく、山形県の４つの地域（村山・置賜・庄内・最上）別、やまがたの春夏秋冬・建造物・歴史文化・名物・自然（山・滝）などの各ジャンル別に、写真の閲覧が可能です。写真のほとんどは山形県内で撮影されたものや山形の食などが多く、撮影場所の市町村も明記しました。観光客へのアクセス案内や写真愛好家へのロケーションサービスを充実させることで、山形の観光資源の見直しや再発見に寄与します。

各テーマ内の写真をランダムに表示しています

問い合わせからオリジナルサイズの購入にも対応

a-blog cms を採用した理由、採用して良かったこと

開始当初は、将来的に素材販売を考え「EC-CUBE」で運営していました。ところが、画像のカテゴリーやテーマ分け、また検索したときの表示も思うような結果になりませんでした。そこで、再度、サイトコンセプトやターゲット等を見直し、システムも柔軟にカスタマイズができる「a-blog cms」で再構築することになりました。前システムに登録済みだった写真素材（エントリー）をa-blog cms に移動させるのには苦労しましたが、メンテナンスのしやすさ、機能改良や追加などにも対応できるので、切り替えて良かったと感じています。

撮影場所や状況によって複数項目に登録できるようにカスタムフィールドを作成

感想など

ヤマガタイメージズは、撮影者に写真の投稿をおまかせしています。a-blog cms の投稿画面は分かりやすいので、操作方法の説明も難しくありません。また、すぐに理解していただけていると思います。システムはまだ最新ではありませんが、アップデートとともに「YAMAGATA IMAGES」をブラッシュアップしていき、より使いやすいサービスを目指します。