Challenge Summary
Welcome to the Topcoder - Project Activity World Map Design Concept Challenge!
In this challenge we want to represent the dynamics of a project over time In Topcoder Connect, starting from design to development, data science and bug hunt, so a client can see how his project is progressing.
Note: When this challenge ends, all designs will be visible so you can learn from it.
Read the challenge specification carefully and watch the challenge forums for any questions or feedback concerning this challenge. Feel free to ask any questions in the challenge forum!
Submit your initial design for a Checkpoint Feedback
1. Project Activity
- As part of your checkpoint submission, you must upload your submission to Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Submit your Final Design plus Checkpoint Updates
1. Project Activity
- As part of your Final submission, you must replace your checkpoint submission with the final submission into Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
In this challenge we want to represent the dynamics of a project over time In Topcoder Connect, starting from design to development, data science and bug hunt, so a client can see how his project is progressing.
Note: When this challenge ends, all designs will be visible so you can learn from it.
Read the challenge specification carefully and watch the challenge forums for any questions or feedback concerning this challenge. Feel free to ask any questions in the challenge forum!
Round 1
Round 1Submit your initial design for a Checkpoint Feedback
1. Project Activity
- As part of your checkpoint submission, you must upload your submission to Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Round 2
Round 2Submit your Final Design plus Checkpoint Updates
1. Project Activity
- As part of your Final submission, you must replace your checkpoint submission with the final submission into Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Challenge Format
Round 1
Submit your initial design for a Checkpoint Feedback
1. Project Activity
Round 2
Submit your initial design for a Checkpoint Feedback plus Checkpoint Updates
1. Project Activity
- As part of your checkpoint submission, you must upload your submission to Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Design Problem
Round 1
Submit your initial design for a Checkpoint Feedback
1. Project Activity
Round 2
Submit your initial design for a Checkpoint Feedback plus Checkpoint Updates
1. Project Activity
- As part of your checkpoint submission, you must upload your submission to Marvel App so we can provide direct feedback on your designs. Please include the Marvel App URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Design Problem
Topcoder Connect is the platform where customers come and drop their requirements about projects and they get in contact with PMs and copilots who will then manage these projects for them. A project can be the development of a website for example and it needs to go through a couple of phases like: design, development, bug hunt/ quality assurance (QA) and/or data science. In Connect, we don’t talk to customers about challenges, as we refer to them as phases with a timeline to tell them when we need their input (for example review designs at checkpoint). The phase can be 1, 2 or more challenges - multiple activity. The phases usually go one after the other, so only 1 type of work usually is active - design, development, QA, etc.
We have started concept exploration on the QA project reporting dashboard (FAST Topcoder Bug Hunt Dashboard Design Challenge) and we have the winning designs from that first challenge (check attached files), which represents well what the Topcoder project report dashboard could look like. Now we want to continue the conceptual exploration into the project activity over time, and its representation from several important angles on a completely new page.
Goals of this challenge:
1. Explore project progress visualizations over time (project beginning, middle, end), focusing on certain activity. We want to represent the diversity and complexity of a software project over time, considering the phases it’s going through. The goal is to present truthful data and also “wow” the customer.
o Submissions from geographic locations. We want to present how the community is active from different geographic locations using a world map.
o Separate pieces coming together as a whole (represent how many different pieces in the project there are and how many submissions were needed to build the project). For example a design phase will have multiple designs created, and presented to the customer. From their point of view we will have several pieces created for the phase.
For development, multiple people will work to create pieces of the software - you can have 10-12 people collaborating to build the source code. This could be a series of challenges during a development phase.
At a project level, you are concerned to display the whole solution progress (design, development, data science, QA, etc.) and not a single challenge. It usually takes a lot of different challenges, and if you count tasks and bugs testing, that's a lot of people working on your project. That's what we want to display - how the project comes to be completed as a whole, not a singular challenge.
o Dynamics of project over time.
2. How can we build a better story of what is currently going on at the project activity, given the fact that we do not track the Topcoder member time/currently working on a problem, but have a bursts of submissions towards the end of the challenge deadline? Think of a way we can represent data in a continuous stream based on very separate events. We’re looking for your very creative ideas here. We're completely open to any ideas of what events types might help to better build a presentation of progress - copilot activity, platform activity, challenge visits, prediction of submissions, code being in review, github submission, who might be working on this, customer activity, storage, - please invent and throw any ideas that you might have. Right now if we build activity stream, it'll be only during registration, and submissions. You'll cluster events with gaps in-between, and we want to fill the gaps with something.
Please continue your explorations based on our 1st place winner submission of the Topcoder Bug Hunt Dashboard Challenge. Dive deeper into the map interface with time stages.
For this challenge, is important you follow the Topcoder Connect GUI KIT and you have to work in Sketch to be able to reuse the components from there. This page, will stay in Connect so we want to keep consistency across all Connect pages.
References
1. Designs from previous challenge - FAST Topcoder Bug Hunt Dashboard Design Challenge (submissions and source) - use it to get as a starting point for the map activity and look at the style that is used there.
2. Topcoder World Map(attached): this is another concept for the world-wide activity, please do not use the stylistics from the sample images, they just come to illustrate a layout/functionality.
3. Marathon Match Old World Map: https://worldmap-dash.herokuapp.com/geography.html this was designed some time ago, use it just to look at functionality
4. Basic visual representation of members activity: https://topcoderinc.github.io/Corona2/
Branding
- Colors: is mandatory you follow the exact Topcoder colors from the GUI KIT
- Fonts: use Roboto font as that is the standard font we are using for the new Topcoder site and have the text only in the TC colors (shades of gray).
- Icons: you are free to use stock icons but only from Nucleo.
- Buttons: check the attached html specifications to see the colors and padding you should use for them
- Important: keep all distances as multiple of 5px
If there is something else you need or have questions, ask the in the forum.
Input
- TC GUI KIT to follow
- Referenced files mentioned above
- Connect Projects Designs – just to give you an idea of the look and feel of Connect (you can re-use the header bar and footer)
- Other Connect Designs (to get used with Topcoder Connect style)
Stock Artwork & Icons
- Stock photos are allowed for this challenge
- Make sure to declare all your assets properly or you might fail screening
Target Devices
Responsive web:
- Desktop: 1280px width with height adjusted accordingly
Marvel Prototype
- Request a Marvel Prototype on forums or email keyla.blue1@gmail.com
- Provide clickable spots (hotzones) to link your screens and show the interactivity.
- We need you to upload your screens to Marvel App.
- You MUST include your Marvel App URL on your notes during submission upload (in your Marvel App prototype, click on share and then copy that link)
Target Audience
- Topcoder Customers
- Topcoder Admins
- Topcoder Project Managers
- Topcoder Copilots
Judging Criteria
- How easy is to read the project activity over time?
- Can I get a good understanding of what’s going on at quick glimpse?
- Is the design consistent and follows the Topcoder UI KIT?
- Hierarchy and organization of content
- Overall design aesthetics
Submission Deliverables
Preview Image
Please create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place your submissions within it. You are free to resize or crop your submission to fit this size, but do not add any filters or elements for dramatic effect, such as drop shadows or reflections.
Submission File
All requested Contest Deliverables in JPG or PNG file format in RGB color mode at 72dpi.
Source Files
All original source files of the submitted design. Files should be created in Sketch. Layers should be named and well organized.
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.