トップビジュアルイラスト制作 WORKS ILLUSTRATION
「重ねて、つなぐ」を形にした
トップビジュアル
casaneru design のコンセプトである「重ねて、つなぐ」をテーマに、サイトのトップビジュアルとアニメーションを制作しました。
Web・グラフィックといった複数の領域が、
つながりながら価値を生み出す様子を表現しています。
-
クライアント
casaneru design（自社プロジェクト）
-
URL
-
制作期間
2026年3月（10時間）
-
ターゲット
個人事業主・中小企業・店舗経営者（Webでの発信を強化したい方）
-
テイスト
親しみやすさと信頼感を両立した、やわらかく落ち着いたトーン
-
担当範囲
イラスト・CSSアニメーション作成・WordPress（PHPによるSVGイラスト読み込みを実装）・JavaScript（スクロールトリガーなどを実装）
-
デザインツール
Figma／Affinity
-
開発
HTML／CSS／Java Script
POINT 01 CONCEPT コンセプト
「重ねて、つなぐ」を体験として伝えるトップビジュアル
casaneru design のコンセプトである「重ねて、つなぐ」を、
トップビジュアルとして表現しました。
ビジネスのやり取りをフリーマーケットに見立てることで、
サービスが並び、選ばれ、つながっていく様子を、
親しみやすく伝える構成にしています。
POINT 02 DESIGN 表現と設計
親しみやすさとブランド性を両立したイラスト設計
PCや人物の動きを通して、サービスのやり取りを視覚的に表現しました。
イラストは落ち着いた色彩とシンプルな形状でまとめ、
ビジネス用途でも受け入れられやすい印象にしています。
また、SVGをCSSで緩やかにアニメーションさせることで、
騒がしすぎず、気づくと少し楽しいと感じられる体験を加えています。
初期表示は「PC → 人 → 環境」の順に出現させ、
奥から手前へと重なることで、「重ねる」というコンセプトの立体感を表現しました。
POINT 03 RESULT 成果・変化
親しみやすく、
興味を持ってもらえる入口に
難しそうに見えがちなサイト設計や改善を、
ストーリーのあるビジュアルと動きによって親しみやすく伝えました。
casaneru design の考え方や雰囲気を直感的に感じてもらい、「相談してみたい」と思ってもらえる入口になることを目指しています。
