1万8000人の登録クリエイターからお気に入りの作家を検索することができます。
WORKS
グラフィックデザイン > エディトリアルデザイン
9
View3
Fav1
Comment### 1. プロジェクト概要
- **プロジェクト名**: レンタルスペースサイト「U30レンタルオフィス」リニューアル
- **サイトの課題**:
- 既存のサイトはユーザービリティが低く、レスポンシブデザインがないため、モバイルやタブレットからの利用が減少していた。
- 問い合わせ数やレンタル申し込みの数が上がらなかったため、サイトの改善が必要だった。
- **目的と目標**:
- **ターゲット層**: 中小企業や個人事業主、特に中高年層の起業家や新しいビジネスを始めたい人々。
- **目標**: サイトの改善により、レンタルオフィスのユーザー申込数を増やし、組織の活用促進とユーザービリティの向上を目指す。
- **信頼感を与えるサイト構築**を目指し、ユーザーが安心してレンタルスペースを利用できるようにする。
- **実施した対策**:
- レスポンシブデザインを導入し、ユーザーのデバイスを問わず、広義にサイトを利用できるように改善。
- 特に中高年の利用者に向けた信頼性を重視したデザインと内容を導入し、シンプルで分かりやすい操作性を実現。
- 利用者の成功例やレンタルスペースの利用便利さをビジュアルで見せるように改良。
- SEO対策も全ページに導入し、ユーザーが探している情報を見つけやすくするためのメタ情報の最適化を実施。
- **制作期間**: 約4ヶ月
### 2. 制作技術
- **使用技術**: HTML、CSS、JavaScript、PHP、WordPressを使用してサイト構築。
- フロントエンドの構築においてはSCSSを使用し、コードの精度を保つと共にメンテナンス性を高めることに努めた。
- WordPressを利用し、クライアント自身がサイト内容を簡単に編集できるCMS環境を構築した。
- ユーザーのインタラクション性を向上させるため、JavaScriptで動的な動作を実装した。
### 3. 制作の背景・課題
- **クライアントのニーズ**:
- モバイルやタブレットでの利用性を向上させたい。
- 中高年層の利用者にとって使いやすく、信頼できるサイトを作成し、問い合わせ数を増やしたい。
- **課題と解決策**:
- **課題**: ユーザーがサイトを正しく利用できていない、あるいはユーザー体験が不足していた。
- **解決策**: レスポンシブなユーザー体験を持たせるためにモバイル対応デザインを実施。また、中高年の利用者にも使いやすいシンプルなインターフェースを提供し、サイト全体にわたる情報を見やすくするためのリデザインやナビゲーションを改善した。
### 4. デザインとビジュアル
- **スタイルガイド**:
- カラーパレットは横揉くのようなブルー、信頼性とプロフェッショナリズムを意識したものを使用した。
- フォントは視認性が高いさらに、ユーザーが直感的に情報を理解できるようにガイドラインを作成。
- 中高年層が見やすいよう、フォントサイズやコントラストに配慮し、情報を整理。
- **ワイヤーフレーム・プロトタイプ**:
- 初期段階でワイヤーフレームを作成し、ユーザーの利便性を検証した。
- ユーザーテストも実施し、中高年層に対する使いやすさも確認しながら、最適化されたユーザー体験を構築。
- **画面キャプチャ**:
- 完成した各ページの画面をキャプチャし、問い合わせフォームや申込みフローの改善点を強調した。
### 5. 機能と特徴
- **メイン機能**:
- レンタルスペースのサービス紹介、料金詳細、FAQ、問い合わせフォームなどを設置し、ユーザーが必要な情報を簡単に見つけられるようにした。
- FAQには、よくある質問をモレーティブに追加し、中高年の利用者が問い合わせをせずに情報を得られるようにすることで、問い合わせの負荷を軽減した。
- **技術スタック**:
- HTML、CSS、JavaScript、PHP、WordPressを使用して構築。
- ページの読み込み速度を最適化するために、キャッシュプラグインや画像圧縮ツールも実施。
- **レスポンシブデザイン**:
- モバイル、タブレットのための設計を適切に調整し、ナビゲーションやボタンのレイアウトを改善し、ユーザー体験の向上を実現した。
- 中高年層に配慮し、シンプルなメニュー構成と大きなタッチターゲットを採用。
- **SEO対策**:
- メタ情報を最適化し、ユーザーが探している情報を簡単に見つけられるようにした。
- リッチスニペットも活用し、検索エンジンでの視認性を向上させた。
### 6. 成果・実績
- **アクセス数やコンバージョン**:
- リニューアル後、アクセス数が約200%増加し、問い合わせ数も大幅に増加した。
- 特に中高年層のモバイルデバイスからのアクセスが向上し、全体の使用者の多くを占めるようになった。
- **ユーザーフィードバック**:
- 「レスポンシブで直感的に利用できるようになった」「申込が方便になった」という評価を受けた。
- 中高年層からも「簡単で分かりやすい」「安心して利用できる」とのポジティブなフィードバックを得た。
- クライアントからも「問い合わせ数が増えたことで予想以上の結果を得られた」とのフィードバックを受けた。
- **改善点と今後の展望**:
- FAQやユーザーが必要とする情報をもっと充実させることを検討。
- 動画コンテンツを更新し、ユーザーにとってより解りやすくし、信頼性を向上させることを目指す。
- AIチャットボットの導入も検討し、ユーザーからの質問に広義に対応できる環境を構築する予定。
- 特に中高年層のニーズに応じたサポート体制の強化を図る。
1920px
2ヶ月
U30レンタルオフィス
by hpプラス
### 1. プロジェクト概要
- **プロジェクト名**: レンタルスペースサイト「U30レンタルオフィス」リニューアル
- **サイトの課題**:
- 既存のサイトはユーザービリティが低く、レスポンシブデザインがないため、モバイルやタブレットからの利用が減少していた。
- 問い合わせ数やレンタル申し込みの数が上がらなかったため、サイトの改善が必要だった。
- **目的と目標**:
- **ターゲット層**: 中小企業や個人事業主、特に中高年層の起業家や新しいビジネスを始めたい人々。
- **目標**: サイトの改善により、レンタルオフィスのユーザー申込数を増やし、組織の活用促進とユーザービリティの向上を目指す。
- **信頼感を与えるサイト構築**を目指し、ユーザーが安心してレンタルスペースを利用できるようにする。
- **実施した対策**:
- レスポンシブデザインを導入し、ユーザーのデバイスを問わず、広義にサイトを利用できるように改善。
- 特に中高年の利用者に向けた信頼性を重視したデザインと内容を導入し、シンプルで分かりやすい操作性を実現。
- 利用者の成功例やレンタルスペースの利用便利さをビジュアルで見せるように改良。
- SEO対策も全ページに導入し、ユーザーが探している情報を見つけやすくするためのメタ情報の最適化を実施。
- **制作期間**: 約4ヶ月
### 2. 制作技術
- **使用技術**: HTML、CSS、JavaScript、PHP、WordPressを使用してサイト構築。
- フロントエンドの構築においてはSCSSを使用し、コードの精度を保つと共にメンテナンス性を高めることに努めた。
- WordPressを利用し、クライアント自身がサイト内容を簡単に編集できるCMS環境を構築した。
- ユーザーのインタラクション性を向上させるため、JavaScriptで動的な動作を実装した。
### 3. 制作の背景・課題
- **クライアントのニーズ**:
- モバイルやタブレットでの利用性を向上させたい。
- 中高年層の利用者にとって使いやすく、信頼できるサイトを作成し、問い合わせ数を増やしたい。
- **課題と解決策**:
- **課題**: ユーザーがサイトを正しく利用できていない、あるいはユーザー体験が不足していた。
- **解決策**: レスポンシブなユーザー体験を持たせるためにモバイル対応デザインを実施。また、中高年の利用者にも使いやすいシンプルなインターフェースを提供し、サイト全体にわたる情報を見やすくするためのリデザインやナビゲーションを改善した。
### 4. デザインとビジュアル
- **スタイルガイド**:
- カラーパレットは横揉くのようなブルー、信頼性とプロフェッショナリズムを意識したものを使用した。
- フォントは視認性が高いさらに、ユーザーが直感的に情報を理解できるようにガイドラインを作成。
- 中高年層が見やすいよう、フォントサイズやコントラストに配慮し、情報を整理。
- **ワイヤーフレーム・プロトタイプ**:
- 初期段階でワイヤーフレームを作成し、ユーザーの利便性を検証した。
- ユーザーテストも実施し、中高年層に対する使いやすさも確認しながら、最適化されたユーザー体験を構築。
- **画面キャプチャ**:
- 完成した各ページの画面をキャプチャし、問い合わせフォームや申込みフローの改善点を強調した。
### 5. 機能と特徴
- **メイン機能**:
- レンタルスペースのサービス紹介、料金詳細、FAQ、問い合わせフォームなどを設置し、ユーザーが必要な情報を簡単に見つけられるようにした。
- FAQには、よくある質問をモレーティブに追加し、中高年の利用者が問い合わせをせずに情報を得られるようにすることで、問い合わせの負荷を軽減した。
- **技術スタック**:
- HTML、CSS、JavaScript、PHP、WordPressを使用して構築。
- ページの読み込み速度を最適化するために、キャッシュプラグインや画像圧縮ツールも実施。
- **レスポンシブデザイン**:
- モバイル、タブレットのための設計を適切に調整し、ナビゲーションやボタンのレイアウトを改善し、ユーザー体験の向上を実現した。
- 中高年層に配慮し、シンプルなメニュー構成と大きなタッチターゲットを採用。
- **SEO対策**:
- メタ情報を最適化し、ユーザーが探している情報を簡単に見つけられるようにした。
- リッチスニペットも活用し、検索エンジンでの視認性を向上させた。
### 6. 成果・実績
- **アクセス数やコンバージョン**:
- リニューアル後、アクセス数が約200%増加し、問い合わせ数も大幅に増加した。
- 特に中高年層のモバイルデバイスからのアクセスが向上し、全体の使用者の多くを占めるようになった。
- **ユーザーフィードバック**:
- 「レスポンシブで直感的に利用できるようになった」「申込が方便になった」という評価を受けた。
- 中高年層からも「簡単で分かりやすい」「安心して利用できる」とのポジティブなフィードバックを得た。
- クライアントからも「問い合わせ数が増えたことで予想以上の結果を得られた」とのフィードバックを受けた。
- **改善点と今後の展望**:
- FAQやユーザーが必要とする情報をもっと充実させることを検討。
- 動画コンテンツを更新し、ユーザーにとってより解りやすくし、信頼性を向上させることを目指す。
- AIチャットボットの導入も検討し、ユーザーからの質問に広義に対応できる環境を構築する予定。
- 特に中高年層のニーズに応じたサポート体制の強化を図る。
1920px
2ヶ月
published : 2024/10/31