MobiRise for JavaScript Website IDE

Interactive, WYSIWYG website design and development is all the rage. Online tools like Webs, Weebly, Wix and SquareSpace deliver rapid, multipage and responsive website development. They are joined by a rush of WordPress and Joomla tools with over 30 WordPress PageBuilder plugins  one-upping the Interactive Web Design scene. Meanwhile JavaScript sits at two extremes: expensive and complex Web design tools like EXTjs or Kendo or simple single, page JavaScript frameworks with free templates but not much else as design tools.

The last 4-5 years have seen the rise of open, free and popular CSS+HTML5+JS frameworks like Bootstrap, Foundation Zurb and Ink for creating mobile responsive apps for a variety of SPA-Single Page Applications to larger multi-page websites. It should not be a surprise that each of these free frameworks have generated a number of libraries of free and premium themes and templates to give your app development a quick start. Shown below is the StartBootstrap library:
mobitemplates
There are similar themes/templates for Foundation Zurb. Ink and other JS frameworks. These theme libraries are very similar to WordPress or Joomla theme/templates. So it should not be a surprise to see a tool like Mobirise appear which in effect delivers  a Bootstrap IDE. This tool  allows you to build your own theme template and website in drag and drop fashion with immediate frontend WYSIWYG feedback. This reviewer can testify Mobirise certainly delivers very fast website design and development.

Like other CMS and JS frameworks, Mobirise provides basic free and premium templates which web developers then cut/paste to modify:

As you can see the Mobirise Editor is similar to frontend WordPress PageBuilders like BeaverBuilder or Divi3. Users are primarily editing pre-made page templates. This is  much less like traditional JavaScript editors like Eclipse or Netbeans or Webstorm. Mobirise is WYSIWYG to the core while traditional tools resemble the MS Visual Studio approach:
mobibeans
There are benefits to each development method. The frontend, interactive method favors development speed and immediate design resolution. The traditional approach gives finer control over both the the UI component functionality and refinement of the UI styling. But the Mobirise template approach certainly delivers fast results. The following photo-promo website was designed and delivered using Mobirise in less than a day including all the photo refinements:wpredfallinto
So if you need to deliver a small to medium size website, Mobirise can help deliver quick results that can be refined in the traditional tools like NetBeans or WebStorm. So the question now is how far can Mobirise take you and at what cost

Mobirise Features

First and foremost Mobirise is a free, standalone app that runs in Windows and Mac and delivers responsive, mobile apps using Bootstrap 3 and 4 codebase.. And the free app has 2 free theme templates which provide a core set of blocks including hero image, image slider, text block, and image testimonial blocks. To get the full range of blocks for Mobirise, users can buy a selection of individual blocks or packages of several blocks as seen in the screen shot below:
mobiextensions
The prices roughly correspond to those paid for premium WordPress plugins and themes. But the big difference is that these themes and  extensions can be used in an unlimited number of  personal and commercial websites. Support is through a forum and updates to the themes and extensions may incur an added cost.  See the video below to see the full range of themes and blocks available:

Summary

Look what Mobirise says about its tool: “Mobirise is perfect for non-techies who are not familiar with the intricacies of web development and for designers who prefer to work as visually as possible, without fighting with code. Also great for pro-coders for fast prototyping of small customers’ projects.” This is the UI IDE revolution that has strongly impacted CMS tools like SquareSpace, Webs, Weebly, and most importantly WordPress. IDEs for WYSIWYG PageBuilding, Slider Creation, and Gallery Generation  make it possible to deliver effective, mobile responsive websites in record time and lower costs in WordPress and now JavaScript. But most important, website owners and designers can collaborate much more closely in the creation and refinement of their websites through the use of templates and rapid design tools. Mobirise is the JavaScript entry into this new fast-design world of website development.

Advertisements

About warkworth1

Web Designer and Developer that uses WordPress primarily but also Bootstrap, Foundation Zurb, Ink, and even Magento etc. Love teaching full stack developer tricks with HTML/CSS/JavaScript/PHP/SQL at WordCamps and on my blogs
This entry was posted in coding. Bookmark the permalink.

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