Streaming live at 10am (PST)

Swipe Movement UI


#1

This may be beyond the capabilities of Webflow...

Has anyone created - or attempt to create
a "Swipe Left / Right Movement" using Webflow ?

Similar to the Swipe Right on the iPhone / iPad to interaction with an element
ie: Delete It.

Obviously, the UI would be geared for mobile / touch devices.

I've been trying to create one with JQuery... but have been unsuccessful to date.


#2

What I would suggest is to get Hype, which has left, right, up, and down swipe. The animations are created on a timeline. So, you could have the swipe be a trigger to play a timeline, which has an object fade out, or move off screen. Then, you export that HTML5 interactive and bring that into Webflow. I'm pretty sure you use the Embed widget to add it to the webpage. I think the concept is that you upload the files, that get exported from Hype, to a public dropbox, and then add those via the link, to your custom code area in your dashboard, and then paste in the "3 lines of code" from the HTML file that get exported from Hype, into this Embed Widget.

Perhaps a WF staff could jump in and give more specific instructions. I think there should be a full-fledged tutorial specifically on adding interactives made in Hype to WF. One of the reasons why Hype is great is because it's very affordable, non-subscription software. I'm personally planning on adding some interactions created in Hype to my own site.


#3

I took a look at Hype... but it wasn't really what I was looking for.

Hype appears to create preset animation similar to flash... in html5.

I need touch support for mobile devices.

I have drag / drop / sort working within Webflow (and outside Webflow)

but it does not work at all on mobile devices.

I tried several different methods a couple plug-in jquery libs... but nothing seems to work.


#4

Sorry for the late reply. Hype absolutely has touch support for mobile devices. It's a Mac app for creating "interactive animation" not "preset animation." You can create an object, let's say it's a circle, that you drag and drop onto another object, let's say a square, and that causes something to happen. An animation to play. A jump to a new page, etc. You can make buttons that when clicked on, cause something to happen, but also Swipe, which is a fully mobile gesture. I'm not sure what you're talking about that Hype doesn't do what you want. It's made to create interactions that work on mobile as well as desktop. Give it a chance. You'll be amazed at what you can do. As I tried to explain in my previous response based on your initial question, Hype can do what you're looking to do.


#5