John’s Designer

John’s Designer

https://johns-designer.com

業種

ポートフォリオサイト

制作内容

企画・設計/ワイヤーフレーム/デザインカンプ/HTML・CSS・JSコーディング/CMS構築(wordpress)/レスポンシブ対応

14人日

ツール

言語

・CMS(wordpress)
・VS Code
・Canva
・Figma

・HTML
・CSS
・JS

自身のHPを制作してみました。
シンプルさを保ちながらもエレガントな雰囲気を醸し出すデザインを心がけました。シンプルなレイアウトと、フォント選びに特にこだわり、ユーザーが訪れた瞬間から使いやすさと心地よさを感じられるようなデザインを意識しています。フォントカラーについても見やすさを重視しながら、アクセントとなる配色でユーザーの目を引くよう工夫しています。


また、ユーザーインターフェイスの使いやすさにに注力し、視認性を高めるだけでなく、ナビゲーションを直感的に操作できるよう設計して訪問者が迷うことなく必要な情報にたどり着けるよう心掛けました。これにより、初めて訪れるユーザーでもストレスを感じることなく、スムーズにサイト内を回遊できるような体験を提供しています。

トップページでは動きのある演出も取り入れました。例えば、ページ全体に雪が舞うエフェクトを加え、その雪が風に吹かれると一部の文字が少し見えにくくなるという、遊び心のある演出を実装しています。このようなインタラクションによって、訪問者に「面白い」「個性的だ」と感じてもらえるような特徴を持たせて、単なる情報提供に留まらず、ビジュアルや動きによって訪問者の印象に残るようなサイトにしました。

目次