Responsive Design is the backbone of next-generation mobile BI. Responsively designed BI apps enable you to deploy one application to all devices – one design that adjusts to any screen size, keeping development simple and maintenance efforts low. Here are some guidelines to keep in mind when designing responsive content for a mobile interface.
1. Use tiles or panels
Design content in a series of modular tiles or panels. The tiles can then form a grid layout, which makes it easy for users to scan the app for relevant content.
2. Think symmetry
When designing tiles, make them symmetrical in terms of height and width. In so doing, you’ll be able to rearrange content easily and even re-use it between multiple BI apps.
3. Shrink your work
Not every piece of content visible on a large screen needs to be present on a smaller tablet or smartphone screen. Pick out the most relevant content for a mobile audience and hide unnecessary features that only make sense on a desktop app.
4. Shrink images
Remember that smaller devices such as smartphones have limited bandwidth, so stick to images that can be resized proportionately and downsized to a lower resolution to save space.
In the wake of the BYOD movement, organizations are challenged to support multiple devices for accessing business information while providing the best mobile experience for end users. Seamless mobility is now an expectation for many knowledge workers who rely on smartphones and tablets to do their work. With arcplan 8, our latest release, we offer unparalleled flexibility for mobile business intelligence deployments for developers and users alike. arcplan 8 was designed with the principles of Responsive Design in mind. Developers can use our HTML5 client to build state-of-the-art BI applications that only need to be designed once, yet can be deployed on any mobile device. Let’s examine the 5 principles of Responsive Design – design principles that are simple and effective, and can be used as a guideline for developers to create responsive mobile BI applications:
1. Design with mobile in mind.
Designing with mobility in mind leads to a better user experience across all devices and platforms. When designing a BI dashboard application, think of the charts as modular tiles. These tiles will need to be rearranged depending on the device’s screen size and orientation, so it helps if they are designed with similar widths and heights. Desktop monitors and tablets in landscape orientation can accommodate all the tiles arranged in two rows, but smartphones and tablets in portrait mode will be better served by tiles stacked on top of each other so the charts are large enough to be understood without too much zooming.
2. Start with the smallest device first.
Last year on this blog, our SVP of Global Marketing Tiemo Winterkamp said that 2012 would be the year that mobile design standards emerge. In the same article, he predicted that Microsoft would be back in a big way with a new design language called Metro that would make mobile apps friendlier than ever. He was right on both counts, except that now Metro is called “Windows 8 design” or “Modern UI Design,” rumored to be because of possible infringement on the name of a company called Metro AG. Either way, Windows 8 is influencing mobile interface design well beyond Microsoft products. In fact, it’s transforming the way we design mobile BI apps − for the better.
Why do mobile apps need special design rules? A parallel is how nearly every company has a mobile version of their website. It’s the same content but it adapts to the user’s device, incorporating larger buttons, bigger fonts, etc. This idea is known as Responsive Design (depending on the target device, a completely adapted layout will be launched). Mobile traffic is currently only 10% of all global web traffic, yet we’ve created a set of design standards for experiencing websites on mobile devices. In the same way, mobile BI use is a small percentage of overall business intelligence usage, but it’s growing and it demands to be accommodated.
So why does arcplan advocate the Windows 8 design style for mobile apps?