تخطَّ إلى المحتوى

This Is Strange · Entertainment

Generative art at 60fps on a three-year-old phone

An immersive storytelling platform where every visitor gets a unique, shareable, deterministic artwork — and where the whole thing still holds 60fps on hardware that has no business running it.

2M+page views in six months

لمحة سريعة

المدة
22 أسبوعاً
حجم الفريق
3 أشخاص
نوع التعاقد
بناء جديد
نوع المشروع
تطبيق ويب
القطاع
الإعلام والترفيه

الوضع

التحدي

Generative complexity in a browser is easy to make beautiful on a workstation and impossible to ship. This had to hold 60fps from high-end laptops down to older Android handsets on 3G, while still giving each visitor something visually unique enough to be worth sharing.

ما الذي فعلناه

Determinism first — the same session always produces the same artwork, which is what makes sharing possible at all — then quality scaling underneath it so the same scene degrades rather than breaks.

القرارات التي صنعت الفارق

  • Seeded noise, so sharing actually works

    Simplex noise seeded by session ID: identical input, identical output, every time. Without determinism a 'share your artwork' link shows the recipient something different, which quietly destroys the mechanic.

  • Adaptive quality with a CSS floor

    Particle counts and shader complexity scale to device capability, and unsupported devices fall through to CSS-only rendering rather than a blank canvas. Zero WebGL crashes in production came from assuming failure at the bottom of the range.

  • State in the URL, under 1KB

    Story choices and generative parameters compress into the URL hash, so sharing needs no server round trip at all. Longer states fall back to server storage behind a short code.

ما الذي تغيّر

page views
2M+page views
organic social shares
50K+organic social shares
average session
4.2 minaverage session
LCP
1.2sLCP
  • 2M+ — first six months
  • 1.2s — with CLS 0 and FID 8ms

2M+ page views and 50K+ organic shares in six months, 4.2-minute average sessions, Core Web Vitals of LCP 1.2s / CLS 0 / FID 8ms, and no WebGL crashes in production.

الخدمات المستخدمة

  • Three.js generative engine with seeded determinism
  • Adaptive quality scaling and CSS-only fallback path
  • GSAP timeline system driven by JSON narrative data
  • URL-compressed share state with CDN delivery

ما الذي كنا سنفعله بشكل مختلف

لكل مشروع واحدة من هذه. ونشرها هو المقصد — فدراسة حالة بلا ندم فيها تسويق لا دليل.

Performance and artistry are not opposites, they are collaborators. The constraint — this has to run on a cheap phone — is what forced the elegant version of every effect. Given the range of devices again, we would set the performance floor before designing anything, not after.

الخدمات المستخدمة

أعمال أخرى

جاهز للبدء؟

ابدأ مشروعًا مماثلًاأعمالنا