忙しい現代人に刺さる「10分で英語脳」オンライン英会話バナー
「忙しい」を理由に学習を諦めている層をターゲットにした、オンライン英会話のプロモーションバナー。青とオレンジのコントラストを活用し、信頼感と活気あるイメージを両立させました。
Design × Frontend Engineer
From concept to implementation.
Clean design. Scalable code.
UIデザインからフロントエンド実装まで、一貫して対応します。
About Me
私について
デザインと実装の両方を理解したフロントエンドエンジニアです。
UI設計から開発まで、一貫した視点でWeb制作を行っています。
ユーザー体験を意識したUIデザインと、
保守性・拡張性を考慮したフロントエンド実装を得意としています。
Figmaでの設計段階から関わり、
Next.jsとHeadless WordPressを用いたモダンなWebサイト構築を行っています。
「見た目が良い」だけで終わらせず、
運用しやすく、長く使えるWebサイトを目指しています。
デザインから実装まで
一貫対応
チャットやZoomで丁寧にヒアリング。「何を頼めばいいか分からない」状態でも大丈夫です。
伝わるデザイン・構成
ただの「見た目」だけでなく、ユーザーに行動してもらうための導線設計とSEOにも配慮します。
パフォーマンスと可読性を意識したコード
専門用語は使いません。納品後も操作や修正がしやすいように解説付きでご案内します。
Works
制作実績
これまでに制作した
Webサイト・UIデザイン・個人開発の一部をご紹介します。
高級ショコラトリー「L'éclat」ホワイトデー予約販促バナー
「言葉よりも、心に届く一粒を。」というコンセプトを軸に、ホワイトデーの特別感を演出。シズル感のある商品写真とゴールドのタイポグラフィを組み合わせ、オンライン予約へのコンバージョンを目的としたバナーです。
未経験者向けWebデザイナー転身支援セミナー集客バナー
「未経験からWebデザイナーへ」という力強いメッセージを軸に、ターゲットが抱く「自分でもできるのか？」という不安を払拭する、清潔感とプロフェッショナルさを兼ね備えたセミナー集客バナーです。
Process
流れについて
プロジェクトごとに最適な進め方を意識しながら、
以下の流れで制作を行います。
1
Planning/Hearing
目的・課題・ゴールの整理
目的・課題を整理し、ブレない設計の土台を作ります。
2
Information Architecture
伝わる順番を設計
情報設計・導線設計により、
使いやすい構成を作ります。
3
UI / UX Design
使いやすさから
逆算するUI設計
Figmaで構造から考え、
実装を見据えたデザインを行います。
4
Development
デザインから
実装まで対応
設計をそのまま、丁寧に実装
デザイン意図を崩さず開発します。
MY DESIGN PHILOSOPHY
使いやすさは、
設計で決まる。
見た目だけでなく、
体験と実装を意識した
UI / フロントエンド設計を行います。
5
Release & Improvement
作って終わりにしない
公開後の改善・調整まで継続して対応します。
Let's work together.
デザインから実装まで、一貫して対応します。