I couldn't turn off the volume with the iPhone's default silent switch. So it's not safe for work for the first few secs:)
Anyway UX/UI is great, the game is addictive.
That would be a problem with the iPhone's default silent switch then.
Not saying it's not an issue the app should try to work around a broken iPhone, but if the iPhone's silence switch can't be trusted to do the simple job of silencing the phone, it's a problem with the device.
The silence switch is intended to silence alert sounds. It doesn't silence audio initiated by the user. For example, playing music of video in Apple apps will still play out loud even when switched to silent. With no way of automatically telling what is initiated by the user and what isn't, it's left up to the app to decide.
I tend to always have my phone on silent so it's not a distraction if I get an email or text while talking to someone, but if I play a video I want it to actually make some noise. Google's YouTube app doesn't play audio if switched to silent, and it's frustrating having to frequently switch silent off.
Whether background music is initiated by the user or not is debatable. I'd say it isn't.
This is exactly it, and the app for me was not doing learned expected behavior. "Learned" as in, beyond jasonlotito's black and white expected behavior. When I leave it on silent, I want all non-essential audio off, but if I'm going to play a podcast, clearly, I want it to play audio regardless.
Btw, the Youtube app did give me audio while the phone was set to silent.
Depends: maybe they used something like Ejecta (https://github.com/phoboslab/Ejecta) which doesn't use the standard webview but re-implements canvas on top of opengl.
So? If the app's JS performance is fast enough to play the game, then there's no problem if it would be better on a desktop browser.
(Or do you mean the iOS browser? Still, doesn't matter. If you want to sell an iOS, there's just no comparison between the monetization facility of the App Store compared to the browser).
Try it the browser could possibly make sense. Or not. They would probably prefer people to pay to download and try the app (or download a free version and have it on their phone, as a reminder the can buy the full one), rather than try it on a browser and forget about it.
An Android release is also questionable. Not such a big market money wise, and they would have to port the rest of the environment too (the native hooks), AND take into account the various screen sizes and OS versions (50% of Android users still use 2 year old versions). Might as well don't bother at all.
Occurs to me that they probably didn't want to from a UX perspective. The whole app had been made for touch, not point and click/drag. Perhaps the team felt the interaction needed to be touch-only. But a demo video may have eased this confusion.
This website uses Google Analytics to track not just the page load, but individual elements being clicked on and such. It attempts to fire off a tracking event, but if GA isn't loaded, it fails, and the page itself fails to load. The author really needs to include some sort of fallback for when this happens.
Web apps are starting to get more and more impressive recently. I've started using Forecast.io as my main weather app and I honestly can't tell it's not native. This is the first good game I've seen though, but it's encouraging.
Anyone know why web apps are getting so good lately? Hardware power, browser optimisations, or what? Looks like there's a bright future ahead anyway.
I don't have an iOS device but the website looks very good. Appreciate the write-up as well, it's always interesting to read about these things.
Just a minor issue on the code you have on [1]:
imagesToPreload.forEach(function(src) {
var img = new Image();
img.src = src;
img.onload = hasLoaded;
img.onerror = hasError;
})
The onload and onerror callbacks would be best to be assigned prior to setting the image's src attribute so as to make sure they are always called.
Also, on your Element.hasClass method have you considered a non-regex approach, like this.className.split(' ').indexOf(c)? That would most probably be faster. Same goes for removeClass where something like this.className.split(' ').reduce(...).join(' ') may do the trick.
I like the style of the demo website. I downloaded the game and after solving my first word, the app froze on the "Word Complete!" screen. At least I think it froze. I've tapped "next work" and "replay word" and swiped and tapped all over the screen and nothing has happened. Heading back to my "desktop" and back into the app leaves me at the same "frozen" screen. I-phone 4 with 5.1.1
EDIT: More random tapping and swiping got me to the "Achievements" screen which scrolls vertically but I have no idea how to get off this screen and back to the game.
Semi-related question: I noticed that on the website, there's an animation of the scrambled wheel. Rather than using a .gif, it's using javascript to sequence a bunch of .png files. Just wondering what the motivation for doing this is? These guys clearly know what they're doing, so I'm guessing there is one!
So I was all aboard until I looked in the iTunes store and saw a bunch of in-app purchase items. No deal.
I want to pay for an app up-front, or maybe get it free and pay one fixed fee. Anything else and I will not even try it. I realize I'm in a minority right now, but I think this trend in games needs to go away.
Very impressive! I tried a few rounds and had no problems. Thanks for posting information on how you developed the app. I am venturing into building mobile apps and your article on how you developed looks very useful.
Use this.$el[0].innerHTML = _.template(html) instead of this.$el.html(_.template(html)). It will reduce html rendering time by 30-50%. On desktop browsers you won't see much difference but on mobile browsers it is significant.
Also, where is an android app? It should be easy to port to an android app since android also uses webkit browser?
I have to say it's a really nice design and the game is fun, but it's not really smooth on my iPhone 4, it's a little laggy whenever an animation starts.
This is still very impressive for an HTML5 game though.
38 comments
[ 3.2 ms ] story [ 88.8 ms ] threadNot saying it's not an issue the app should try to work around a broken iPhone, but if the iPhone's silence switch can't be trusted to do the simple job of silencing the phone, it's a problem with the device.
I tend to always have my phone on silent so it's not a distraction if I get an email or text while talking to someone, but if I play a video I want it to actually make some noise. Google's YouTube app doesn't play audio if switched to silent, and it's frustrating having to frequently switch silent off.
Whether background music is initiated by the user or not is debatable. I'd say it isn't.
Btw, the Youtube app did give me audio while the phone was set to silent.
http://www.scrambledapp.com/articles/for-developers/
(Or do you mean the iOS browser? Still, doesn't matter. If you want to sell an iOS, there's just no comparison between the monetization facility of the App Store compared to the browser).
An Android release is also questionable. Not such a big market money wise, and they would have to port the rest of the environment too (the native hooks), AND take into account the various screen sizes and OS versions (50% of Android users still use 2 year old versions). Might as well don't bother at all.
EDIT: Me stupid: http://www.scrambledapp.com/articles/for-developers/
Anyone know why web apps are getting so good lately? Hardware power, browser optimisations, or what? Looks like there's a bright future ahead anyway.
Just a minor issue on the code you have on [1]:
The onload and onerror callbacks would be best to be assigned prior to setting the image's src attribute so as to make sure they are always called.Also, on your Element.hasClass method have you considered a non-regex approach, like this.className.split(' ').indexOf(c)? That would most probably be faster. Same goes for removeClass where something like this.className.split(' ').reduce(...).join(' ') may do the trick.
[1] http://www.scrambledapp.com/articles/for-developers/
EDIT: More random tapping and swiping got me to the "Achievements" screen which scrolls vertically but I have no idea how to get off this screen and back to the game.
A barrage of UI events ("swiping and tapping all over the screen") rarely helps when an app has stuck.
>Heading back to my "desktop" and back into the app leaves me at the same "frozen" screen. I-phone 4 with 5.1.1
Tried killing the app? Open the list of open apps (double click the home button), and "X" it to death. Open again.
I downloaded the app too (on iPhone 5), and had no such problems as of now (I've only played for like 30 minutes though).
- Alpha blending (which GIF doesn't have, only has simple transparency).
- More than 256 colors (which GIF doesn't have. You have to dither to get a semi-acceptable gradient and the like).
[1] http://www.scrambledapp.com/articles/for-developers/ [2] http://davidwalsh.name/classlist [3] http://caniuse.com/classlist
I want to pay for an app up-front, or maybe get it free and pay one fixed fee. Anything else and I will not even try it. I realize I'm in a minority right now, but I think this trend in games needs to go away.
Also, where is an android app? It should be easy to port to an android app since android also uses webkit browser?
Why are there two "D" in the following screenshot?
http://i.imgur.com/WTQNBEs.png