架空のお花屋さんを想定してWEBサイトを作成しました。
作品について
【Table Of Contents】
制作物タイトル | flowerdaysWebサイト |
クライアント | 架空のお花屋さん |
制作意図 | この作品は、「シンプルで洗練された、居心地の良いWebサイト」をコンセプトに、架空のフラワーショップのWebサイトを想定して制作しました。訪れる人が、まるで実際の店舗を散策しているかのように、心地よい気分で商品や情報を楽しむことができる空間を目指しました。 |
制作の概要 | HTMLとCSSを用いて、デザインカンプからWebサイトを制作しました。ヘッダー、メインビジュアル、商品紹介、店舗情報、フッターといった主要なセクションを構築し、「見た目の美しさ」と「使いやすさ」の両立を意識して実装しました。 |
制作時に考慮した点 | 世界観の統一: 写真が持つ温かみや、店舗のナチュラルな雰囲気を壊さないよう、フォントの選定や余白の取り方を細かく調整しました。特に、明朝体とサンセリフ体を組み合わせることで、洗練された印象を与えています。 レスポンシブデザイン: スマートフォンやタブレットなど、多様なデバイスで快適に閲覧できるよう、Flexboxやメディアクエリを使用し、画面サイズが変わってもレイアウトが崩れないように配慮しました。 コンテンツの配置: ユーザーが知りたい情報にスムーズにたどり着けるよう、情報を整理し、見やすいレイアウトを意識しました。特に、店舗情報へのアクセスを分かりやすくするために、地図画像を配置しています。 |
デザインコンセプト | サイトは訪問者が迷わないようシンプルな構造に。 お店が新宿にあるという立地上、都会的な雰囲気にしました。 「心地よい散策」をコンセプトに、ナチュラルで温かみのある世界観を表現しました。 カラースキーム: 植物や花の自然な色合いを活かしつつ、背景は白を基調として清潔感を出し、アクセントカラーにはピンクや緑を部分的に使用しました。 タイポグラフィ: 明朝体とサンセリフ体を使い分けることで、高級感と読みやすさの両方を実現しています。 |
使用ソフト | TeraPad(HTML、CSS) |
制作期間 | 400時間(約16日間) |
遷移先URL |
PC画面用

スマホ画面用

No responses yet