六本木ヨガ様ブログカスタマイズ

http://ameblo.jp/eriko-yoga-colors/

Category:

Type:アメブロカスタマイズ

Concept:Webサイト代わりになるブログ

Skill: /
et_ame

「現在使用しているブログにWebサイトに近い機能を持たせる」 というコンセプトでアメーバブログのカスタマイズをさせていただきました。
ご本人様がお好きな「海」のイメージを取り入れながら、クリーンで爽やか+穏やかめな空気感を意識してデザインしています。比較的に情報量が多いので各コンテンツのメリハリは出して区別しつつ、カラーコントラストを抑えて柔らかくなるようにしました。

ブログサイトをWebサイト(コーポレートサイト等)として使用するにあたり、ブログサイトの構成そのままではうまく機能しない為、インターフェース部分は大幅に手を入れています。

User Interface

et_ame2

スクロール量に応じて分割されたインターフェース

  • ナビゲーションエリア
  • メッセージエリア
  • エントリーエリア
  • フッターエリア

の4つのパートを横割りにし、今どのパートを観ているかに応じたナビや関連情報を表示するように。

バイリンガル表示

受講されている方にも海外の方が多くいらっしゃり、「英語でのレッスンも積極的に行っている」という部分を強調するデザイン。
クリック一つで画面遷移なしで英語表記と日本語表記を切替え(※一部)

et_ame3
et_ame4_

サブナビゲーションをビジュアル化したスライダー

メインビジュアルになるスライダー(スライドショー)はグローバルナビゲーション(サイト内のメインナビゲーション)の「About」に付随するコンテンツの紹介として。
概要説明をビジュアルイメージ付きで訴求することで概要がイメージしやすい仕様に。

関連サイトをまとめたフッターナビゲーション

外部サイトへのリンクやマップ、著作者情報など、サイトそのものの主要コンテンツから出ていくものをすべてまとめてフッターエリアへ配置。情報の整理整頓を。

et_ame10
et_ame5_

コミュニケーションスペースにも拘りを

ブログにおいて読者・閲覧者とコミュニケーションを交わせる大切なスペースだからこそ、味気ないものではなく。

JavaScript Not Working!

当サイトでは閲覧の快適性向上と、あなたの操作に対し応答を行う為にJavaScriptを利用しております。
JavaScriptがOffの状態ではこれらの機能が動作しません。本来の状態で閲覧するにはJavaScriptを「有効」にして、ブラウザの「再読み込み」をお願い致します。

» 各ブラウザでのJavascriptをオンにする方法