Challenge Summary
Welcome to the Topcoder Responsive Community Activity Visualizer - Design Concepts Challenge! In this challenge we are looking for design concepts that visualize all of the activity that happens on Topcoder.com around the world. Activity is referring to challenge activity and includes anything from showing challenges in real-time, what country members are participating from, what stage challenges are in, number of submissions, etc. We are looking for really slick, real-time visualizations to showcase all of the challenge data that Topcoder currently has.
- Desktop
- Mobile
Any additional interaction notes, hover effects, "views", etc. should also be included. We want to have a good idea of how the visualization will be interactive
- Desktop
- Tablet
- Mobile
Any additional interaction notes, hover effects, "views", etc. should also be included. We want to have a good idea of how the visualization will be interactive
We are looking for a responsive challenge visualization that works across desktop, tablet, and mobile. The visualization will be used as a showcase on topcoder.com BUT also be used in sales, marketing, trade show environments, etc. So it needs to be a standalone piece of design; all controls, filters, views, etc. should be contained within one area. We are NOT designing a website. Imagine this visualization being inserted as the hero area of an existing topcoder.com page.
The big thing with the visualization is that it should feel like a real-time data visualization. It should be constantly updating with new data, metrics, etc. It should be visually engaging, something that you want to sit and watch as it updates.
This visualization should work just as well as a header of a webpage, on a large touch screen monitor, or on a mobile device.
Functionality Suggestions and Ideas:
We currently have a few key data area that we can pull metrics and activity from. We are looking for cool, interesting, and engaging ways to visualize this data. Data areas include:
- Forum/ Discussion Posts (we wouldn't want to show actual posts. This could be tied to activity on a map/ globe)
- New Project via Connect
- Work Submission: A member has submitted to a challenge (wouldn't want to show the actual submission, but could show as activity, were that member is located, who they are, etc)
- Challenge Launched
- Review Complete
- Challenge Registration: Number of registrants, where they are located, who they are (handle), etc.
- Member Data: Anything that is available on a members profile page (location, handle, what track they compete in [design, development, etc], how many challenges they've won, reliability rating, etc.
There are a few ways you could visualize the data. There could also be multiple "views" of the visualization as well.
- Map View: Shows activity on a global scale. This could be members submitting, general location of members, where the most winners are located, just show designers or developers. NOTE: any map views should be using MapBox as a base
- Challenge View: Number of challenges currently running, what stage they are in. Projects accepted via Connect
- Activity View: Forum/ discussion posts (location of posts, member info, what challenge it belongs to), work submissions
- Member View: A view just dedicated to member information and data (could work in tandem with a Map View)
We are open to your unique ideas and concepts. These are just some ideas to get you thinking. Creativity and overall visual execution is what we are looking for
Branding:
Your designs should match the current topcoder.com style, colors, and fonts. Use the current site for reference. I great place to look for where topcoder.com is heading is the blog (https://www.topcoder.com/blog) and the new global maga menu. These are the types of interactions and visual directions we want to take topcoder and this Activity Visualizaton
Screen Dimension:
We are designing a responsive landing page, that works across desktop, tablet, and mobile
- Desktop: 1024px wide (height can expand with content)
- Tablet: 768px wide (height can expand with content)
- Mobile: 320px wide (height can expand with content)
Target Audience:
Topcoder customers, site visitors, general public, members
Judging Criteria:
Your submission will be judged on the following criteria:
- Cleanliness of screen design and user flow
- Overall design and user experience
- Simplicity of design/strong, clear design concept
- How well your designs align with the objectives of the challenge
- Overall unique idea and concept
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.
Source Files
Please provide all original source files of the submitted design. Files should be created in Adobe Photoshop (layered PSD file) or Adobe Illustrator (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.
Round 1
Activity Visualization concepts for:- Desktop
- Mobile
Any additional interaction notes, hover effects, "views", etc. should also be included. We want to have a good idea of how the visualization will be interactive
Round 2
Activity Visualization conceptson AND checkpoint feedback for:- Desktop
- Tablet
- Mobile
Any additional interaction notes, hover effects, "views", etc. should also be included. We want to have a good idea of how the visualization will be interactive
We are looking for a responsive challenge visualization that works across desktop, tablet, and mobile. The visualization will be used as a showcase on topcoder.com BUT also be used in sales, marketing, trade show environments, etc. So it needs to be a standalone piece of design; all controls, filters, views, etc. should be contained within one area. We are NOT designing a website. Imagine this visualization being inserted as the hero area of an existing topcoder.com page.
The big thing with the visualization is that it should feel like a real-time data visualization. It should be constantly updating with new data, metrics, etc. It should be visually engaging, something that you want to sit and watch as it updates.
This visualization should work just as well as a header of a webpage, on a large touch screen monitor, or on a mobile device.
Functionality Suggestions and Ideas:
We currently have a few key data area that we can pull metrics and activity from. We are looking for cool, interesting, and engaging ways to visualize this data. Data areas include:
- Forum/ Discussion Posts (we wouldn't want to show actual posts. This could be tied to activity on a map/ globe)
- New Project via Connect
- Work Submission: A member has submitted to a challenge (wouldn't want to show the actual submission, but could show as activity, were that member is located, who they are, etc)
- Challenge Launched
- Review Complete
- Challenge Registration: Number of registrants, where they are located, who they are (handle), etc.
- Member Data: Anything that is available on a members profile page (location, handle, what track they compete in [design, development, etc], how many challenges they've won, reliability rating, etc.
There are a few ways you could visualize the data. There could also be multiple "views" of the visualization as well.
- Map View: Shows activity on a global scale. This could be members submitting, general location of members, where the most winners are located, just show designers or developers. NOTE: any map views should be using MapBox as a base
- Challenge View: Number of challenges currently running, what stage they are in. Projects accepted via Connect
- Activity View: Forum/ discussion posts (location of posts, member info, what challenge it belongs to), work submissions
- Member View: A view just dedicated to member information and data (could work in tandem with a Map View)
We are open to your unique ideas and concepts. These are just some ideas to get you thinking. Creativity and overall visual execution is what we are looking for
Branding:
Your designs should match the current topcoder.com style, colors, and fonts. Use the current site for reference. I great place to look for where topcoder.com is heading is the blog (https://www.topcoder.com/blog) and the new global maga menu. These are the types of interactions and visual directions we want to take topcoder and this Activity Visualizaton
Screen Dimension:
We are designing a responsive landing page, that works across desktop, tablet, and mobile
- Desktop: 1024px wide (height can expand with content)
- Tablet: 768px wide (height can expand with content)
- Mobile: 320px wide (height can expand with content)
Target Audience:
Topcoder customers, site visitors, general public, members
Judging Criteria:
Your submission will be judged on the following criteria:
- Cleanliness of screen design and user flow
- Overall design and user experience
- Simplicity of design/strong, clear design concept
- How well your designs align with the objectives of the challenge
- Overall unique idea and concept
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.
Source Files
Please provide all original source files of the submitted design. Files should be created in Adobe Photoshop (layered PSD file) or Adobe Illustrator (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.