</>
body
SKILL / 05 SKILL LIST

WEB DEV /
ARCHITECT

Window Size 0 x 0
Scroll Y 0 px
Status Active

Micro Interactions

</>

ただ動くだけではない、意味のあるアニメーション。
ホバー時のフィードバックや、ページ遷移のスムーズさにこだわり、ユーザー体験（UX）を向上させます。 GSAPを用いた複雑な連動アニメーションも、パフォーマンスを落とさずに実装します。

GSAP CSS Keyframes

WebGL / Three.js

3D

ブラウザ上で3D表現を実装。
パーティクルエフェクトやシェーダーを用いた、没入感のある演出が可能です。 軽量なモデルデータの取り扱いや、Canvas要素の最適化を行い、SPでも快適な動作を実現します。

Three.js Spline

Responsive Architecture

RWD

どんなデバイスでも美しく崩れない設計。
CSS GridとFlexboxを駆使し、ブレークポイントごとのレイアウト崩れを防ぎます。 また、セマンティックなHTML記述を徹底し、SEOとアクセシビリティの両立を目指します。

Semantic HTML CSS Grid

Code as Structure

Webコーディングは、デザインと機能をつなぐ「建築」です。
見た目の再現はもちろんですが、読み込み速度（Performance）、アクセシビリティ（Accessibility）、そして将来の拡張性（Scalability）を考慮した、堅牢なコードを書くことを信条としています。

また、動画や3DCGなどの重たいアセットを扱う際も、最適化技術を駆使して「軽快な体験」を損なわない実装を行います。