Challenge Summary
We recommend you to start by digging into data visualization design best practices, research Microsoft Power BI and think about simple ways to provide data visualization experiences.
We are really excited to kick off this new DViz Design Concepts Challenge.
Round 1
Submit your initial designs for a checkpoint feedback- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have the correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Submit your final designs with all checkpoint feedback implemented.- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have the correct flow! Use correct file numbering. (00, 01, 02, 03)
In this challenge, we are looking to design creative (and useful) data visualization dashboards that will enable salesforce/sales reps and management of the organization to continuously monitor and measure their sales performance against set targets at various levels of the organization.
Design Considerations
- We are looking for a simple, easy-to-use, Informative, modern design.
- Try not to have too much information on your dashboard, you can make them compelling by making the visualization interactive and enable users to walk through or drill into the different insights.
- Use color, visual comparison, and drill-down charts to highlight comparison.
- Have your designs of size: 1366 x 768px (Desktop only, Power BI is responsive by nature so just need to design/ build once)
Power BI Requirements:
- The client has made significant investments in Power BI and this will be their future technical stack for other organizational reporting needs, so it’s very critical to have end-user ease of use and scalability while designing the overall solution.
- All principles of good UX design e.g. minimize user clicks, make the experience more intuitive, minimal time to reach desired selection criteria, store user selections for multiple reports and performance, good color and font themes etc. , these are all critical success factors for this challenge.
- Needs to follow Power BI Design Best Practices and also take a look at the Design Tips
- Please do some research on the Power BI software and get familiar with its purpose, limitations, and what's possible.
Required Visualization and Features
1. General Dashboard Features:
Below aspects are a common theme in all reports, please make sure it is incorporated...
1.1 Location Hierarchy:
- The customer has 3 business units and a global presence. Its business is spread across all continents including North Americas, EMEA, and APAC.
- The organization is structured in segments, sub-segments, territory (s) etc .. in which “Location” is the lowest organizational unit and sales reps (Internal and external) are the lowest level user entity.
- Due to the nature of the business and geographical spread, location dimension is a hierarchical structure. In some business units and geographies, location can be present at 7th level while at another geography it may be present at the 4th level. So users must be able to drill through or search any hierarchy or location in hierarchical slicer (Tree or Folders, etc) and should be able to select one or more nodes.
- Financial organization of customer uses Hyperion for financial planning and it is desired to have the same location hierarchy available for reporting needs as well.
- As shown in the “hierarchy.png”, it’s easy to understand the hierarchical nature of locations data with varying levels. E.g. locations L01051 under TOTEC - Global NSS is at 3rd level, while location L00014 under NAECSAIS is at 6th Level.
We have shared a screenshot of “location” dimension view on the existing report (existing_report.png), as you can see this is not representing locations in a hierarchical structure, but representing in a fixed 4 drop-down format, which is not in synch with customer’s business/organization.
We need to come up with a design to show hierarchical location slicer/selection in place of first 4 drop-downs
1.2 Time Period Selection:
As in any financial or sales reporting dashboards, the customer requires all kinds of flexibility to report data at any fiscal period(s) [ year (s), quarter (s), month (s), week(s), day(s) ]. It’s critical to enable the user(s) to select one or more periods in any of the above parameters of year, month, week etc. Existing Time range selection can be seen on the right side of existing_report.png. As you can see time range/period selection is not intuitive at all, the customer has a major pain point related to fiscal period selection.
A. Users can’t go to Month or Week directly, they always need to drill through Year, Quarter, Month etc.
B. Also, it’s not very intuitive, e.g. a user might want to look at a current/past month or Quarter and do multiple selections.
The selected period will be compared with the previous period in a few measures. For example, if the user chooses 2018, Jan, March, April months, then the report will compare the values with the previous period which is 2017, Jan, March, April.
The user requires to do fiscal period selection(s) of Year, Quarter, Month, Week, Day for current or prior months. Also, the user would be spending time in thinking and selecting various periods for their analysis.
There can be 2 possible solutions for this requirement:
A. One uniform calendar widget in Power BI, which can show different selection options based on user choice of Year and type of fiscal period. e.g. if a user wants to analyze data by fiscal week, calendar should turn into FY week calendar.. as shown in “view 4” in time-period.png (It is a view of Calendar / Period widgets with various possible fiscal views (Quarters, Months, Weeks and Dates) with easy navigation to go back and forth.)
B. Multiple selection dropdowns for Years, Quarters, Months, Weeks and Days:
These set of drop downs for the period should fit in nicely with location hierarchy. These drop downs should be grouped together and also they should look different than location hierarchy slicer/selection.
2. Business/Sales Dashboard:
Currently, there are 7 different business reports (We have shared screenshots of these 7 reports in forums) which are used to measure and monitor different aspects of sales reps performance. All these seven reports are belonging to 2 unique groups, in terms of look and feel. Also, the selection parameters in each of these groups are exactly the same, as mentioned in the above 4 aspects of the requirements, which constitutes of location hierarchy and period selections.
Group 1:
"Overall YoY Performance, Location Transactions (by Rep.), Location YoY Performance, Customer Transactions" are the four reports in this group, all these look very similar to each other
As shown, the report has a selection of location hierarchy and fiscal periods and then it displays 4 different views (3 graphs and 1 table) of various sales revenue, gross profit, and opportunities of various flavors. Other than the change in location hierarchy and Period selection as mentioned in point 1, this category of reports needs to have better color and font selection.
Group 2:
"Margin Marker, Margin Maker Compliance and Coaching Guide" Reports are the three reports in this group, all these look very similar to each other
As shown, the report has a selection of location hierarchy and fiscal periods and then it displays 8 different levers meant to monitor and measure different aspects of business and the second report shows the same measures with displays of top 10 order transactions, constituting the first report.
e.g. Following 2 reports shows 8 levers in a nice rectangular section and each section representing four other measures.
From a UI and UX perspective customer is pretty much satisfied with the 8 levers, their main concerns are related to period selection and location selections about which we have already mentioned in point 1. But if you guys can come up with something better then feel free to show them in your designs.
2.1 User Experience:
As this project is the foundation for various other reporting capabilities a customer is planning on Cloud through Power BI, it’s absolutely critical to have a great user experience. All principles of good UX design e.g. minimize user clicks, make the experience more intuitive, minimal time to reach desired selection criteria, store user selections for multiple reports and performance, good color and font themes etc. are all critical success factors for this program.
As explained in the previous section, there is a total of 7 business reports and they can be clubbed together into 2 or 3 groups - we are open to your thoughts, based on the look and feel and current design. Need to implement better visualization and ease of use for various categories of user groups ranging from Sales reps to top management of the organization.
e.g. Below report shows there is no drill up and drill down functionality, we need to come up with a design to ensure better visualization with drill through and drill up or other user-friendly features.
Also, as a designer you need to think through if all these 7 reports which are in 2 different groups in terms of look & feel can be harmonized into 2 or 3 reports by covering all aspects of selection/search capabilities and reports all business measures.
The customer has business usage in following additional UX features which must be incorporated in the new design.
A. Ability to default current Fiscal year and Current Fiscal Month:
For the first time launch of the report. Technically this requires, a mechanism to default Fiscal Month and Fiscal years in Power BI slicer - drop downs. E.g when a user launches the report on Power BI Cloud on 5th of February 2019, the report should be published with the selection of years in 2019 and month as February in the Slicer drop downs. After the first time download of the report, the user should be able to switch to any period of their choice as mentioned in the time range selection section (3)
B. Ability to switch between local currency and USD
- All transactions in the Fact table is maintained in USD and local currency, at any location selected by a user, if the resultant transactions have only one unique local currency, then customers want to have the capability to see results in either USD or corresponding local currency.
C. Ability to have a personalized view and preferences based on various user groups
- Will have 4-5 different levels of roles, it would be great if user/user group will have a little different look and feel based on their role and also need to show persona based details
Important:
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance.
- Focus on User Experience / how the user interacts within the dashboard.
Reference
Example dashboards design reference for your considerations:
- https://community.powerbi.com/t5/Data-Stories-Gallery/bd-p/DataStoriesGallery
- https://docs.microsoft.com/en-us/power-bi/service-dashboard-create
- https://id.pinterest.com/steffuhnee/power-bi-dashboards/?lp=true
- https://dribbble.com/powerbidesign
MarvelApp Prototype
- We need you to upload your screens to the Marvel App
- Please send your Marvel app request to csystic@gmail.com (Challenge Copilot)
- You MUST include your Marvel app URL in notes /comments while uploading (in your marvel app prototype, click on share and then copy the link & share it within your notes while you upload).
Target Audience
- Sales Force/Sales Reps and Management of the Organization
Judging Criteria
- How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Overall design, UI and user experience.
- Consistency across the UX/UI
Submission & Source Files
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
- Submit JPG/PNG for your submission files
- Submit Marvelapp as part of your submission.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop, Illustrator, XD, or Sketch!
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.