| 制作物のタイトル | ねころび庵Café Mofumofu Webサイト制作（進行中） |
| クライアント名 | ねころび庵Café Mofumofu |
| 制作意図 | Webサイト制作における「企画」「設計」「デザイン」の一連の流れを習得するために制作しました。ユーザーが心地よく情報を得られるようなサイトを目標に、ワイヤーフレーム作成からデザインラフまでを実践的に行い、デザインとコーディングの橋渡しを学ぶことを目的としました。 |
| 制作の概要 | 「ねこと触れ合える古民家風カフェ」を想定し、Webサイトを制作しました。Photoshopでワイヤーフレームを設計し、その後デザインラフを作成。写真の配置確認にAdobe XDを初めて導入し、完成イメージを具体化しました。 |
| 🎨制作時に意識したポイント | ユーザー導線を意識したワイヤーフレーム: ユーザーが知りたい情報にスムーズにたどり着けるよう、コンテンツの配置を論理的に整理しました。特に、初めてのLPワイヤーフレーム制作だったため、情報の優先順位を明確にすることを意識しました。 デザインと素材の調和: サイトのコンセプトに合わせ、猫たちの愛らしい写真や、古民家風の温かい雰囲気を活かすデザインを心がけました。写真を主役に据え、余白を適切に使うことで、洗練された印象を与えています。 効率的なツール連携: Photoshopでデザインを作成し、写真の配置やレイアウトの確認にAdobe XDを初めて活用しました。これにより、デザインの全体像をより客観的に把握し、効率よく作業を進めることができました。 |
| 💡デザインコンセプト | 「心と身体を癒す、温かな空間」をコンセプトに、古民家カフェが持つ懐かしく落ち着いた雰囲気と、猫たちの愛らしい姿を融合させました。訪れる人がリラックスできるような、シンプルでやさしいトーンのデザインを目指しました。 カラースキーム: 落ち着いたブラウンやベージュをベースに、猫たちの色合いが映えるように配色しました。 タイポグラフィ: 筆文字風のフォントと読みやすいゴシック体を組み合わせ、和風の温かさと、現代的な見やすさを両立させています。 |
| 💻使用ソフト | Adobe Photoshop 2025、Adobe XD |
| ⏰制作時間 | 300分 |
ワイヤーフレーム完成品
製作時間
デザインラフ（本日までの途中経過）
製作時間
Adobe Xdを使用
No responses yet