Blog

One of the most useful ways to present complex information and multiple choices to a mobile app user has been the touch-enabled scrolling table. We all use these tables every day on our smartphones when reviewing our email inbox, Twitter feed, and similar lists.

When building custom mobile apps, the scrolling table is often essential for showing results of data queries and responses from REST APIs. The earliest mobile apps kept the presentation to the user very simple – each row would typically show one or two lines of text and maybe a picture.

Now that mobile apps are working with ever more complex data sources, users need to see more information packed into the scrolling table, but it has to be presented in a visually appealing way so that the user can make sense of all the information. This is exactly what you can achieve with the new Custom Tables feature from ViziApps.

Scroll Tables

Designing a Custom Table

The design process for Custom Tables follows the ViziApps no-coding approach with free-form graphical design of the mobile app page layout.

The ViziApps developer first creates a design pattern that will be used by the table. This is a fast and familiar process which is just like building a new page. One customization that easily adds impact is to include a background image such as a color gradient. Something as simple as changing the color palette can inform the user at a glance that they are looking at a different data set.

You can mix any number of images, and size them and place them wherever you like within the design pattern. The image contents can be preset (as when using a background image), or determined dynamically and individually for every row based on the results of a data query. Text labels can also be placed anywhere within the design pattern, and set to any font, color, and size that you like. Text labels can also have fixed content, or dynamic content for every row based on a data query.

By adding fields to the design pattern, it’s possible to build up practically any size, complexity, and style of table rows that you can imagine. When the design pattern is ready, you can define a new table by specifying your design pattern instead of defining table row fields, and the design pattern can be re-used to define multiple tables.

The excitement happens when you hook up your new table design pattern to a data source such as a Google Spreadsheet, Intuit QuickBase, Salesforce.com, or SQL database. With ViziApps’ no-coding approach to data management, you will quickly assign your data source columns to fields in the custom table, and start enjoying table design without limits!

If you’re not the most artistic designer or you’re trying to meet a tight deadline, or you want to share your mobile page design with your team or our community – you will love ViziApps new Smart PagesTM. As with any design activity, starting with a blank page can be intimidating and there are often aspects of building apps for Apple and Android devices that need to be repeated or reused in a new context. Why reinvent the wheel when you can leverage existing best practices for mobile app design?

Solving these issues is exactly what ViziApps is delivering with our new Smart Pages catalog of professionally designed Smart Pages. Use them for the fastest way yet to build full-featured mobile apps. Or create your own Smart Pages so that you can organize your designs and share components for team development or share with the ViziApps community.

A Catalog of Smart Pages

The ViziApps catalog offers a range of Smart Pages to perform functions like displaying data to a scrolling table or showing a place on a map. And the catalog will grow with more Smart Pages over time. Just find a Smart Page that meets your specific need, plug it into your app design, connect it to a live data source, when needed, and that page is done!

ViziApps offers a range of data connections so you can get business data into your users’ hands in real time, without coding. Our data sources include Intuit QuickBase, Salesforce.com, Google Spreadsheets, SQL databases and REST interfaces. As with the rest of ViziApps, hooking up your data to a Smart Page is a simple drag-and-drop process.

The process of building mobile apps with ViziApps is an easy visual experience without coding, and allows you to build complex apps from individual pages. Smart Pages makes this experience even faster because you can organize your app by selecting a series of Smart Pages, connect to live data sources, and put in the finishing touches.

Of course the best-designed components can’t anticipate all individual needs, so ViziApps lets you add our standard fields to the Smart Pages in your app, so you can customize them to achieve the perfect user experience. You can even mix Smart Pages with your own fully custom pages in the same app in any way you want.

There are few things more important to Internet and mobile users than sharing, and now ViziApps brings sharing to mobile app creation. Even for small projects, it’s very common to have multiple people collaborate in different ways to design and test a mobile app. ViziApps new App Sharing feature allows any user to share any of their app designs with any other ViziApps users.

App Sharing solves critical needs for team development:

  • Developers can share their app with others for evaluation and testing
  • An app can be shared with a UI design specialist for consultation and improvements
  • Contractors can be included into a team when needed, and then their sharing can be revoked when the contract is complete
  • After an app has been released, different people can be assigned update and maintenance tasks
  • Managing the important controls for publishing through one individual so a company keeps a secure relationship to the App Stores and Mobile App Management Systems
  • When developing apps for a customer, briefly sharing app designs with them, so they can validate the features and test for themselves

Sharing an app is easy. The person creating an app clicks on the new “Share This App” button in ViziApps Studio, and enters the username of other ViziApps users. They declare whether the users are Developers or Testers. A Developer can edit an app design and test it in both Preview Mode and on any mobile device, then share their changes with the App Owner. A Tester can test an app, but not edit an app.

The person that created the app remains the App Owner, and is the only one that can publish to the App Stores. The App Owner can also revoke sharing of their app at any time. There is no limit to the number of apps that can be shared, or how large the app sharing team can get.

Now, with ViziApps App Sharing, enterprise teams and the contractors that serve them can manage the complete cycle of designing, testing, and publishing their mobile apps.

ViziApps has been adding many features that make it faster and easier than ever before to create mobile apps for enterprise and commercial applications. Now ViziApps announces the availability of QR Code and Barcode scanning, seamlessly integrated into mobile apps with very little effort.

Some of the most common barcodes that you see are Universal Product Codes used for pricing and inventory control, and which can be seen on nearly all packaged products found in supermarkets as well as many other kinds of stores. Since they are so easy to generate, print, and affix to packages, barcodes have greatly improved the operations of many companies and industries, for example they are used to track packages by courier and shipping companies.

QR (or Quick Response) codes have the same ease of generation and printing as barcodes, but allow for much larger data representation. One of the most common uses that you see for QR codes is a quick reference to a URL, typically for finding a website or mobile app. QR codes have the ability to represent more than a thousand characters of text, or even binary data, so they are finding their way into a wide variety of commercial applications.

The quickest way to learn about integrating QR Codes and barcodes into mobile apps is to examine the Design Catalog template in the ViziApps Studio. This demonstration app shows you how to insert a single button in your app that call up the image scanner, and then automatically shows you the code’s value once the scan is successful. The scanned value is held in a variable that can then be used for any purpose, such as setting the URL in a browser, or performing a database query based on this value.

Subcategories