The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
I built OrbyUI, a free studio for designing animated WebGL orbs.
Orbs are everywhere now: AI assistants, voice agents, hero sections. But most teams end up rebuilding one from scratch, or settle for a video loop. So I made a tool where you tune the orb visually and copy the code.
What’s in it:
• 4 styles and 9 materials, from glass and metal to dither and ASCII
• 8 presets, and 4 states (idle, listen, think, speak) for voice and AI interfaces
• Export as React, JavaScript or HTML
• No dependencies, no three.js.
The whole orb is about 14 KB gzipped, smaller than most hero images Free and open source (MIT). Try it 👉 https://orby-ui.vercel.app
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Built something that isn’t client work for a change.
Flowkidz. Short games that teach kids design, websites, AI, code and internet safety.
The Kinetic Brand Spec Engine is an ultra-fast, 40-cut kinetic brand identity showcase built for high-growth digital brands and social feeds. Operating in a seamless 3.6-second infinite loop at a locked 60 FPS, it combines rapid photographic strobe cuts with real-time optical color inversion, delivering the energy of a high-end broadcast title sequence entirely within native vector animation.
What sets this project apart is that it was built 100% programmatically using the SVGator MCP (Model Context Protocol). Rather than manually dragging timeline keyframes in an editor, every layer coordinate, 60ms cut interval, and blend mode was authored directly through code and agentic automation, proving sub-millisecond precision and showing what the future of creative engineering looks like.
The template is engineered for true plug-and-play reusability: designers can drop in any transparent logo mark and update the brand title in under 60 seconds without breaking any of the 40 animation tracks. To prove its versatility, we created two radically different brand executions powered by the exact same master engine - LUFAZAE for avant-garde editorial luxury, and MONOLITH for tactile architectural streetwear.
It's really energetic brand identity ⚡⚡⚡
Great work Garv🎉🎉🎉
Hourfield is a 16-second 16:9 launch film for products that organise people's time: calendars, schedulers, booking and reservation apps, planners. Retype a few short lines, drop in your logo and rename the calendar's days and tiles (meetings, table bookings, classes, shifts): the week re-plans itself on screen and the film lands on your logo lockup. Our second version, Maréva, a fictional table-booking app, turns the working week into an evening of reservations on the same animation and timing.
Built end-to-end through the SVGator MCP server. The calendar that re-plans its own week, the orbit that swirls into a single dot and the lines centred by their real letter shapes (fonts measured, not eyeballed) were computed in Python and written straight into a live SVGator project as 780 editable keyframes; I directed every note and finished it in the canvas. Maréva was made the same way, on the same timeline. Everything stays a real layer: 50 live text layers, named elements (headline, logo, product-name, tagline) and one logo image animated in two moments.
Yes, there is a lot to edit: every line of the story, a whole week of calendar tiles, a palette in nine roles. A full rebrand takes longer than five minutes, and that is the honest trade: it shows how much a single SVGator file can carry, and how MCP makes a detailed, story-driven film practical to re-make, not just to watch.
Links:
▶ Template (SVGator)
▶ Demo video, A → B
Love the smooth flow and the text animation! Good luck!