Prototype Android apps using HTML, CSS and JavaScript

Prototype Android apps using HTML, CSS and JavaScript(jaunesarmiento.me)

106 points by jamesflorentino 13 years ago | 20 comments

amenod 13 years ago |

It looks like this will be the first sceptical comment... ;)

I didn't try Fries, but I tried using PhoneGap for prototyping and found that building such a web app is not much faster than building one in XCode (and I was a web developer for nearly 15 years!). So why bother?

Another problem is that if I want to build prototype in your framework, I must learn its conventions (what was that CSS class again, "buttonnormal" or "button-normal"? Since the web frameworks can't really compete with native apps in terms of user experience (behaviour of UI elements differs from what user expects), I will have to build in Objective C - which means I have to learn both iOS programming AND your framework.

Granted, such a tool would be useful if UX team wants to build prototypes and they only have web knowledge - and you have a separate team for building a final (native) version. Other than that I fail to see a point.

I would love to be proven wrong though. :)

BTW, my comment doesn't apply to Titanium which basically produces a native app (but I don't use it for other reasons).

pedalpete 13 years ago | |

I think the idea that 'I have to learn your framework' might be a fairly minor one when you're dealing with html and css. The learning curve is tiny compared to learning Objective-C or Java (for Android apps).

For getting a proof of concept together, and for early stage testing on multiple platforms, you can't beat html. As you mentioned Titanium and it's competitors have some challenges, that honestly, HTML just doesn't have.

That isn't to say that every app should be an html app, just that in early the early stages, if multi-platform, levaraging of web developers (rather than finding app developers) is your goal, a tool like this can be very valuable.

jaunesarmiento 13 years ago | |

Okay, thanks for your comment bud. :)

I see a huge flaw in your understanding of Fries. You mentioned Xcode and Objective C in your comment but the whole point of Fries is to prototype Android apps on HTML, CSS, and JS.

Fries aims to make creating Android apps/prototypes easier. If that doesn't apply to people who finds that doing it on Eclipse UI Builder is much easier then Fries isn't for them.

If that doesn't answer your questions, hit me up with another comment. :)

Cheers!

matchu 13 years ago | | |

I think the parent comment is saying that, once I'm done prototyping with Fries, I'm going to move to native technologies, so I'll have to learn two systems total—and, since the parent comment asserts that prototyping in native technologies doesn't take too long, it wouldn't save me much time to use Fries, especially if I have to take the time to learn it.

ux-app 13 years ago | |

one potential benefit to HTML/CSS prototyping is that it's quite easy to share ideas. Upload somewhere and share a link. The equivalent for native would be screen sharing or sending an XCode/Eclipse project (or binary) which is slow and limits sharing to devs.

elietoubi 13 years ago |

Pretty cool ... reminds me of ratchet http://maker.github.io/ratchet/

Why would you use that only for prototyping and not in production?

jaunesarmiento 13 years ago | |

Actually, you could. :) It's really inspired by Ratchet that's probably why it reminds of you of it.

I'm already thinking of putting up a tutorial on how to integrate it with PhoneGap. So let's all hope that comes out soon. Cheers!

elietoubi 13 years ago | | |

That would be awesome! Thanks for the great work ... Companies like Google should be in charge to maintain these kind of projects as it's going to bring a higher volume of developers to their platform!

sauravt 13 years ago | | |

I am really looking forward to the phonegap integration.

warrenmiller 13 years ago |

Prototyping them in the IDE is pretty damn easy tbh..and you've done some of the work to build them.

sauravt 13 years ago |

How is it different from using jQuery Mobile with phonegap(cordova) ,just curious.

jaunesarmiento 13 years ago | |

It's not all that different. Although, Fries aims to deliver components just how you'd see them in a native Android app (check out Android Holo Dark theme) and employs Android UI guidelines. Most prototyping frameworks out there all look iOS-ish. That's where Fries is different.

Demiurge 13 years ago | | |

So it should be possible to use this as a bootstrap theme for a phonegap app? I've been looking for something like that.

fmilne 13 years ago | | |

This is really great. I was going to use Ratchet for a Android prototype but having the native UI components sets better expectations of how the app will look and fell. Thanks for putting it together

jaunesarmiento 13 years ago |

Updated the docs! http://jaunesarmiento.me/fries

hayksaakian 13 years ago |

A visual demo would be nice too.

(If its there,via didn't see it on nexus7 4.2