6 Replies Latest reply: Jul 4, 2011 5:47 AM by Chris Riddell
Chris Riddell Level 1 Level 1 (0 points)

Hi guys,

 

I am after doing an interactive illistration (kindda story book) for my partners daughter and her class for use on an Ipad or Iphone, Anyway I am fine with the graphic side of things as this is my profession however I dont know where to start.

 

My ideas were to make and animate the illistrations in HTML5 or use the Hype app from the App store to create the HTML5 animations, but I really need access to gestures to turn the pages and to interact with the charcters/objects in the illistration.

 

Behaviour I am after at the beginning is

 

* Tap/Poke an image to trigger an animation

* Swipe an image to trigger an animation

* Swipe to turn page (with a nice transition perhaps)

* Get a series of sprites to follow your finger

* Get a series of sprites to run away from your finger

 

Im sure this is all very easy to do, could anyone give me some advice or help, bearing in mind I have very little code skills

 

Thanks

  • Chris Riddell Level 1 Level 1 (0 points)

    Some basic simple help would be grand, Im pretty good at looking at examples and editing to get the results I want...

  • K T Level 7 Level 7 (23,700 points)

    You've detailed your goals, but nothing about what you specifically need at what level, other than zero. You want to work with iOS, in which case the bulk of worthwhile resources are available with a paid developer account via the iOS Dev Center.

  • etresoft Level 7 Level 7 (26,250 points)

    The Safari Developer program is free. Sign up and watch a few of the Web Development videos for ideas on where to start.

  • Chris Riddell Level 1 Level 1 (0 points)

    Sorry KT,

     

    I dont know what you mean by what level, but heres what I think you mean.

     

    I want to make a few illistrations (characters/objects etc) that will make up a scene and will most probably be made out of several layers of PNG images (with alpha) and are animated using simple rotations and translations to create some movement and fun to the overal scene.

     

    I would also like to trigger different animations using gestures, I will probably be just using a tap and swipe for mostly evreything. When I say trigger animations here is a quick example below.

     

    A character (lets say a bird) flies onto an object and has some basic animations using the PNG layer technique above to add movement et, now if a user touches the bird it will trigger a different set of animatios to change its behaviour, now if the user swipes his/her finger the birds animations would trigger to a fly away animation. Another thing would be nice to say have some bees/flys//whaever in the scene that if a user put his/hers finger near them they would follow or flee from your finger (to a certain point) then return to their original location.

     

    Using a icon or perhaps a swipe gesture at the edge of the screen (or place of my choice) the page would turn (nice transition) to the next illistration.

     

    Now my issue is can I do this all in HTML5? do I have access to gestures? or would I need to do a combination of different script languages. Also I need this to be as slick as possiable (im pretty good at making efficient art as im a video games artist)

     

    Also if I do just use HTML 5 and other script langues can I then make this into an app that can be downloaded from the app store? or are there some restrictions meaning I cant?

     

    In a nutshell I need some help from some coders to guide me in the right path, I would rather not rely on somebodys game engine to do this as they are quite costly. Also bear in mind im pretty out of touch with code so I need a little bit of help meaning that I dont like things that say "just paste this code in and it will do this" I would need to know why you add certian parts of code to start understanding the logic

     

    Ideas anybody?

     

    p.s Thanks etresoft that was a great idea and I may persue in this direction.

  • etresoft Level 7 Level 7 (26,250 points)

    To build this as a stand-alone app for the iPad, you will need to have a paid iOS membership. You can still work entirely in HTML5. Prototype the app as a website and then get the paid membership when you have it ready to go. There are no restrictions you will have to worry about. Apple considers HTML5 and JavaScript as equal to Objective-C and C++.

     

    Here is a place to start: http://blog.intuitymedialab.eu/2010/05/19/intuitys-notabene-rapid-html5-prototyp ing-on-the-ipad/

  • Chris Riddell Level 1 Level 1 (0 points)

    Awesome thanks thats made me feel a little more happy

     

    Yeah I will wait until I have a complete prototype before paying for membership.

     

    Right best get me a decent HTML 5 book and ref now....