松田 怜

フロントエンドアニメーション小ネタ集

falling cherry blossom

写真を撮り、トリミングしてスタンプを貼り画像を生成できるサイトです。
(source: https://github.com/ray-zero2/photoFrame)

Canvasの学習を始めて最初に作った作品です。(canvas 2D)
(canvasの学習にフォーカスしたため、デザインは行っていません。)

JSの仕様やオブジェクト指向もよくわからず制作したためコードは綺麗ではありませんが、
ロジックについてしっかり悩んで実現することができました。

スタンプを描画する際はオフスクリーンのcanvasを2枚使用し、
一番上に描画されているスタンプ以外の全てを事前に描画しておくことで
余計なレンダリングを防ぐ工夫を行いました。

フォトフレーム

particles

ロケット

Happy New Year 2021

Konel / テクニカルディレクター

Hiroyoshi Murata

Dentsu Craft Tokyo, テクニカルディレクター

竹田 和幸

久保 隆宏

アマゾンウェブサービスジャパン合同会社, Developer Relations Machine Learning

都 淳朗

株式会社コネル, Product designer / Producer

田中 潤

FESTA運営 + 作品制作

空きスペース可視化プロジェクト

実績

JavaScript

TypeScript

SCSS

HTML

Vue.js

GLSL

WebGL

React

仕事で使えるフロントエンドフレームワーク

仕事で使えるフロントエンド関連クラウドインフラ

仕事で使えるフロントエンドテストフレームワーク

仕事で使えるCSSフレームワーク

仕事で使えるフロントエンドツール

携わったプロダクト・サービスの種類

携わったプロダクト・サービスの段階

直接マネジメントしたことのある人数

開発経験のあるプロジェクトの規模（画面数）

松田怜

松田怜

松田 怜

松田 怜

松田怜

松田怜