すべてのカテゴリ

デザインカンプ制作中です！本日はホームページ制作案件のデザインカンプ作成を進めていました。今回の案件では、単純に見た目を整えるだけではなく、・信頼感・親しみやすさ・遊び心といった複数の要素をどのようなバランスで表現するかを意識しながら制作を進めています。特にホームページのファーストビューは、サイト全体の印象を決める重要な部分です。使用する写真や配色、フォント選びによって雰囲気が大きく変わるため、何パターンも検討しながら方向性を探っています。また今回は、Photoshopを使ってデザインカンプを作成しており、実際にコーディングすることも想定しながら、・余白の取り方・コンテンツ幅・スマホ表示時の見え方なども考慮しながら制作しています。完成形をイメージしながらデザインを組み立てていく工程は難しさもありますが、その分とても勉強になりますね！引き続きクライアント様に喜んでいただけるサイトを目指して頑張ります✨

今日は、現在制作中のデモサイトのファーストビュー（FV）の写真を変更しました✨今回は、“暮らしの心地よさ”や“余白感”が伝わるような住宅イメージの写真に調整しています！写真が変わるだけでも、サイト全体の空気感や印象がかなり変わるので、FVは特にこだわりながら制作しています☺️また、このデモサイトは写真や文章を差し替えることで、さまざまな業種向けにアレンジできる構成になっています！そして本日の色彩検定では、「視細胞の種類」について学習しました👀人の目には、光を感じ取るための視細胞があり、明るい場所で働く「錐体（すいたい）」暗い場所で働く「杆体（かんたい）」の2種類があります。さらに錐体は、どの波長の光を主に感じるかによって3種類に分けることができます！S錐体短波長の青い光を感じるM錐体中波長の緑の光を感じるL錐体長波長の赤い光を感じる視細胞の分布視細胞には「錐体細胞」と「杆体細胞」の2種類があり、網膜上での分布にも偏りがあります。錐体は中心窩にピークがあり、そこから10°付近まで密集しています。そのため、色や細かい形を見ることに適しています！一方で杆体は、錐体よりも数が多く、中心窩から20°付近に分布のピークがあります。杆体は暗い場所でも働くため、夜間や暗所での視覚に重要な役割を持っています👀人の目って、普段当たり前に使っているけど、かなり精密な仕組みになっていて面白いですね✨

本日は、トップページが完成したデモサイトの全体イメージをご紹介します！これまでブログでは各セクションごとの制作過程を掲載していましたが、サイト全体のスクリーンショットはまだ掲載していなかったので、今回はまとめてご紹介してみました。今回のデモサイトは、ファーストビューABOUTNEWSSERVICECOMPANYCONTACTなどを1ページにまとめた構成となっています。また、写真や文章を差し替えることで、業種を問わずオリジナルサイトとして活用できるよう設計しています。「こんな雰囲気のホームページが欲しい」というイメージづくりの参考にもなれば嬉しいです✨トップページ完成↓↓色彩検定の勉強記録本日は「明順応」と「暗順応」について学習しました。順応とは、周囲の明るさに目が慣れることをいいます。明順応暗い場所から明るい場所へ移動した際に起こる現象です。比較的早く進み、数秒ほどで完了するといわれています。暗順応明るい場所から暗い場所へ移動した際に起こる現象です。暗順応には10〜15分ほどかかり、完全に順応するには約30分程度必要とされています。ロドプシンとの関係杆体（かんたい）に含まれる視物質「ロドプシン」は、光が当たると分解されます。そのため明るい場所ではロドプシンがほとんど存在しない状態になっています。そこから急に暗い場所へ移動すると、ロドプシンが再び合成されるまで時間が必要になるため、すぐには周囲を見ることができません。暗順応に時間がかかる理由は、このロドプシンの再合成が関係しているんですね。本日はここまで！

本日は、現在制作中の「サービス紹介サイト」のデモデザインを進めていました✨今回は、・シンプルだけど印象に残るデザイン・余白を活かした見せ方・やさしく落ち着いた雰囲気・写真を活かした構成を意識しながら制作しています☺️特にファーストビューは、「使う人を考えた やさしいWeb制作」という言葉が自然に伝わるように、写真の空気感や文字配置、余白のバランスをかなり調整しました☕️🌿NEWSセクションでは、カード型で情報を整理しつつ、シンプルでも見やすいレイアウトを意識✨SERVICEセクションは、画像を大きく使うことでサービスのイメージが直感的に伝わるようにしています。まだデモ段階ではありますが、少しずつ形になってきて嬉しいです☺️デモサイトなので、掲載する写真や文章を変更しながら、お客様だけのオリジナルHPへカスタマイズできます💻✨デザインを作っていると、「読みやすさ」「余白感」「写真の見せ方」で印象がかなり変わるので、細かい部分も試行錯誤しながら調整しています💡完成まで引き続き頑張ります✨

Shopify 制作実績：LAMARE（デモサイト）ポートフォリオに記載のURLより実際にご覧ください。概要LAMARE（ラマレ） は、「静かな贅沢（Quiet Luxury）」をテーマとしたハイブランド系レディースアパレルのデモECサイトです。ミニマルで洗練された世界観を軸に、商品データ・Lookbook・ブランドストーリーすべてを生成AIとShopifyカスタマイズを組み合わせて構築しました。スタイルの方向性は、The Row / Jil Sander / Lemaire など“余白と質が引き立つブランド” を意識したトーンで統一しています。担当範囲・Shopifyストア構築（テーマ DAWN カスタム）・デザインディレクション（ムードボード / タイポグラフィ / カラー）・オリジナルセクション作成（Liquid + CSS）・商品・Lookbook 画像生成（AI）・商品データ設計（CSV、メタフィールド含む）・レビュー、ニュースレター、フォーム周りのアプリ設定※架空ブランドかつデモサイトのため、制作の 0 → 1 をすべて担当しています。ブランドコンセプト“Everyday Elegance, Effortlessly.”LAMARE は、日々の動作のひとつひとつが美しく映えるような、静かで上質な佇まいを纏うためのレディースアパレルブランドです。構築にあたり、以下要素を中心に世界観を設計しました：・余白の広いレイアウト・ニュートラルな配色と細いタイポグラフィ・モード寄りのカラートーン・高級感のある陰影表現LAMARE イメージボード技術的取り組み1. テーマカスタマイ