制作プロセス紹介

WEB 01

本家森本屋

https://iwakuni-machiya.com

岩国城を山上に仰ぎ、街を歩けば江戸時代からの人々の暮らしの息吹が随所に感じられる山口県岩国市。有名な錦帯橋にほど近い旧街道沿いに1軒の美しい町屋があります。
ご自身のご実家でもあるこの家を、次の150年に繋げていくため数年をかけて大改修されたオーナーの森本さまから、文化交流スペースとしてのオープンを期して、ウェブサイト制作のご依頼をいただきました。

本家森本屋ウェブサイト、ファーストビューのスクリーンショット

“宿泊や滞在を通して、岩国の歴史・文化に触れられる特別な場所”

クライアントの森本様には、数年前に別のお仕事を通じてお世話になっておりました。久しぶりのお電話で、江戸末期に築造された町屋(ご実家)を大改修されたこと、そこを岩国の歴史・文化を体験できる交流スペースとしてオープンするつもりなので、ウェブサイトをお願いしたい、とご相談いただきました。

写真を拝見すると、漆喰の白壁をリズムよく区切る黒々とした柱。屋内をぐるりと囲む長い長い土間(町屋ならではとは後で知りました)。しかも最奧には銀色に輝くシェフ仕様キッチンが。—この段階からもう沢山の人が往来して楽しむイメージが自然と浮かんできました。

歴史的価値も高く、何より大切なご実家を舞台にしての一大事業のスタートに際し、頼りにしていただけることを、とにかく嬉しく思いました。

この段階の実施内容

  • お問い合わせ・ご相談

ウェブサイト制作・開設の
お見積もり・ご発注

今回は、まずは『パンフレットになるウェブサイトを』とご相談いただきました。素材は一旦あるだけをお送りいただき、ニュースやブログなど(システム)不要、ホームページのアドレスとなるドメインは必要、英語版も必須。とお伝えいただき、概算見積もりを算出いたしました。

ご了承・ご発注いただき、制作をスタートいたします。

お見積もり時の確認事項

  • 開設したいウェブサイトのタイプ(活用の目的)
  • ご予算
  • ページ数等、ボリューム感
  • 素材の準備方法。原稿、写真、映像、ロゴマーク等、また左記の新規作成依頼
  • 更新システムや決済システムの要不要(WordPressやECの導入)
  • メールフォーム(予約・注文・お問い合わせ等)の要不要
  • サーバーやドメイン契約の要不要
  • 他言語への翻訳の有無(プロの翻訳者の起用)

※制作途中に対応範囲・ボリュームに変更が出た場合には再見積もりいたします。

この段階の実施内容

  • お見積もり
  • 承認/ご発注

意識共有を深めアイデアを洗練

ここから実作成のスタートです。

ウェブサイト作成に際しては、既存パンフレットなどがある場合そちらを基準として方向を定めたり、また素材として利用できる場合がありますが、今回は真っさらの状況からプレゼンテーションを組み立てる必要がありました。(責任重大ですが、最もクリエイティブで心踊る仕事でもあります。)

まず当方で必要な情報を集めるためのヒアリングシート(20問程度)を作成し、森本さまにご記入いただきました。ご回答が記入されたシートを電話ミーティング(岩国←→東京でしたので)で一緒に確認しつつ意識共有を深めました。さらにアイデアを出し合い、情報収集をお手伝いいただき、だんだんとコンテンツの骨子が整っていきました。

例えばウェブサイトにある『本家森本屋のある「川西」のおはなし』は、かつて森本さまのお父様が、ふるさと川西の歴史・産業について調査をされた内容で、上記のような流れの中でウェブサイトに組み込みました。本家森本屋の世界観に一層厚みが出たように思います。

ところで、本家森本屋のドメイン名は iwakuni-machiya.com です。当方からの提案はこれも含め他に数案をお伝えしましたが、屋号そのままのhonke-morimotoya.com ではなく、このドメイン名をお選びにになったのは『英語圏の方に発音しやすい』という観点からでした。ドメイン名についてのアクセシビリティの配慮に目から鱗でした。

この段階の実施内容

  • ヒアリング
  • プロモーション計画
  • コンテンツ構成
  • タイトル・ドメイン決定
  • プロバイダーとの契約
ファーストビュー
ロゴデザイン ——古い木箱にあった筆文字からの書き起こし
コーナーごとに変化をつけた表現
岩国探遊 ——観光スポットと街の歴史を紹介

