Redirect a different document ONLY to Android/Chrome Mobile phones


#1

More complex animation is choppy on Android and Chrome Mobiles while the iPhones/iPads are pretty seamless.

Is there a way to redirect a different document version ONLY to Android Phones while leaving the native Mac / iPhone / iPad original version intact? I tried the javascript code in the Redirecting your Mobile Visitors to a different page or scene mobile instructions, but it changes all Mobiles to the alternate version, including iPhones.


#2

You would use this code:

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");
if(isAndroid) {
  // Do something!
  // Redirect to Android-site?
  window.location = 'http://android.davidwalsh.name';
}

This is from the following stack overflow thread:

Could you share your document with us? (Feel free to private message me). Would like to see what is not working smoothly. What device are you testing on?


#3

Hi Daniel,

I am a novice with Tumult Hype and only can do a small bit of code. How do I send you my document? It’s size is 255MB.

I made my document - with different breakpoints and scenes - and inserted it to our website (using Freeway 7). Everything is pretty smooth on Macs and on PC Desktops, as well as iPhones/iPads. But Samsung Phones and the rest of Android and Chrome devices have difficulty with the document. So I was thinking of doing a much simpler animation version for those. Here is a link to our website where the document is active:

http://www.centralwestballet.org


#4

It looks pretty good! I think the issue is the size of the images – it is struggling in Safari on my Retina Macbook Pro at some points. I would make sure that the images you use are animated in such a way that no portion of the image is hidden outside of the visible area. Hype will optimize images to make sure they are resized to a @2x-compatible size, but this may result in really large images if you’re zooming in your images quite a lot in your layout – that may not be it but thought I’d mention it.

A good way to share a document that size is Dropbox or a website like wetransfer.com.


#5

Thank you for the feedback! Appreciate your kind words. You are right, my images are large and really go beyond the visible area. I did not realize that this might be part of the problem. I will recut the images and try to be creative with the zooming. I will also tinker with the Android redirect code you sent me - does this snippet of code go after the or the of the html page? (like the instructions in the Hype Mobile Redirect article?).
Thanks again.


#6

I recommend making a blank scene at the beginning of your document that handles redirects – you can have that scene run an ‘on scene load’ action which will take your visitors to where they should be. Hope that helps!