Works

# #
サイトURL
https://chiluco.com/

機能詳細

HTML, CSS, Javascript, jQuery, Wordpress, figma, VSCode, Slick, Contactform7

機能詳細

カスタム投稿、タグのカスタムタクソノミー(WORKS) 確認画面付きメールフォーム(CONTACT)
制作期間
2023/10~12 案件作業の合間に少しづつ

概要

滋賀県栗東市に住んでいます、Katayama ChikaのWEB制作のポートフォリオサイトです。

デザインコンセプト

シンプルで分かりやすい、余白の多い、リラックスした気持ちになれるサイトをと思い、作りました。好きな色である、ベージュを基調にしています。

サイト制作の目的

転職活動をするにあたり、実績を分かりやすく伝えるまとめページとして。

工夫した点

1、fadeinでふわっと上がってくるアニメーションを、600pxを起点にページ読み込みで上がってくるか、スクロールで上がってくるかを変更しています。端末によって画面内に入るコンテンツの内容量が違うためです。Javascriptのclass名の付け外しで実現できました。

2、カスタム投稿で、案件ごとのカラーをタイトル下のborder色に反映させたかったので、cssをhtmlのstyleに直書きして、カスタムフィールドのカラーピッカーを使って作りました。これは調べてどこかにやり方が載っていたとかではなくて、自分で考えて出来たことで、実現できた時はすごく嬉しかったです。

3、WORKSはタグのカスタムタクソノミーの画面を作り、タグ別で案件が表示可能なようにしました。SOLIS ENTERTAINMENT様のサイトを制作した際、カテゴリー別のカスタムタクソノミーの画面を作った知識がここでそのまま活かせました。

苦労した点

余白の調整に苦労しました。余白が多いデザインが好きなのですが、それはそれで色々考えてしまうことが多くて、ここ少し広すぎるかな・・・?やっぱり狭いかな・・・?と何度も試行錯誤を繰り返してしまいました。きちんと明確な基準も必要ですが、自分自身の感覚も大切にしたいし、デザインってやはりなかなか難しいな、奥が深いな、と思います。

デザインカンプ※クリックで拡大できます

PC版デザインカンプ

お問い合わせ

Contact

ここまで見ていただいてありがとうございます◎
お仕事の依頼や、企業様のお問い合わせ、こんなことできますか?という相談でも、何でも結構です。是非、お気軽にお声かけ下さい。
下記リンクのボタンから、Contactフォームへの移動をお願いいたします。