デザイン、コーディング
お客様レビューを経て、ウェブサイトの完成

デザイン命題

本家森本屋は、どのような人に、どのようなシーンでご利用いただいたら、より楽しんでいただける・よりご満足いただけるスペースなのか? この点について、クライアントの森本さまは明確なビジョンをお持ちでした。
ウェブサイトはこのビジョンの実現を加速するものです。クリアなビジョンに沿って、私もデザインを自然と組み立てていくことができたように想います。

——私は、ウェブサイトに限らず、媒体のデザインをしたり、執筆ををするとき“関連性を感じさせる”ことを重視しています。新しいものがユーザーの目に触れたとき「あ!これは私が探していたものかもしれない」「いつか使ってみたいかもしれない」などユーザーが“自分と関係するものだ”と感じてくれたなら、一つ成功だと思っています。本家森本屋の写真を目にして「美しい」と思うのは当たり前で、「自分も使ってみたいな」と思っていただけたなら成功です。

今回はロゴの作成もお手伝いさせていただきました。蔵の奥にあったという木箱に屋号を記したものが何点かあり、その中から1点を選びトレースしロゴにしました。(ちなみに「本家」の「本」が“くずし字”であったため、くずし字のサンプルと見比べ同じ字体を確認した上で再現しました!)
ロゴの基調色は、森本さまのご要望を受け、本家森本屋の木材の色“黒いベンガラ”に決まりました。わずかに赤みのある黒、いかがでしょうか?

UI/エディトリアルデザイン

ウェブサイトの体裁は“シングルページデザイン”を選択しました。1ページに全ての内容を備え、ページを下へ下へスクロールしてご覧いただく構造です。
一番上の表紙ページにはメニューを備え、見たい情報をすぐ開くことも可能です。

コーディング

今回のウェブサイトは WordPress等のシステム導入はなく、静的なHTML/CSS/JSで作り上げています。(すべてVS code を使っての手書きコーディングです)

公開/検索エンジンへの登録

レビューと調整を経て、予定日に無事公開いたしました。

ウェブサイトは公開後、Google Serach Console 等を活用し、検索エンジンのインデックスへ登録リクエストを行います。また Googleビジネスプロフィール / Googleマップ の活用も重要で、欠かせません。検索エンジン対策は標準的な対応のみ行っておりますが、手書きのHTMLがクリーンなためか良好な結果が得られています。GoogleやBingで「岩国 町屋」などと検索すると、1番に表示されることをご確認いただけると思います。「岩国 レンタルスペース」も1ページ目を確保しています。

この段階の実施内容

  • アートディレクション
  • デザイン
  • シンボルマーク・ロゴデザイン
  • コーディング(HTML/CSS)
  • プログラミング(javascript)
  • 検索エンジン対策(SEO)
  • Google Analytics 4 (GA4)
  • Google Tag Manager (GTM)
  • 公開(サーバー設定・操作)
  • Google Search Console
  • Googleビジネスプロフィール(MEO)
  • Googleマップ(MEO)

公開後〜現在

  • 日本語版の第一段公開後、新たに設備ガイド(日本語/英語併記)の作成のご依頼をいただき、岩国へ取材へ伺いました。ウェブサイトの英語版制作のための取材にもなりました。
  • インバウンド向けの記事(Iwakuni and Japanese Traditional Houses)の書き起こし: 日本についての知識が少ない方が読んでも楽しめ、理解が深まり、より一層岩国滞在の楽しみが広がるように、別の原稿を書き起こしました。
  • 原稿の翻訳は、いつも素晴らしい翻訳をしていただけるプロの翻訳家に依頼。翻訳に関しては現在AI翻訳などもありますが、全く次元の違う翻訳をしていただけます。いうならば読んで心地よく、読んだ人の心を動かすパワーの強い翻訳です。
  • 森本さまは Airbnb を介して宿泊予約を提供しており、一年を通して世界中から沢山の方々が宿泊利用されています。Airbnb でこれまでのレビューをご覧いただけますが、みなさん、伝統家屋での新鮮な体験とオーナー森本さまの温かな応対への感謝を記されています。

この段階の実施内容

  • 館内設備ガイド作成(印刷物)
  • 取材・執筆・撮影
  • プロの翻訳家による英語版

©2024 Keisuke Nakayama