Portfolio

制作実績

WEB制作チーム「Millance」 HP制作

hdr_weak

自主制作

STUDIO

alarm

3か月

2025.07

WEB制作チーム「Millance」のHPデザインをチームメンバーと行いました。

実際のサイトはこちら▼
https://millance.site/

デザイン:Figma、Photoshop
実装:WordPress(自作テーマ)


情報設計・企画内容

■ターゲット
・ チーム「Millance」の活動内容や実績に興味を持つ個人や企業、クリエイター
・起業を考えているがWEBやチラシ、名刺など広告に手がまわらない方
・集客UPを考えている個人事業主

■サイトの目的
<実績公開>
 チームとしての制作物やプロジェクトをポートフォリオとして紹介し、チームのスキルや得意分野をアピールする。

<ブランディング>
 チームのコンセプトや価値観を伝え、Millanceならではの世界観を構築する。

<信頼構築>
 メンバーのプロフィールや活動への想いを公開することで、チームとしての信頼感と親近感を高める。

<お問い合わせ獲得>
 チームへの仕事依頼やコラボレーションの窓口を設ける。

■コンテンツ構成
シングルページ構成を採用し、サイト訪問者がスクロールするだけでMillanceの魅力を一通り把握できるように設計

<ファーストビュー(MV)>
 チームの世界観を象徴するメインビジュアルと、起業者向けに世界観を統一して作成したコンテンツをスライドで表示してユーザーの興味を引く。

<About>
 チームの活動内容やコンセプトを簡潔に紹介し、何をしているチームなのかを明確にする。

<Service>
 チームとして提供できるサービス内容を視覚的に分かりやすく提示し、依頼のイメージを具体化させる。

<Plan>
 各プランをカード形式で一覧表示し、詳細ページでさらに深く掘り下げられる構成。チームの技術力やクリエイティブ力をアピールする上で最も重要なセクション。

<Member>
 メンバーの顔写真とプロフィールを掲載することで、チームへの親近感を醸成し、誰が活動しているのかを明確にする。

<Contact>
 問い合わせフォーム(LINE)を配置し、仕事の依頼や相談をスムーズに行えるようにする。


デザインのポイント

<カラースキーム>
 白を基調に、パステル調のピンク、ミントグリーンといった淡い色合いをアクセントカラーとして使用しています。これにより、清潔感がありながらも、柔らかく優しく、そしてクリエイティブな印象を与えています。

<タイポグラフィ>
 全体的に丸みを帯びたサンセリフ体を使用し、サイト全体の雰囲気を親しみやすくしています。

<レイアウト>
 全体的にゆとりのある余白を多く取り、情報を詰め込みすぎないことで、洗練された見やすいデザインを実現しています。各コンテンツはシンプルなグリッドレイアウトで配置されており、ユーザーが直感的に情報を理解しやすいよう工夫されています。

<写真・イラスト>
メンバーの写真を多用し、チームの雰囲気とHPのテイストを統一し世界観を作り上げています。
また、メンバーの写真を使用することで、親近感と信頼感を高めています。
強みであるフォトプランをアピールするために、使用している写真は専属カメラマンによる撮影、レタッチしたものです。

<全体的な雰囲気>
 パステルカラー、ゆとりのあるレイアウト、そして親しみやすいタイポグラフィが組み合わさることで、「柔らかさ」「可愛らしさ」「温かさ」を感じさせるデザインに仕上がっています。ポートフォリオサイトでありながらも、チームの個性と魅力を存分に伝えるデザインにしています。

お問い合わせ