愛知県でトータルデザインサポートやブランディング構築を手がけるLIEN DESIGN様のWebサイトを制作させていただきました。
ご近所ということもあり、普段から親しくさせていただいていますが、私の中では「まじめに、芯のあるデザインを生み出す職人」であり、Webデザイナー界隈のカリスマ的存在でもあると思っています。
そんなLIEN DESIGN様からご依頼いただけたことを、大変嬉しく思っています。
サイト
LIEN DESIGN
LIEN DESIGN | 愛知・名古屋｜女性向けブランディングデザイン
愛知県を拠点に、主に30~40代女性をターゲットとする起業家様向けに、WEBデザイン・グラフィックデザイン、ブランディング、商品開発のサポートを行っているLIEN DESIGN（...
目次
実装依頼
サイトの全ページの実装を依頼いただきました。
特にトップページのアニメーションやグローバルナビゲーションのホバーアニメーションは具体的なアニメーションのイメージを共有いただき実装させていただきました。
デザインはLIEN DESIGN様ご自身で制作され、そのデザインカンプを元に実装いたしました。
サイト仕様
- WordPressでの実装
- 既存テーマのSWELLを使用
- ノーコードプラグインのElementorの使用をご希望でしたので、Elementorを使いながら追加CSS及びJavaScriptを用いてアニメーションを実装
アニメーション
一文字ずつ表示されるアニメーション
各ページのFVの見出しやブロック内の英字見出しに一文字ずつ右下から表示されるようなアニメーションを実装しました。
文字が一文字ずつ回転するアニメーション
ヘッダーやボタンのホバーアニメーションとして英字が一文字ずつ回転するアニメーションを実装しております。
いずれもコードを見ると一文字ずつspanで囲む形でアニメーションを動かしておりますが、ブロックエディタで直接打ち込んでいる文字となります。
ナビゲーションは既存テーマに入っているメニューの機能を使っているので、修正は簡単できるのもこだわりポイントとなっております。
実装について相談したい方はこちら
コーディング代行
HTML、WordPress、JavaScript、PHPなど、
サイト制作に必要な技術を
幅広く備えています。
既存テーマもオリジナルテーマのように
自由自在にカスタマイズ可能！
もちろん、一から作るオリジナルテーマにも
対応しています。
理想のデザインと機能を実現する
サイト作りをお手伝いします。
