Challenge Summary
Welcome to the "UNAIDS - GARPR Dashboard Design Refinement Challenge". This is a follow-up challenge to the recently completed GARPR Dashboard Design Concepts Challenge now we are looking for your help to refine and define the look and feel of the graph styles for each of the core GARPR topics/indicators as well as rounding out the design of the various dashboard screens.In this challenge, we are providing the winning design source from the previous challenge as your design base. Make sure to update the provided source and keep things clean, consistent and focus on a great overall UX.
The Global AIDS Response Progress Reporting (GARPR) system is the main global online tool for country reporting of data about the AIDS response. It is used by all countries worldwide to report their data on the AIDS response. The current GARPR system is comprehensive but does not have the ability to present information and data in a very meaningful way. This project is focused on designing a new “dashboard experience” that will support viewing of AIDS response data, allow analysis and visualization of key information, and ideally reduce data entry errors and data entry effort of data clerks.
Bonus!! As part of Topcoder's "Crowd for Good" initiative, we will be awarding a new Topcoder Community Badge. If you submit a design to this challenge, you will also be awarded the "Crowd for Good" badge as part of your Topcoder profile.
Submit your initial design for a checkpoint feedback:
- See Round 1 Folder reference images
1. Home Page view of the Dashboard including the new / updated topics and indicators.
2. The page with all topics expanded (so we can assess how the graphs are going to look)
3. What is the process of annotating the charts and providing narrative comments? Should we, e.g. have a narrative option for each chart, which then automatically pulls together from each chart for the whole topic, or will that be too much, and we should have one box for narrative explanation per topic?
4. A process of exporting/sharing the updates by topic. We do not want to re-create Powerpoint or G-Slides, but want to detail how they can export for a presentation:
The user can export by topic, a set of topics or all topics. The users can also choose to export the related graph. Is there a way to make it simple to choose which graphs to export?
- As part of your checkpoint submission, you must upload your submission to InVisionApp so we can provide direct feedback on your designs.
- Make sure to include a URL/Link to your design within your "notes.txt".
- If you need an Invision Project, please request one from adroc@topcoder.com
Final design plus checkpoint feedback:
1. Home Page view including the new / updated topics and indicators.
2. Indicator / Topic Visualization Detail Page:
- All topics expanded
- One or two topics expanded, the others collapsed
3. Settings / My Profile Page
4. Publication Pages:
- Demonstrate how rapporteurs will extract the information for slide decks and presentations
5. Narrative Explanation Page
- As part of your final submission, you must upload your submission to InVisionApp so we can provide direct feedback on your designs.
- Make sure to include a URL/Link to your design within your "notes.txt".
- If you need an Invision Project, please request one from adroc@topcoder.com
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
Challenge Details
The goal of this challenge is to refine the visual design concepts from the UNAIDS GARPR Visual Dashboard challenge recently completed. The overall vision we are looking to create is the "Online Tax Preparation Software" equivalent for HIV monitoring & evaluation - to make the process of data entry and visualization easy, fun and productive.
The Global AIDS Response Progress Reporting (GARPR) system is the core, global online tool for country reporting of data about the AIDS response.
This challenge is a refinement step - we have our initial base design and need to continue updating and refining the user experience and how the dashboard would work and visualize data.
The Design Problem:
In the first challenge, the winning designer successfully created a dashboard design experience that resonated with us. We now want you to continue pushing this design forward, think about the UI details relating to the user interactions and visual cues. We want you to think about how topics and indicators will be displayed and accessed by the rapporteurs.
The narrative of the data continues to be a key focus of the dashboard. In the end, we need to ensure we are capturing the necessary details of the dashboard experience in order to build the dashboard application.
Overall requirements, beyond what was in the first challenge:
1) The country in question must be clearly indicated on every screen
2) Some, but not all, countries will have sub-national information and sub-national charts (e.g. data and charts for provinces / states / counties).
- This option needs to be shown for the countries where that is the case.
- It needs to be clear which country & sub-national area is being shown in such cases.
3) The navigation between screens and the titles of the screens needs to be very clear for the user, so s/he knows how to get around easily
4) For each topic, there will be 3-6 charts. Even though new data is entered as of February, some of the charts will not be available between February and June (because that is when the estimates of e.g. people living with HIV are produced -- that means that charts requiring e.g. PLHIV as a denominator can not be shown until that new data is modeled & available). There needs to be a placeholder chart graphic for the ones not available before June (similar to the placeholder photo icon on social media when you haven’t uploaded a photo yet) -- indicating the chart’s title & saying that this chart will be available in June.
5) National rapporteurs should have the option to annotate a chart for their report and provide a narrative description for each chart, as well as the overall narrative description.
6) The exported report in PDF needs to look excellent, be easy to read, and must also follow the UNAIDS branding guidelines.
7) For exported slides, we are open to exported slide decks or the ability to screen capture individual (annotated) images and/or topics, which might be more flexible and easier/less expensive to implement.
8) The UNAIDS branding guidelines must be followed; the updated guidelines are here: http://www.unaids.org/en/brandbuilder For the colours, you can use either of the two palettes (Global or Ocean). Only colours in the chosen palette should be used (don't cross over and use colours from both), using the primary colours first, cascading down to the secondary and then tertiary colours.
9) Mobile view - there should be a mobile design for National Rapporteurs to be able to see the data (not annotate it or provide the narratives) from their phone or tablet.
List of core topics, preferred graphic representation and example data
Please see the document "Dashboards_GAM_2.docx"
Application Screens
This challenge is focused on refining and finishing the application design. Make sure to capture the new items listed, brand updates, and review the screens below for any additional or missing items.
Home Page (Desktop + Phone)
- Default view of the twelve (12) topics
- Update details based on the indicators/topics
- Links to My Account / Settings
- Ability to detail each insight / topic
Indicator / Topic Details Page (Desktop + Phone)
- Details of the relevant indicator / topic
- The ability to expand and collapse all the topics (or single topics)
- Includes the graphs for that topic according to what is defined in Dashboards_GAM_2.docx
- Explanatory narrative and publish options as well as other substantive data points are encouraged in this view.
Narrative Explanation Page
- Narrative input & management by indicator / topic and chart.
- Ability to annotate the charts (see examples)
- Publish view & settings.
- Could support links to supporting narrative documentation, research, substantive data points, reports, etc.
Publish Results Page (Desktop + Phone)
- Publish report results main page.
- Ability to publish the entire report, selected indicators/topics or specific topics.
- These reports will be publicly available on the UNAIDS website. Rapporteurs will want to see the “real” info in their dashboard but have a version that is OK for public consumption in the reports. For example, a warning could show up if no data is available on punitive laws in the dashboard, but a simple “no data available” might be less onerous to show on a public report.
- Format choices and links to google, Microsoft, Pages and other relevant publishing applications. Be creative here. Helping the rapporteurs communicate the story of each indicator/topic is critical to the success of the dashboard
Offline Home Page
- How will the dashboard perform where internet connections are weak or absent?
- What functionality can be utilized in a connectivity situations?
- A reduced subset of features and functionality should be assumed - show how the dashboard would look and perform with weak or absent internet connections.
Offline Indicator / Topics Details Page
- Similar to home page view in weak or absent internet connection mode.
- How will the functionality of the indicator/topics detail page be handled with weak or absent internet connections?
- Be creative, access to the data and visualizations in these situations are crucial.
My Account / Settings Page (Desktop + Phone)
- Account profile manage with link to GARPR SSO assumptions.
- Additional settings and features.
- National rapporteurs resume page, links to social channels and networks, etc…
Important:
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
- Focus on the user experience! Focus on the navigation experience. Keeping consistent visual elements.
Screen Sizes:
- Responsive design
- Desktop Size: 1280px width and height as required.- The dashboards will need to run on a desktop and mobile (phone)
- Make sure you create graphic in 'shape' format, so when we resize graphics everything will still look sharp!
Branding/Colors
- See the UNAIDS branding guidelines.
- Work to continue improving the provided base design.
Supporting Documents:
- Please see attached challenge source files and data references
Target Audience:
National rapporteurs and personas described in User Experience Requirements in the Annex 2 section.
Judging Criteria:
- How well you update and include the new details within the user experience.
- 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 Desktop PNG/JPG Screens. PSD source files
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
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.
The Global AIDS Response Progress Reporting (GARPR) system is the main global online tool for country reporting of data about the AIDS response. It is used by all countries worldwide to report their data on the AIDS response. The current GARPR system is comprehensive but does not have the ability to present information and data in a very meaningful way. This project is focused on designing a new “dashboard experience” that will support viewing of AIDS response data, allow analysis and visualization of key information, and ideally reduce data entry errors and data entry effort of data clerks.
Bonus!! As part of Topcoder's "Crowd for Good" initiative, we will be awarding a new Topcoder Community Badge. If you submit a design to this challenge, you will also be awarded the "Crowd for Good" badge as part of your Topcoder profile.
Round 1
Round One (1)Submit your initial design for a checkpoint feedback:
- See Round 1 Folder reference images
1. Home Page view of the Dashboard including the new / updated topics and indicators.
2. The page with all topics expanded (so we can assess how the graphs are going to look)
3. What is the process of annotating the charts and providing narrative comments? Should we, e.g. have a narrative option for each chart, which then automatically pulls together from each chart for the whole topic, or will that be too much, and we should have one box for narrative explanation per topic?
4. A process of exporting/sharing the updates by topic. We do not want to re-create Powerpoint or G-Slides, but want to detail how they can export for a presentation:
The user can export by topic, a set of topics or all topics. The users can also choose to export the related graph. Is there a way to make it simple to choose which graphs to export?
- As part of your checkpoint submission, you must upload your submission to InVisionApp so we can provide direct feedback on your designs.
- Make sure to include a URL/Link to your design within your "notes.txt".
- If you need an Invision Project, please request one from adroc@topcoder.com
Round 2
Round Two (2)Final design plus checkpoint feedback:
1. Home Page view including the new / updated topics and indicators.
2. Indicator / Topic Visualization Detail Page:
- All topics expanded
- One or two topics expanded, the others collapsed
3. Settings / My Profile Page
4. Publication Pages:
- Demonstrate how rapporteurs will extract the information for slide decks and presentations
5. Narrative Explanation Page
- As part of your final submission, you must upload your submission to InVisionApp so we can provide direct feedback on your designs.
- Make sure to include a URL/Link to your design within your "notes.txt".
- If you need an Invision Project, please request one from adroc@topcoder.com
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
Challenge Details
The goal of this challenge is to refine the visual design concepts from the UNAIDS GARPR Visual Dashboard challenge recently completed. The overall vision we are looking to create is the "Online Tax Preparation Software" equivalent for HIV monitoring & evaluation - to make the process of data entry and visualization easy, fun and productive.
The Global AIDS Response Progress Reporting (GARPR) system is the core, global online tool for country reporting of data about the AIDS response.
This challenge is a refinement step - we have our initial base design and need to continue updating and refining the user experience and how the dashboard would work and visualize data.
The Design Problem:
In the first challenge, the winning designer successfully created a dashboard design experience that resonated with us. We now want you to continue pushing this design forward, think about the UI details relating to the user interactions and visual cues. We want you to think about how topics and indicators will be displayed and accessed by the rapporteurs.
The narrative of the data continues to be a key focus of the dashboard. In the end, we need to ensure we are capturing the necessary details of the dashboard experience in order to build the dashboard application.
Overall requirements, beyond what was in the first challenge:
1) The country in question must be clearly indicated on every screen
2) Some, but not all, countries will have sub-national information and sub-national charts (e.g. data and charts for provinces / states / counties).
- This option needs to be shown for the countries where that is the case.
- It needs to be clear which country & sub-national area is being shown in such cases.
3) The navigation between screens and the titles of the screens needs to be very clear for the user, so s/he knows how to get around easily
4) For each topic, there will be 3-6 charts. Even though new data is entered as of February, some of the charts will not be available between February and June (because that is when the estimates of e.g. people living with HIV are produced -- that means that charts requiring e.g. PLHIV as a denominator can not be shown until that new data is modeled & available). There needs to be a placeholder chart graphic for the ones not available before June (similar to the placeholder photo icon on social media when you haven’t uploaded a photo yet) -- indicating the chart’s title & saying that this chart will be available in June.
5) National rapporteurs should have the option to annotate a chart for their report and provide a narrative description for each chart, as well as the overall narrative description.
6) The exported report in PDF needs to look excellent, be easy to read, and must also follow the UNAIDS branding guidelines.
7) For exported slides, we are open to exported slide decks or the ability to screen capture individual (annotated) images and/or topics, which might be more flexible and easier/less expensive to implement.
8) The UNAIDS branding guidelines must be followed; the updated guidelines are here: http://www.unaids.org/en/brandbuilder For the colours, you can use either of the two palettes (Global or Ocean). Only colours in the chosen palette should be used (don't cross over and use colours from both), using the primary colours first, cascading down to the secondary and then tertiary colours.
9) Mobile view - there should be a mobile design for National Rapporteurs to be able to see the data (not annotate it or provide the narratives) from their phone or tablet.
List of core topics, preferred graphic representation and example data
Please see the document "Dashboards_GAM_2.docx"
Application Screens
This challenge is focused on refining and finishing the application design. Make sure to capture the new items listed, brand updates, and review the screens below for any additional or missing items.
Home Page (Desktop + Phone)
- Default view of the twelve (12) topics
- Update details based on the indicators/topics
- Links to My Account / Settings
- Ability to detail each insight / topic
Indicator / Topic Details Page (Desktop + Phone)
- Details of the relevant indicator / topic
- The ability to expand and collapse all the topics (or single topics)
- Includes the graphs for that topic according to what is defined in Dashboards_GAM_2.docx
- Explanatory narrative and publish options as well as other substantive data points are encouraged in this view.
Narrative Explanation Page
- Narrative input & management by indicator / topic and chart.
- Ability to annotate the charts (see examples)
- Publish view & settings.
- Could support links to supporting narrative documentation, research, substantive data points, reports, etc.
Publish Results Page (Desktop + Phone)
- Publish report results main page.
- Ability to publish the entire report, selected indicators/topics or specific topics.
- These reports will be publicly available on the UNAIDS website. Rapporteurs will want to see the “real” info in their dashboard but have a version that is OK for public consumption in the reports. For example, a warning could show up if no data is available on punitive laws in the dashboard, but a simple “no data available” might be less onerous to show on a public report.
- Format choices and links to google, Microsoft, Pages and other relevant publishing applications. Be creative here. Helping the rapporteurs communicate the story of each indicator/topic is critical to the success of the dashboard
Offline Home Page
- How will the dashboard perform where internet connections are weak or absent?
- What functionality can be utilized in a connectivity situations?
- A reduced subset of features and functionality should be assumed - show how the dashboard would look and perform with weak or absent internet connections.
Offline Indicator / Topics Details Page
- Similar to home page view in weak or absent internet connection mode.
- How will the functionality of the indicator/topics detail page be handled with weak or absent internet connections?
- Be creative, access to the data and visualizations in these situations are crucial.
My Account / Settings Page (Desktop + Phone)
- Account profile manage with link to GARPR SSO assumptions.
- Additional settings and features.
- National rapporteurs resume page, links to social channels and networks, etc…
Important:
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
- Focus on the user experience! Focus on the navigation experience. Keeping consistent visual elements.
Screen Sizes:
- Responsive design
- Desktop Size: 1280px width and height as required.- The dashboards will need to run on a desktop and mobile (phone)
- Make sure you create graphic in 'shape' format, so when we resize graphics everything will still look sharp!
Branding/Colors
- See the UNAIDS branding guidelines.
- Work to continue improving the provided base design.
Supporting Documents:
- Please see attached challenge source files and data references
Target Audience:
National rapporteurs and personas described in User Experience Requirements in the Annex 2 section.
Judging Criteria:
- How well you update and include the new details within the user experience.
- 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 Desktop PNG/JPG Screens. PSD source files
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
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.