Designing mobile apps with Onsen UI

Using web technologies to develop mobile apps is a very attractive idea. Technologies that you already know and love can also be useful for the mobile field without the need of spending a long time learning new skills: Just HTML5, CSS and JavaScript.

While there are many existing solutions for the CSS part, truth is that most of them would require a huge effort in order to make a good fit for the mobile UI. This is the main reason we want to delegate the whole UI task to a framework specialized in mobile view that fixes the already well known cross mobile browser problems. Here is where Onsen UI comes in.

onsen ui

Onsen UI is a mobile focused UI framework whose version 2.0 was released some weeks ago. Some of its key features are:

Automatic styling

It provides UI components prepared to be displayed on mobile devices that are automatically styled depending on the running platform. This means that the same component (literally same code line) will be displayed as Material Design on Android devices or as flat design on iOS devices.

Easily extendable

Plug your own custom styles or modify the provided ones to fit your needs. Easy and simple CSS.

App navigation

It also exposes control components that make super easy handling many pages in the same app. Page transitions are made with native-like animations that can also be modified.

Framework agnostic

Since it is made on top of standard technologies, it can be used together with any other JavaScript framework you want for your app. Pure JavaScript, jQuery, AngularJS, Angular 2, React, Vue, Knockout… it is up to you!

Open source and free

Use it as is or modify it if needed and do not worry about publishing apps. It does not limit you at all.

Resources and community

Since its release, Onsen UI is being adopted and its community is quickly growing. It also comes with documentation, tutorials and sample apps.

Development tools

Although it can be used standalone, Onsen UI is also perfectly integrated with the Monaca Toolkit, which provides premium full stack solutions for mobile apps including development environment, templates, debugger, deployment, easy store publishing and more. Monaca works on top of Cordova/ PhoneGap extending all their existing features such as plugins. You can just focus on your app logic and let Monaca and Onsen UI take care of the rest.

For everyone

New to hybrid app development? Have a look at this free video course and get started blazing fast with Onsen UI. Already experienced? Have a look at Onsen UI blog and find more advanced tips about third party APIs and more.

Do not hesitate to give it a try and start making your own apps today.

My name is Sarah Sparkle, a Web and Graphic designer. I am passionate about all things design related including web, character, and graphic design.
Previous Post

40 Beautiful Happy New Year 2017 Wallpaper

Next Post

Phenomenal Website Performance Tips For Beginners

Leave a Reply

Your email address will not be published. Required fields are marked *