Streaming live at 10am (PST)

3D Isomentric Grid. 100% Webflow build


#1

Hello guys! :slightly_smiling: :innocent: :relaxed:

Want to share with you the result of my inspiration this weekend.

Interactive scrollable 3D Isometric Grid. Build 100% in Webflow.

http://3disometric-grid.webflow.io/

Inspired by Codrops Article ( http://tympanus.net/Development/IsometricGrids)


#2

That's awesome @sabanna, great job! So cool :slightly_smiling: Going to share this :wink:


#3

Thank you @cyberdave :smiley: It was fun!


#4

This is soooooooooooooooooooo amazing Anna! :smiley:


#5

Thanks, Vlad! :smiley: I am even glad that @vincent teased me with this Codrops link LOL


#6

Brilliant stuff! :slightly_smiling:


#7

Are you kidding me?? I want this for my new portfolio for my site!


#8

you are cool developer :sunglasses:


#9

Thanks, guys :slightly_smiling:
@DFink, here is a link to the project https://webflow.com/website/3disometric-grid. If you will need to look on it "from inside" :slightly_smiling:


#10

Awesome! Saw this on Codrops also and was going to give it a shot, glad to see it's possible with Webflow.


#11

@sabanna Thanks girl! I was struggling to get the effect right yesterday night and thanks to you public link, I got to see where my mistake was.

I made a version using flexbox and interactions only. It has multiple stacked layers. Let me know what you guys think. I believe there's more ways to improve this.

Something that troubles me, the "trigger" area can be a bitch sometimes. Happens on both Sabanna's and my version, where certain areas you hover would make the animation jumping up and down.

Preview: http://awtm.webflow.io/

Share link: https://preview.webflow.com/preview/awtm?preview=07712e2851343023b1a24e5c0f070b65


#12

Very cool, @alexanderwong!!! :smiley: About that "jumping": it is really issues of 3D transforms :/. Don't know how to fix it.


#13