Build amazing Dashboard prototypes

Read how MockupTiger fixed the font rendering issue. You will also notice that with the fix, it is now possible to add any of your favourite font for wireframes. Why just limit to Comic Sans or Arial. Try the Google web fonts for instance.

Build beautiful Dashboard prototypes with MockupTiger Wireframes

Goodbye Excel! now I can have true charting prototypes with Wireframes and mockups from MockupTiger

MockupTiger when released had Clickable prototyping feature using the Text widgets

Now all the text widgets, icons can be linked. There is a new element called hotspot that you can overlay on any kind of object/widget to simulate Clicking or interactivity

Read more about building Clickable Prototypes using Mockups

Here is a list we reviewed and think it is the best overall application.

• Completely web based
• Real dashboard chart widgets
• Over 80+ website widgets
• True vector icons
• Create custom html5 icons
• Community Gallery
• True pencil like sketchy look
• Create links to simulate interactivity using Text or hotspots
• Export to PNG and PDF
• Automatic daily revisions
• Speedometers/Gauges/Dials
• Intuitive interface

We will Add Calculations and Formulas

Add Calculations
Since this is a raw extract of actual transactions, it may need to add additional calculations and columns to create useful metrics.

For e.g in our sample file, we have the “Unit Price” and “Quantity” columns. We will create calculation to derive the “Amount” column

Right click on the Quantity Column, Navigate to Popup Menu

Create ‘ –>Create Calculation
It shows a calculation wizard.

1. Click on “Unit Price”
2. Click on * multiplication operator
3. Click on Quantity
4. Rename the column to “Amount”
5. Click on “Use this Formula”

As you see, the “Amount” column is added right next to the Quantity column

Next – Add Date Hierarchy Columns – Excel Dashboards – 5

Read More

Create your excel dashboards on Desktop and then easily put them on the web or intranet.

Download the web dashboard files

• Web Dashboard Documentation

The documentation is a complete printable reference guide for converting desktop to web dashboard and has a reference section for chart properties to create advanced charts.

Download web dashboard software

• The link to the web dashboard software is provided within the above documentation link.
• download web dashboard software

Read More

Sometimes, due to some improper setup of Microsoft Excel or incomplete components for Microsoft Office, direct connection to Excel files may not be possible.

This tutorial provides an alternative method to connect to the Excel Files. This method also applies to any new format of Excel Files or Microsoft Access databases (ie. mdb or .accdb)

Steps to Create DSN for ODBC connection

1. Click on the Start menu and click on the Control Panel

2. Click on the “Administrative Tools”.

NOTE: You may need to “Switch to Classic View” in windows Vista or newer version of your windows operating system

3. Click on the “Data Sources (ODBC)” setup icon

4. Click on “Add”

5. Select .xls, .xlsx .xlsm .xlsb option if you are using the latest Excel version and format of Excel

6.We will select the normal .XLS version since this northwind.xls file was created using old format

7. Give a short and simple name to this DSN entry

8. Now select and point this DSN name to the appropriate Excel file

9.

10. select the file and click OK. Close all the dialogs.

11. Now go back to InfoCaptor connection wizard

12. Select the “ODBC” option now instead of the “Excel” option

13. Give some simple name to this connection so that InfoCaptor can easily remember it

14. Type the ODBC name that was defined in the ODBC DSN setup screen previously

15.

Click on the Connect button and then you can proceed the remaining of this tutorial after the connection part

Free Dashboard PDF Tutorial

Read More

How do you share your Excel Dashboard with users?

Now that you have built the dashboard, you can share the dashboard in multiple ways.

” Create a PDF output of the dashboard and send as email attachment.

Click on the PDF icon on the toolbar as shown below and it will instantly create a PDF output

PDF output

” Create Static HTML output. Click on the HTML icon on the toolbar. This option creates a static html page that you can put in on the web. Users cannot interact with the dashboard. It is just a snapshot image of the dashboard at the time the output was generated. It does not refresh automatically. You will need to regerate the output again when the data is refreshed.

” Desktop Sharing. You can put the dashboard definition file (icv) on a file share directory and other users can view the dashboard through the Dashboard viewer. You may need separate license for dashboard viewers for desktop.

Go to Menu Create ‘ Publish to web and it will generate a file that you can put it where the dashboard web server is and it will render the output. The look and feel is different with this option

The web version is using a flash charting engine to the desktop Java chart engine.
Details of converting the desktop to web version are not covered in the document. Please refer online at any of our websites for more details

You can download the complete tutorial as PDF
” Web Sharing: In this option, you can publish the dashboard to web and the dashboard is available real time with all the dashboard parameters and refresh actions

Read More

Summary

We built the above dashboard completely from scratch.

• We defined Calculations
• We defined date hierarchies
• We built Date Filters
• We built Date Parameters
• We built Bar Charts
• We built Pie Charts
• We cleaned the dashboard layout

Next – Share Excel Dashboard with other Users

Read More

Cleanup – Resize and Organize

Give appropriate names to each portlet.
During the chart creation if we did not provide names, now is the time to provide them.
Right click on each title and click on “Edit”

Scale down the Size

Note, you can drag the corners of each portlet to resize the frames and drag the title name to place them on the canvas

Screen real-estate is very important when designing any dashboard or web application. For better space utilization, we will convert the standard pie to a 3D view

Also, while arranging the objects, keep the most important charts on the top and left area. Put all the detailed portlets at the bottom.

Avoid horizontal scrolling

Remember, do not put any objects on the right side of the scroll bar. Always, keep the scrolling to vertical as it is convienient for viewing.

The above layout will cause for horizontal scrolling and is not a good practice.
Once you do the basic layout of placing the portlets so that they are distinctly visible, it becomes easy to use the resizing options within the tool.

Navigate to Edit ‘ Resize Mode

Once in the resize mode, you can select each object and they are enabled for group resize and placement

Select all the parameters on the top and we will align the top edges with respect to the first one.

As you see, each plet is shown in red with a bar on top indicating it is selected for alignment
One more, thing, you can also turn the Grid mode to see a guide for your alignment and placement

Goto Edit ‘ Show Grid

Note: Once you are done with resize and align with one set of objects, make sure to deselect them before working on the next set of objects

It is best practice to first resize all the objects. All objects on the same horizontal line should have the same height. Select the optimum height of any object on that particular horizontal line and then right click on the title and resize the height of all the selected ones. Then apply the alignment -> Top , deselect the objects and start with the objects in the next horizontal line.

This completes our basic dashboard which is dynamic and extremely informative.
If you need to further customize the look and feel please refer to our online tutorial and reference section
http://www.infocaptor.com/user_help/bi-dashboard-help.htm

Next – Excel Dashboard – Complete Order Management Dashboard

Read More