Tuesday, March 19, 2024

Inside Moboom, a New Mobile Experience

In this article we’re going to have a look at Moboom, a platform for creating responsive web designs. To get started, visit Moboom and sign up for an account. Once you do so, you’ll be directed to a page where you can begin building your new site, all of which takes place on the web.

Looking at the interface I felt confused as to what to do next, until I remembered the welcome and getting started messages. The welcome message contains an overview video and a quick start guide. Questions can be asked in the community. Of the links, the best way to begin is to use the Getting Started guide. These videos give you a fast overview of how to build a site. Each is a little more than a minute long.

Creating a Site

Creating a site is a simple process. Click on the Marketplace tab on the left and pick out a theme (many of these are free).

To look at the themes, click on any thumbnail image. This opens to a larger screen with more information about it, what widgets are included and also gives you a preview where you can see what the design will look like on a desktop, tablet or mobile device.

To build a site, click Sites on the left panel. Pick a theme that you want to use in the center area and click on the blue Use button when you’re ready to go.

When you do so, the dialog box above will pop up. Enter the name of the site, the subdomain then click on the Create button.

After you create the site, you’ll see the following dialog box. If you click on Dig Deeper, you’ll be taken to a page which gives you more information about different aspects of the site building and configuration process. The Next button takes you to the next step in the design process.

Everything on the Moboom interface is a widget. When you click on a widget, more information is given on the right panel. As part of my exploration, I clicked on the phone widget. You can upload a new image or choose one from the library. When I did so, I wound up with a blue screen and my image elements vanished.

If this happens to you, mouse over to the left panel, which will open and click on the Home button. This will return you to the home page. I also found that reloading the page also worked.

You can also add widgets to a page. To do so, go to the top right pane and click on the Widgets tab. This opens a window and you can choose from a variety of widgets to drag onto a page. In this section I found I wasn’t able to drag any random widget onto a page. I noticed that some areas of a page worked well but others didn’t work at all; I don’t know why.

As for the widgets, some use static content which is stored on the page while other widgets use dynamic content. Dynamic content comes into play when you can add more information to a widget, such as a data set. Dynamic content can be used over and over again throughout your site.

To see if your content is dynamic, click on a field, like the one above, then click on the down arrow on your keypad. You should see a list of items like the one above. If not, the content isn’t dynamic.

To access the content section, move to the panel on your left and click the on the arrow next to the word: “Content.” This opens up a list. Each section contains several items which you can edit.

The last step is styling the content. Each widget has styling information, such as: Size, color, font, position, etc. To see the overall style settings for your design, click on Page Settings at the top right section.

To edit a widget, click on it, make sure the Styles tab is selected then change the settings. To edit any style in the list on the right, click on it, then use the tools below to change the appearance.

Once you’re satisfied with the look and feel of your site, click on the Publish button at the top of the interface. You can check out the finished site at: coolcellphones.site.moboom.com

 

Conclusion

Overall, I found the instructions simple to follow. There were a few gaps which caused me to hunt around for the solution, though. The one thing I really like is the responsive design which is built for you for the desktop, tablet and mobile device. While the components are in place, they can be easily modified.

What we’ve covered here are the basics of what you can do with Moboom. In the next article we’re going to explore the functionality in greater depth, using what’s covered in the resources section below.

 

Resources

I was given a video tour by Jef Rice, one of the Moboom founders. Here’s a brief overview of what he covered:

  • Drag-and-drop functionality combined with the ability to write your own code.
  • Live Device Views enable users to see their site on desktop, laptop, tablet and smartphone
  • Adaptive content management system allows you to customize content for the device, using Content Sets to keep your content separate from structure
  • Import and sync content from anywhere in any format such as XML, JSON, CSV or RSS
  • Content-Aware widgets work with any content that’s in the CMS without any programming
  • Widget development environment allows you to code in any programming language you want.
  • Since each widget runs in its own container, you can have various widgets in different languages on your site

 

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Popular Articles

Featured