Step-by-Step Rive Guide: Build Interactive Wavy Tiles Grid

Step-by-Step Rive Guide: Build Interactive Wavy Tiles GridStep-by-Step Rive Guide: Build Interactive Wavy Tiles Grid

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

Mayte CG

• Mar 11

I’m kicking off a two‑part, step‑by‑step Rive guide on how I built Wavy Tiles, the interactive grid you may have seen me posting about lately.

https://www.linkedin.com/pulse/wavy-tiles-step-by-step-guide-rive-pt-1-mayte-cg-oijie/?trackingId=lF6f8PNhQCGOInKZ21pFfg%3D%3D In Part 1, you’ll see: ● How to build the script‑driven grid and data model ● How to add the press‑and‑drag interactions ● How to add a rainbow color wash ● And how to work with a project_specs doc, a workflow trick I’ve been experimenting with If you’re starting out with Rive scripting, this one's for you. Stay tuned for Pt 2, where we’ll connect custom artboards to the grid, and I’ll break down how I built my eyeball design, including the pupil dilation and gaze animations 👁️ Happy Scripting!

Rive Rive Animation aidesignflow

linkedin.com

Wavy Tiles: A step-by-step guide in Rive (Pt. 1)

Welcome back! In this two‑part guide, I’ll walk you through the full process of building my project Wavy Tiles in Rive: an interactive grid of tiles that react to pointer input with translation, rotation, scale, and color effects, resulting in a slightly trippy and weirdly satisfying result. In Part

rajesh chaudhary

• Mar 12

good work.

Mayte CG

• Mar 12

Thank you!

Pascal Ferrère

pro

• 1d

WIP 🚧 Chasing that perfect sense of impact in UI animation. 🎯

👇 Dark Temple or Jungle Ruins?

Rive Animation

6 votes

Ends in 15h

Madob Acharjya

• 19h

Nice!

Yadam Pavani

• 1d

Workflow Title: Workflow Title: Concept to Commercial AI Engine

Description:

Concept to Commercial AI Engine is a 4-step premium Morphic workflow that transforms a raw product or brand idea into a broadcast-ready cinematic campaign.

Built for founders, marketers, agencies, and creators, the workflow combines strategy + visuals + motion + final film production in one streamlined system.

The workflow process:

Brand Foundation : Generates brand DNA, audience positioning, emotional core, moodboard, and archetype visuals.

Visual Storyboard : Creates campaign concept, messaging, and a connected 5-scene luxury storyboard.

Cinematic Motion System : Animates scenes into polished motion sequences using cinematic transitions, pacing, and camera movement.

Final Campaign Film : Adds score, voiceover, sound design, and final ad-film direction for a launch-ready commercial.

This workflow solves a real problem: turning early-stage ideas into premium campaign assets quickly without needing a full creative team.

I tested it using a luxury wearable-tech concept called Aurenza, producing a complete high-end campaign from one input.

@Morphic

Try it with your own brand idea and see it become a full campaign world.

Workflow Link:https://www.morphic.com/en/workflows/019d95d6-83e1-77ac-a3d3-d1106b3abd09/luxury-ai-brand-campaign-engine

Social Links: LinkedIn:https://shorturl.at/vX3S8 X: https://rb.gy/hua47d

morphicworkflows morphicchallenge

Cheryl Ee

• 1d

Recently, I’ve been working on improving my portfolio and getting it ready for launch.

Been refining the overall design, polishing my case studies, and learning more about deploying it properly through GitHub and Vercel. Still tweaking a few things, but it’s been fun seeing it come together bit by bit. These are some early looks at the loading screen, hero section, selected works layout, and contact page as I continue refining the experience.

Still a work in progress, but I’m enjoying the process of bringing it all together bit by bit.

Vercel UI Design UX Design GitHub portfolioglowup Web Design HTML5

Timothy Olukoya

• 1d

Outstanding work

Back to feed

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

Challenges

View all

Paper Challenge

$10K2d left442 participants

Morphic Workflows

$10K3d left190 participants

Zo Computer Challenge

$10K4d left383 participants

Fuser Co-create

$5K5d left243 participants

Runway $100k Big Pitch Challenge

$100K15d left99 participants

Trending

Runway

AI video generation is exploding. What are you dreaming up in Runway?

Contra University

Learn from expert creatives how to earn more using next-gen AI tools.

creativeaiflow

Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?

portfolioreview

The best portfolios tell a story, not just show a grid. Share yours for feedback.

freelancerlife

Freelancer life is wins, pivots, and everything in between. What’s yours right now?

Pascal Ferrère

pro

• 1d

WIP 🚧 Chasing that perfect sense of impact in UI animation. 🎯

👇 Dark Temple or Jungle Ruins?

Rive Animation

6 votes

Ends in 15h

Madob Acharjya

• 19h

Nice!

Yadam Pavani

• 1d

Workflow Title: Workflow Title: Concept to Commercial AI Engine

Description:

Concept to Commercial AI Engine is a 4-step premium Morphic workflow that transforms a raw product or brand idea into a broadcast-ready cinematic campaign.

Built for founders, marketers, agencies, and creators, the workflow combines strategy + visuals + motion + final film production in one streamlined system.

The workflow process:

Brand Foundation : Generates brand DNA, audience positioning, emotional core, moodboard, and archetype visuals.

Visual Storyboard : Creates campaign concept, messaging, and a connected 5-scene luxury storyboard.

Cinematic Motion System : Animates scenes into polished motion sequences using cinematic transitions, pacing, and camera movement.

Final Campaign Film : Adds score, voiceover, sound design, and final ad-film direction for a launch-ready commercial.

This workflow solves a real problem: turning early-stage ideas into premium campaign assets quickly without needing a full creative team.

I tested it using a luxury wearable-tech concept called Aurenza, producing a complete high-end campaign from one input.

@Morphic

Try it with your own brand idea and see it become a full campaign world.

Workflow Link:https://www.morphic.com/en/workflows/019d95d6-83e1-77ac-a3d3-d1106b3abd09/luxury-ai-brand-campaign-engine

Social Links: LinkedIn:https://shorturl.at/vX3S8 X: https://rb.gy/hua47d

morphicworkflows morphicchallenge

Cheryl Ee

• 1d

Recently, I’ve been working on improving my portfolio and getting it ready for launch.

Still a work in progress, but I’m enjoying the process of bringing it all together bit by bit.

Vercel UI Design UX Design GitHub portfolioglowup Web Design HTML5

Timothy Olukoya

• 1d

Outstanding work