<div dir="ltr">Flinto is rad.  You upload screenshots of the app then can set up hot zones that can be tapped to do simple transitions.<div><br></div><div><a href="https://www.flinto.com/">https://www.flinto.com/</a><br></div>
<div><br></div><div>Made in SF. (Disclaimer: I know the guys - they're great!)  Dunno if it supports animated gifs.  That would be a good suggestion for them if you need it.</div><div><br></div><div>  - mang</div></div>
<div class="gmail_extra"><br><br><div class="gmail_quote">On Wed, Jul 24, 2013 at 2:13 PM, Anders Nelson <span dir="ltr"><<a href="mailto:anders.k.nelson@gmail.com" target="_blank">anders.k.nelson@gmail.com</a>></span> wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">Hi everyone, I promised to contribute after I had something to share so here we go!<div><br></div><div>For the mobile app mockup I worked with SF Dev Labs (<a href="http://sfdevlabs.com" target="_blank">sfdevlabs.com</a>) and my designer/coder was Jehan Tremback, a Noisebridge member. I contacted several other design houses beforehand but they returned neither my emails nor my calls which I found pretty lame. I would definitely recommend SF Dev Labs.</div>

<div><br></div><div>The UI items don't seem to all work in a desktop browser but they should on a mobile device. You can see the results here:</div>

<div><br></div><div><a href="http://www.erogear.com/downloads/mockups/joggly-gh-pages/" target="_blank">http://www.erogear.com/downloads/mockups/joggly-gh-pages/</a><br></div><div><a href="http://www.erogear.com/downloads/mockups/cyclomatic-gh-pages/" target="_blank">http://www.erogear.com/downloads/mockups/cyclomatic-gh-pages/</a><br>

</div><div><a href="http://www.erogear.com/downloads/mockups/sparklemotion-gh-pages/" target="_blank">http://www.erogear.com/downloads/mockups/sparklemotion-gh-pages/</a><br></div><div><br></div><div>Here are some details about what was built:</div>

<div><br></div><div>- I needed three separate mobile app mockups. One for running, one for cycling and one for dancing/fashion.</div>
<div>--The running app needed choices for data to be externalized and look like a typical athletic tracker. The wearable display was mounted to the upper back of the runner.</div><div>--The cycling app needed to demonstrate the GPS-guided turn signaling possible with the wearable display system (a messenger-bag mounted panel).</div>


<div>--The dancing/fashion app needed to show a list of graphic choices and one item that would show a dynamic preview. Touching the "pulsar" item animates a GIF to make it seem like the selection is now playing on the wearable display (a belt).</div>


<div><br></div><div>We used a web-based platform (CSS and Javascript) so development time was minimized and it would work well on both Android and iOS. iOS was easier because there are metatags or something to force Safari to hide the address bar easily, making the web app look like a native app. Android was more difficult, and we had to use the Dolphin browser with Dolphin Jetpack (their HTML5 support package) to get the same functionality. Metatags would not hide the zoom controls when using a simple webview.</div>


<div><br></div><div>To make the GIFs from the Quicktime animations I made using Apple Motion for use in the Sparklemotion mockup I used <a href="http://gifninja.com" target="_blank">gifninja.com</a>. Really awesome and fast.</div>

<div><br>
</div><div>The intent is to take these mockups and re-create them as real, native mobile apps so Kickstarter backers can use their products out of the box if other app developers haven't taken the reigns already. All the mocked-up functionality will indeed be functional.</div>


<div><br></div><div>I'll follow up with deets on the videography stuff once that's all done.</div><div><br></div><div>=]</div><div class="gmail_extra"><div class="im">
<br clear="all"><div>--<br>Anders Nelson<br><br><a href="tel:%2B1%20%28517%29%20775-6129" value="+15177756129" target="_blank">+1 (517) 775-6129</a><br><br><a href="http://www.erogear.com" target="_blank">www.erogear.com</a></div>

<br><br></div><div class="gmail_quote">On Sat, Jul 6, 2013 at 8:44 AM, Romy Ilano <span dir="ltr"><<a href="mailto:romy@snowyla.com" target="_blank">romy@snowyla.com</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">



<div dir="auto"><div>There's an open source tool called TAP that you can use with adobe fireworks </div><div><span style="font-family:'.HelveticaNeueUI';font-size:15px;line-height:19px;white-space:nowrap"><a href="http://unitid.nl/2011/03/touch-application-prototypes-tap-for-iphone-and-ipad-using-adobe-fireworks" target="_blank">http://unitid.nl/2011/03/touch-application-prototypes-tap-for-iphone-and-ipad-using-adobe-fireworks</a></span></div>



