アークウェブのお手伝い事例:洋菓子・パンの「ラ・テール」様ウェブサイトのリニューアル(Zen Cart+Movable Type)

小森です。こんにちは。

東京世田谷を基盤に、素材にこだわった洋菓子とおいしいパンを作り続けている、ラ・テール様のウェブサイトがリニューアルオープンいたしました。
ラ・テール様は、お菓子好き/パン好きの方にも定評のある、地元のみならず全国に根強いファンの多い人気ショップです。

自然素材にこだわった大地の菓子・大地のパン | LA TERRE ラ・テール
http://www.laterre.com/

開発期間:2009年3月~4月
担当範囲:Zen Cart/CMS設計および実装、マークアップ、システム開発(JavaScript, PHP)、過去記事コンテンツ移行

3年前のリニューアル時に引き続き、今回もアークウェブが開発を担当させていただきました。

※前回のブログ記事もご覧ください

ラ・テール様のWebサイトリニューアルをお手伝いしました : アークウェブ ビジネスブログ
https://www.ark-web.jp/blog/archives/2006/07/post_19.html

リニューアルの目的

今回のリニューアルにあたり、

いたしました。

システム面では、前回開発したシステムを踏襲して、

しています。
ベースのシステムがあったこと、テンプレートシステムの活用、お客様の協力体制もあり、1ヶ月という極めて短期間でスピード構築することができました。

デザインのバリエーション

以前よりブランドが増えたこと、扱う商品に重なりがあること、打ち出したいイメージも若干違うということから、ひとつのマナーのもとに束ねるというより、よりブランドイメージを差別化し、存在を打ち出していく形に方針を定めました。

共通のテンプレートを使用しているため、レイアウト構成は同じである必要がありました。そこで色使いやフォント使いなど、あしらいの面でブランドごとの差別感を与えながらも全体として統一感がある、というデザインを目指しました。以下がそのバリエーションになります。
アナログ感を生かしたデザインは今回も健在です。

ラ・テール洋菓子店 ブーランジェリー ラ・テール テラ・セゾン アルティザン・テラ ラ・テール メゾン オンラインショップ


レイアウト

今回は対象画面解像度を上げ、横960pxで制作いたしました。
商品写真は前回から比較的大きめのものを使用していたのですが、それを活かし、コンテンツエリアは横いっぱいを贅沢に使用し、情報をゆったりと見せています。

構造的にも、視線の流れを考慮し、横にカラムを分けるのではなくリンクを下に集めることで、ほかの商品やページに横移動しやすく、回遊しやすい構造といたしました。


その他のポイント

などなどありますが、全体として世界観を伝えながら、より情報のわかりやすさが向上したサイトになったと思います。

ラ・テールさんのおいしい洋菓子やパンは、世田谷・東京駅の店舗のほか、渋谷東急でも販売しています。もちろん、オンラインショップでも(一部商品ですが)販売しておりますので、こだわって作られたお菓子やパンを、ぜひご賞味ください!