Examining the ongoing challenges of delivering high-quality, value-added ERP services in Higher Education.

Saturday, August 17, 2013

OBIEE iPhone Design Pattern

So you want to deploy some OBIEE reporting to the iPhone. Are you sure? The harsh reality, despite the sexy-factor, is that rich visualizations simply do not translate to the smart phone. But it looks cool in demonstrations and there will inevitably be some valid user stories. But you need to recognize the real limitations of not only delivering business intelligence to a 4x2 device but also some quirky challenges of OBIEE itself.

I have been playing with this most of the afternoon to deliver a set of guidelines and illustration. First, let me show you a couple pictures before I explain how I got there…
Original “Mobile” Dashboard in Sample App Lite
Original “Mobile” Dashboard on iPhone - Ugh!
iPhone Optimized Dashboard in OBIEE Web Version
iPhone Dashboard in Action
Modest tweaks make BI Mobile look pretty good on the iPhone!
Hopefully it is obvious what a difference it makes to build for the target form factor. Now let’s talk about the steps to get there…

Overall Design

Start with one column and fix its width at 320; while you could make this wider for the iPhone 5+, coding to the smaller form factor is wise. You will then create additional sections for each piece of content; my advice is to make each section collapsible, show the section heading and section title, and give the section a meaningful name. OBIEE does this weird thing and reserves the white space for the title even though the default behavior is NOT to show the section header/title. But in my opinion, any collapsible section should have a name so you can remember what’s there when it is hidden!

My gut inclination is to show the Apply buttons because I personally don’t want a report repainting with every selection of a parameter, especially if I’m on cellular network. But it does take up precious screen real estate, so this is a tricky call.

Prompts: In the newest Sample App, the illustrative Mobile dashboards relocate the prompts from the left side of the dashboard layout to the bottom. This is not the right answer for the current rendering pattern of BI Mobile on the iPhone. If designing for the iPhone, follow these guidelines and you’ll be fine.

1. Place the prompt section at the top of the column.

2. As otherwise noted, make it collapsible and show the section title.

3. Keep it simple. Opt for choice boxes instead of list boxes. Don’t use sliders or other wacky prompts. Be careful of width because OBIEE will let content spill outside the fixed width of the column or section, which is annoying.

Performance Tiles: I love these little guys. They work really well on the iPhone in the following configurations: 2 columns of large tiles or 3 columns of small tiles. Medium tiles are too wide to fit three across (just barely). They are really made for the mobile device, without a doubt the best single way to tell a story on a small screen.

Tables and Pivot Tables: Limit to four columns, font size 8 or 9, and think about height – while long tables can work fine, is that really the purpose of mobile BI?

Trellis Charts: Be very, very careful. Spark bars can be an ally in the quest to optimize use of space. Interestingly, the trellis view has the most effective “maximum pixels” control but you are going to be limited to two columns without having a horizontal scroll bar. And nobody likes those.

Funnels, Gauges, Tickers: No, no, and no. 

Bar Charts: Consider horizontal bars because you simply have more room to tell a story. OBIEE does not behave itself with vertical bars and restricted canvas widths. Or at least that’s my experience!

So there you have it, a few tips and tricks on delivering OBIEE to the iPhone! Hope it helps…


<< Home