<div><br><br><div>---</div><div><br></div><div>Romy Ilano</div><div><a href="mailto:romy@snowyla.com" target="_blank">romy@snowyla.com</a></div></div><div><div class="h5"><div><div><div><br>On Jul 5, 2013, at 14:31, James Young <<a href="mailto:pronoiac@gmail.com" target="_blank">pronoiac@gmail.com</a>> wrote:<br>



<br></div><blockquote type="cite"><div><div>I've heard good things about the Briefs prototyping and mockup tool. </div><div><br></div><div><a href="http://giveabrief.com/" target="_blank">http://giveabrief.com/</a> </div>



<div><br></div><div>-James <br><br>Sent from my iPhone</div><div><br>On Jul 5, 2013, at 12:10 PM, Anders Nelson <<a href="mailto:anders.k.nelson@gmail.com" target="_blank">anders.k.nelson@gmail.com</a>> wrote:<br><br>



</div><blockquote type="cite"><div><div dir="ltr">Thanks so much guys for your suggestions, I'm following up with a few people who responded and I'll let y'all know how it turns out and what the process was like in case it can be useful.<div>



<br>
</div><div>=D</div></div><div class="gmail_extra"><br clear="all"><div>--<br>Anders Nelson<br><br><a href="tel:%2B1%20%28517%29%20775-6129" value="+15177756129" target="_blank">+1 (517) 775-6129</a><br><br><a href="http://www.erogear.com" target="_blank">www.erogear.com</a></div>

<br><br><div class="gmail_quote">On Wed, Jul 3, 2013 at 12:52 PM, Anders Nelson <span dir="ltr"><<a href="mailto:anders.k.nelson@gmail.com" target="_blank">anders.k.nelson@gmail.com</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">




<div dir="ltr">Good afternoon comrades!<div><br></div><div>Anders has yet another mobile app question - can anyone recommend someone or a firm that can make a mockup of a mobile app that runs on a mobile device?</div><div>





<br></div><div>I'm not looking to implement real functionality, only the UI elements and simple transitions between pages or something. I'm thinking this could be built with a cross-platform foundation like Titanium to make things easier. Again, all it has to do is look like it's doing something when the user is pressing buttons (maps text field, static map view with animated GPS-looking beacon, normal view transitions, etc).</div>





<div><br></div><div>I'm slated to shoot the video and stills for the Erogear Kickstarter campaign June 18-19 and I'll need to have this simulated app ready by then.</div><div><br></div><div>May I tap into your infinite wisdom?</div>





<div><br></div><div>=]</div><div><div>--<br>Anders Nelson<br><br><a href="tel:%2B1%20%28517%29%20775-6129" value="+15177756129" target="_blank">+1 (517) 775-6129</a><br><br><a href="http://www.erogear.com" target="_blank">www.erogear.com</a></div>

</div></div>
</blockquote></div><br></div>
</div></blockquote><blockquote type="cite"><div><span></span><br><span>----------</span><br><span></span><br><span>dorkbot: people doing strange things with electricity</span><br><span><a href="http://dorkbot.org/dorkbotsf/" target="_blank">http://dorkbot.org/dorkbotsf/</a></span><br>



<span>SUBSCRIPTION AND UNSUBSCRIBE OPTIONS HERE:</span><br><span><a href="http://music.columbia.edu/mailman/listinfo/dorkbotsf-blabber" target="_blank">http://music.columbia.edu/mailman/listinfo/dorkbotsf-blabber</a></span><br>



<span></span><br><span>----------</span></div></blockquote></div></blockquote></div></div></div></div></div></blockquote></div><br></div></div>
<br><br>
----------<br>
<br>
dorkbot: people doing strange things with electricity<br>
<a href="http://dorkbot.org/dorkbotsf/" target="_blank">http://dorkbot.org/dorkbotsf/</a><br>
SUBSCRIPTION AND UNSUBSCRIBE OPTIONS HERE:<br>
<a href="http://music.columbia.edu/mailman/listinfo/dorkbotsf-blabber" target="_blank">http://music.columbia.edu/mailman/listinfo/dorkbotsf-blabber</a><br>
<br>
----------<br></blockquote></div><br></div>