most of an ipad magazine

for last class, i had fleshed out almost all of my magazine. we spent most of class clicking around in keynote, swearing softly, as we learned about animating interaction in slideshows. (a tremendously useful skill for the future! but only learnable through a lot of trial and a lot of error and just so much clicking.)

so here is the framework for my almost-magazine, the likes of which i have been animating together! i still need to go back in and fix plenty of things, of course, but at least now i know how to make things move around and faux-interact.

this is gonna be an image-heavy blog post. i'm sorry. this doesn't even have the end of my article in it yet... it takes a lot of frames to show how my i-magazine is put together! also, because i can't arrange images in blogger like i would like to, just remember that when you turn pages, you're going side to side and when you pull up on an infographic tab, you get that infographic from below the article.

(you've seen how this part works... but i started using those little skip-track arrows as page nav as well as for infographics)

oh hey full bleed image with a pull-quote... (i said i was gonna try to incorporate that from last round.) he's not going to be page two of my article, though, because i need to establish "go right for more text" before i start to mix it up with a pretty picture.

some text pages! look at 'em go. all these have is page nav interaction, nothing too extraspecial.

here's a nice place where the ipad lets me arrange information a little better than my magazine spreads... the text from these paragraphs relates to two infographics, whereas they don't necessarily relate to the rest of the article. unfortunately in my spreads i just put one of those infographics on the next page, so it was close enough, hopefully, to still relate, being the very next thing you saw, but this gives me the opportunity to use both of them at the same time, since they both talk about the equipment.

i think i'm going to end up taking the interaction out of this because, as much as i like the idea of it, it doesn't really sort the information or add any level of understanding, it's kind of just interactivity for its own sake. so in the future i think you'll just pull the tab and this will come up, all filled in. but as it's shown here, the input and output lists are empty until you drag your finger from a piece of equipment to the mixer, at which point the black line appears and a description of the object shows up under its appropriate heading. the icon shows up as soon as you touch the item but the text doesn't appear until you finish connecting the two.

the map would appear horizontally, telling the user to tip the ipad to its side. i tried to set this up vertically but scale-wise, it just wasn't going to happen, and the interaction insists that you be able to see the whole timeline all at once without scrolling, so this was the best simple solution available. upon opening the timeline, it would be entirely filled in with a row of icons underneath. the icons act as toggle-buttons to display different amounts of information so that you could track the evolution of one object at a time.

if you just click one icon, the others will fade and their information will be removed, leaving you with the history of just one thing. if you touch another icon, it will brighten to full opacity and add its information to the timeline so that you can compare more than one history. 

just gotta finish up the body-copy pages, and then animate it all. also, tighten it all down. also also, acquire an ipad someday maybe because that would be supernifty.