Web + Mobile Design ?
- Started
- Last post
- 13 Responses
- twokids
I need to design and produce an interactive quiz this summer. In the past, it was a no brainer - you did it in Flash.
I want this to be viewable on any mobile device, but I also want some movement or sound or fun.
What toolkit to use? HTML5? Doesn't that eliminate a lot of IE users? Javascript? Jquery? I just don't know what toolset to use....
Anyone have any advice?
- spot130
Jquery
- This will be your best cross-platform option. http://jquerymobile.…spot13
- twokids0
Thanks spot 13!
So Jquery can create animations and interactivity that can play across any web browser, Apple, Android or other Mobile device?
- ideaist0
Great stuff above mstocks; flexibility is the new black...
; )
- dbloc0
Is there a framework for the sites shown on http://mediaqueri.es/. Is it switching CSS based on browser size?
- ukit0
No framework, it's quite simple actually and is just a part of CSS3
- tgqt0
http://cssgrid.net/ is one of the sites listed at http://mediaqueri.es and is a great place to start
- Boz0
Good luck.. you will now face the beauty /s of mobile web development in HTML technologies and all the "advantages" you will hear everywhere :).. especially good luck with animations :)
Being done with snarky remarks here's a tip.
For animations the ONLY viable option to you is to use CSS transforms (via webkit). They are supported on Chrome on Android, Safari on iOS and I think Blackberry Playbook too. The rest probably won't work but these days you really only need these 3. Windows Phone 7 will not work because the browser currently doesn't support HTML5 or new CSS stuff to the fullest and it's not webkit based so no hardware acceleration as well there.
- ukit0
What about jQuery Boz? Isn't that a lot more widely supported than CSS3 animations?
- ukit0
FWIW, here's a 10,000 foot view since a lot of people tend to misunderstand HTML5:
When it comes to standards based design, think of any element on the screen like a movieclip on your Flash timeline. JavaScript (of which jQuery is an easier-to-use library for) like Actionscript. So really the majority of user interface stuff - animating menus, buttons, responding to user actions, etc...can be done with just regular HTML and JavaScript. And for a lot of web apps, that's all you'll ever need on the front end, and its well supported on devices using the jQuery Mobile Framework linked above.
What HTML5 adds is a set of APIs to extend these capabilities. So with HTML5 you have the ability to do specific things like play video in native format (HTML5 video). Dynamically render bitmap animations using Canvas. Store databases of information directly in the user's browser on the client side...etc.
However, chances are a simple quiz app won't need to do any of these things. So you can simply use JS/ jQuery.
- Boz0
it is.. but it's simply not running well on mobile. I mean certain things can pass but JQuery animations are not hardware accelerated by iOS and Android, webkit CSS transforms are. Even HTML5 canvas is not running great.
I'm totally up for using JQuery for code/data logic. The problems I have found were mostly relating to animations and transitions and issues with performance.
JQuery is going to be perfect for him to do on desktop browsers, but he will need to sense for mobile, then sense for webkit and use JQuery to manipulate CSS properties and call webkit specific transforms if he wants animations to run smoothly on mobile devices.
The issue with webkit transforms is that they are really not working THAT great. They are better than JS animations but there are issues in mobile browsers when you are trying to move more then 1 item via webkit transforms. They exhibit visual anomalies or just don't work or some weird crap like that.. The situation is improving though but it's still all feeling a bit alpha in that regard.
- spot130
Boz is correct. My preference currently is to use Jquery animations with static compatibility on browsers with limited JS support to minimize development time.
- vaxorcist0
useful thread, thanks!
I'm specc'ing out a project, trying to decide between making an app and making an HTML/CSS/jQuery site for mobile.... I'm voting for the later, others want an app, but it's partly a "status" thing....