Make a showreel-style motion graphics video for my portfolio website,
http://
sholajegede.com, using Remotion. It should show what I do as a developer relations engineer, like a showreel for my résumé.
- Use as much of the real website as possible: capture the pages and sections in a browser (home, Ask, package pages, Hire, mobile view, dark mode) and animate them inside browser and phone frames.
- Show the site's chat answering real questions about my work, with the questions and answers large and bold. Use only facts and numbers that are on the site.
- Follow premium brand rules: three colours and the site's own fonts, one idea per shot, key objects centred, space to breathe, eased motion only, smooth transitions instead of hard cuts, and a rhythm that speeds up and slows down with the story.
- Add music at about 120 BPM (elite, kinetic, sophisticated) and cut every scene on the beat. No extra sound effects.
- 1920×1080, about 90 to 100 seconds, ending on the website and my contact email.
+7
动效宣传1:04添付した楽曲とキャラクター画像を使って、「サイケデリック・グリッチ系」のアニメーション MV を作ってください。
【制作方法】
HTML Canvas でアニメーションを書き、Playwright で 1 フレームずつキャプチャし、ffmpeg で音声と合成して MP4 を出力してください（1280×720、30fps、30MB 以内）。
AI 動画生成は使わず、すべてプログラムによるアニメーションで作ってください。
【前処理】
1. キャラクター画像はすべて背景を透過し、白いステッカー風の縁取りと薄い影をつける。
2. 楽曲を解析する：BPM、最初の拍の位置、各小節（4 拍）の頭、
各セクションのエネルギーの高低（イントロ／A メロ／サビ／落ちる部分）を求める。
【編集ルール】
- 1 拍ごとにカットを切り替える。カットはランダムにローテーション：全身、
バストアップ、目の超アップ、2 ポーズ並び、同じポーズの 5 連（それぞれ色相違い）、シーン画像。
- 隣り合う 2 拍で同じポーズを使わない。
- エネルギーが低い箇所はシーン画像や静かなカットにして、ひと息つかせる。
- エフェクトの強さはセクションに合わせる：イントロ約 40%、A メロ 70%、サビ 100%。
【エフェクト】
1. 白フラッシュ：毎拍フラッシュしてすぐ消える。小節の 1 拍目が一番強い…@pound75423CanvasCSS
