About these ads

David Vassallo's Blog

If at first you don't succeed; call it version 1.0

Android : Developing a Metro-Style RSS reader


Nowadays the playstore / appstore is awash in magazine style RSS readers. With good reason, since they leverage an existing and widely deployed technology (RSS) to promote and present site content in a very attractive way. The proliferation and ubiquity of mobile devices means that everyone has access to a form factor which lends itself quite well to a magazine-like experience, with touch gestures, high-resolutions and interactivity.

In this series of articles, i’ll describe how I built a basic magazine style android app inspired by Flipboard and whose theme is inspired by Windows Metro. A sneak peek into the finished app:

Selection_102

First of all, a list of tools and why I chose them:

  • Intel XDK New: A new cross-mobile development platform (previously AppMobi) by Intel. It’s stength doesnt necessarily lie in a new API, but rather in how well the IDE brings together exisiting tools and APIs into one brilliantly easy to use package. The platform takes a tak similar to Cordova (in fact it directly supports Cordova APIs), and allows you to build native apps that are HTML5 / Javascript based. It leverage exisiting tools like Apache Ripple for device emulation and Apache Wienre for remote debugging, along with a mobile app for easy on-device testing, all supported by a fantastic backend that allows you to easily test and build mobile apps. To be honest, I decided to build this entire RSS app just to play around with this environment and learn how to use it and its capabilities. All in all, this is one impressed developer.
  • Metro UI CSS: Not being much of a designer, I need lots of help when it comes to attractive design and easy to use CSS. Thankfully Sergey Pimenov has an excellent, Bootstrap-based Metro UI framework. His framework is open-source, fully-featured and very easy to use… what more could you ask for?
  • touchSwipe: A jquery based library that hooks into your webpage to easily allow you to detect various touchscreen events like swiping in all directions. It even includes multitouch support!! Extremely handy in mobile web application development
  • Jquery and Jquery Mobile: I wouldnt be able to develop as easily, quickly and pain-free if it weren’t for the jQuery framework. One of the most popular around, and with good reason…

Tools I’d like to use in the future:

  • Freetile.js: You could use this library to great effect. It basically takes a bunch of different-sized divs, and dynamically re-arranges them around the screen to get a flipboard-like tiled layout…

Stay tuned for more articles containing some tips and tricks I learnt along the way.

UPDATE: Check out the first version of the android app here, or click on the google play badge on the sidebar

About these ads

One response to “Android : Developing a Metro-Style RSS reader

  1. Pingback: Android : Developing HTML5 apps part 1 | Dvas0004's Blog

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 160 other followers

%d bloggers like this: