Goateck

担当範囲

コーディング

プロジェクト概要

これまでに制作してきたWebサイトや得意なスキルをまとめたポートフォリオサイトです。
「見やすさ」と「誠実さ」を大切にし、余計な装飾を省きながら、中身がしっかりと伝わる構成を意識しました。

本サイトのデザインは、洗練されたセンスと優しさを兼ね備えたWebデザイナーの minaさんにご協力いただきました。
私はフロントエンドの実装を担当し、minaさんの世界観を忠実に再現できるよう、細部まで丁寧にコーディングしました。

minaさんポートフォリオサイト
https://designhand-mina.studio.site/

工夫した点

・透明感あるデザインの再現にこだわり、CSSの細部やアニメーションの緩急を丁寧に調整
・レスポンシブ対応では、レイアウトの切り替えを極力自然に見せるよう、余白・フォントサイズをclamp関数で柔軟に設計
・メディアクエリやSCSSの設計にはFLOCSSをベースにし、保守性と見通しの良さを意識
・コーディングにおいては、読み手のことを考えたクラス命名・構造設計で、制作会社が引き継ぎやすい構成を心がけた

サイトURL