自然化粧品の製造/輸入/卸・販売/研究開発会社 株式会社ネイチャーズウェイ様のECコンテンツサイト「ネイチャーズウェイオンライン」のサイト構築を担当しました。
昨今、コンテンツマーケティングによるWebサイトへの流入を構築することはオウンドメディアを育て広告だけに依存しない方法として認知が広まっています。
その中でリッチでユーザーにとって有益なコンテンツをタイムリーに発信していくには、コンテンツ発信に適したCMSを選定する必要があります。
ノーコードツールElementorとCMS:WordPressの組み合わせはこれに最適で、コーディング不要でコンテンツを配信できるので、デザイナーやディレクターだけで発信することが可能になります。
Good Thingsでは、ノーコードだけでの構築が良いと考えているわけではありません。
今までのサイト制作はディレクター・デザイナー・フロントエンジニアが共通認識を持つための資料を作成やMTGが不可欠な進め方でした。
しかしノーコードを採用すると、マーケッターに近いポジションのディレクターがコンテンツマーケを担当し、技術的に難易度が高いコーディングやAPI連携、JSといった部分にフロントエンジニアのリソースを集中せさせることで効率よくシステム構築・コンテンツ開発が出来、効果の高いWebサイトを構築することが可能と考えています。
本プロジェクトの目的
・ノーコードとWordPressでコンテンツサイトを構築することで、自然流入を増やす
・ノーコードで更新エリアを構築することで運用負荷を軽減する
・これまでECサイトとブランドサイトが別々に存在していたが、1つの環境に配置することで、ドメインを強化し、またツールを統一することで管理を楽にする
ノーコードツールElementorが適している理由
WordPressでは、ドメイン配下で共通のテーマを構築することが可能ですが、複数のブランドが同一ドメインに入る場合は子テーマなどでデザインを切り替える必要があります。
しかし、Elementorは各ページやカテゴリーに対してそれぞれデザインを適用することができるため、ブランドごとに世界観を維持しながら1つのCMSでハンドリングすることが可能です。
また、既存ページの移植に関してはhtmlとElementorの組み合わせで構築しました。
これはすでにhtmlで存在しているページをElementorで書き起こすのは、新規作成と同等の工数になりコストアップになるため、既存のものを流用しつつ、更新頻度の高い箇所だけElementorを読み込ませました。
Elementorの機能でも不足している部分は、CSSを個別に追加したりJava Scriptを実装することで補いました。
またサイト統合にあたり、リダイレクトの設計も行うことと、それまで使用されていたECをコンテンツサイトの後方に配置することで、ECサイトを商品情報機能、カート機能、マイページ機能と定義してユーザーの回遊のしやすさを設計しました。
ネイチャーズウェイ様 Webサイト
ECのTOPページとしてコンテンツページを置き、各ブランドページがその配下にぶら下がっている状態をご覧いただけます。
開発概要
<システム概要>
ECの情報発信という役割を担ったコンテンツサイト。
基本設計期間 : 4.5ヶ月(2020年5月〜)
開発期間 : サイト設計約1ヶ月 並行して移行コンテンツ洗い出し、移行作業・構築作業のプログラム開発4ヶ月(約10人月)
クライアント社内の方へのElementorレクチャー
システム種別 : Eコマース
開発手法 : アジャイル開発
担当機能 : フロントページ全て、CMS設計
担当 : 要件定義・画面設計・機能設計・デザイン・開発ディレクション・開発/実装・開発ツール選定・インフラディレクション・テスト
画面数 : 164画面
<工夫したポイント>
・ノーコードとコーディングとの使い分けによるハイブリッド開発
・時限公開、サードパーティータグ埋め込み、コンテンツごとのヘッダー・フッター出し分け、ショートコードとページ組み込みの組み合わせによって読み込みスピードと運用管理負荷の軽減
Project Manager:Erina Hosho
Web Development:Ryoma Sato, Y.H
Director & Tester:Yoshiaki Sakaguchi, R.H, A.K, Kazuki Eto
Technical Support:M.S
Design:C.F
Thank you for other many people…