キラキラマーク左

キラキラマーク中央

キラキラマーク右

WORKS

これまでに取り組んできた制作物を ご紹介します。
ひとつひとつの課題に向き合いながら、 試行錯誤を重ねてきた記録です。
制作の背景や工夫した点も記載しています。
ぜひ、ゆっくりご覧ください。

ポートフォリオサイトのサムネイル画像

レスポンシブ対応

01

Portfolio site

  • HTML
  • CSS
  • Sass
  • GitHub
  • JavaScript
  • Figma
  • Photoshop

私自身の学びと成長の記録をまとめたポートフォリオです。 今まで学んだ表現や技術、やりたいことを詰め込んだ、 私の成長記録です!

制作時間
235時間
デザイン
90時間
コーディング
145時間
Fkika Tableのサムネイル画像

レスポンシブ非対応

02

Fika Table

  • HTML
  • CSS
  • Sass
  • GitHub
  • jQery
  • Figma
  • Photoshop

「あたたかい食卓から、暮らしを整える」をテーマにした、北欧風家具・雑貨の架空通販サイトです。30〜40代の女性をターゲットに、朝の光や木の温もりを感じるような、穏やかで心地よい世界観を表現しました。

制作時間
20時間
デザイン
8時間
コーディング
12時間
旅館 澄居のサムネイル画像

レスポンシブ非対応

03

旅館 澄居

  • HTML
  • CSS
  • Sass
  • GitHub
  • JavaScript
  • Figma
  • Photoshop

「静けさが、心にすっと染み込む。」をキーワードに、北海道にある架空の温泉宿の公式サイトを制作しました。日々の喧騒から離れ、深呼吸したくなるような「静寂」と「癒やし」を感じてもらうため、情緒的なコピーと、視覚に訴えかける美しい写真選定にこだわりました。

制作時間
26時間
デザイン
6時間
コーディング
20時間
WSS Dental Clinicのサムネイル画像

レスポンシブ非対応

04

WSS Dental Clinic

  • HTML
  • CSS
  • Sass
  • jQery
  • Figma

学校の課題として、提供されたデザインカンプの「見た目の印象」をブラウザ上でいかに正確に再現するかに注力して制作しました。単に数値をなぞるだけでなく、余白感やフォントの佇まいなど、デザインが意図する清潔感と信頼性を損なわないコーディングを追求しています。

制作時間
8時間
デザイン
--時間
コーディング
8時間