BONUS: 5‌ CHECKPOINTS AWARDED WORTH ‌$150‌ EACH

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to the Taipei - Customer Dashboard Responsive Design Concepts Challenge. In this challenge, we are looking for your initial design concepts that will help us visualize screens needed for a new Tablet and Mobile application.

This application will be used by our sales team to monitor real-time customer and owned product information. The focus of this challenge is on design concepts for an application that would assist our sales team in getting a full view of the customer’s recent interactions with our company, hot topics, key performance indicators/statistics as we prepare to visit or call a customer. Mobile and Tablet designs are the key focus for this design challenge, they will be the primary way this application is used.

Round 1

Submit your initial designs for Checkpoint Feedback. 
1. (360 Degree) Customer Dashboard (Tablet View)
2. (360 Degree) Customer Dashboard (Mobile View)
NOTE: The submitted designs will be shown in a presentation during the checkpoint review.
- Please keep this in mind as you plan your submission.
- Please include your design in an ipad and iphone mockup for the checkpoint presentation.

Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)

Round 2

Your Final designs for all the required designs with all Checkpoint Feedback implemented.
1. (360 Degree) Customer Dashboard (Tablet View) Final Design
2. (360 Degree) Customer Dashboard (Mobile View) Final Design
- Include your design in an ipad and iphone mockup for your final presentation

Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)


Challenge Details:
The Purpose of this challenge is to concept the initial design direction for a Mobile (and Tablet) application that will deliver real-time insights in a graphical way that helps us track how our customers use our products. The application will show their interaction points with us such as:
-  Customer service requests (called Cases)
-  Entitlements (systems they own)
-  Purchase history
-  Future sales opportunites we are pursuing.

We are looking for the Topcoder Design Community to help us with planning our new "user experience" (UX) and how to best visually and graphically make this data quickly viewable to our end users.

This application will be a custom Salesforce application (Salesforce is used to manage and supply the data) with a modern and intuitive user interface (what we need you to think about and design!)

About the Client: 
We sell large complex servers used in data centers. Each one is highly configurable and each item’s average cost could be $20,000. It’s common for large customers to have hundreds of our items.  Each item can be highly customized with various components. We spend a lot of time with our customers servicing the products they have purchased.  We have warranties and sell service contracts and offer white glove 24-hour service for our customers that use our systems for critical parts of their business.

Design Considerations:
- Looking to showcase responsive design between Mobile and Tablet.
- Looking for charts and graphical representation of data where appropriate
Populate the charts and tables with sample data that’s relevant to our company and that tells a story about a hypothetical customer’s past experiences and future opportunity with us. (see attachment)

- We are looking for modern, intuitive user interface
- Focus on the design being a great user experience - keep it simple.
- Give importance to the overall layout and think on how a user would interact with the content on the page.
- What should the priority features be?
- How quickly could you find information?
- Stock Photos: Feel free to use any images related to this concept

Design Size:
We are looking to create mobile responsive designs:
- Tablet: 1024 x 768px (iPad)
- Mobile: 320 x 480px (iPhone)

User Scenario:
Peter, a sales representative is looking to check to see the activities pertaining to accounts under him, see the list of activities done by each of his customers. He is also looking to see if they have the latest and correct products on display, make sure the appliances are displayed correctly and to also find out where his customers are displaying and selling the products within their stores. 

Peter is able to open his application and locate his customer account.
- Peter see's his Sales Dashboard that shows him daily sales alerts, current messages, tasks, and customers that are near him (geolocation)
- Peter is able to view a full "360 degree" (i.e. everything they are doing) customer view of their activity and profile. Where appropriate, the
- He is able to view list of escalation messages, tasks, opportunities, and orders from a customer.
- Peter sees a list of recent products sold by this customer (inventory) which includes other statistics like “the quantity sold by them, etc.. 
- Peter is able to capture notes, photos and details about a customer and about their store location
- Peter is able to quickly generate reports and email them.
- Peter can view, create tasks and assign it to the person responsible..

Screens:
We are looking for the below page to be designed/considered in your concepts. Feel free to provide any additional supporting pages or views of the dashboard as you see fit to properly convey your design's concept and details:

1. (360 Degree) Customer Dashboard: (Tablet and Phone Views)
We would like you to design your concepts on what needs to be on the Customer Dashboard.
- Dashboard will only show data based on currently selected Account. 
- Account could a particular organization or a customer under this sales representative!

Customer: User should be able to see all information about a customer:
-- (make sure to include data.com DNB info - this is just an additional information under a customer)
-- C
ases
-- Opportunities
-- Tasks
-- Assets
-- Orders 

Charts: Looking for Graphical Charts such as:
-- Number of Open Cases
-- Number of Closed Cases
-- Total Amount of Closed Won Opportunities
-- Total Amount of Open Opportunities. (content sample available in excel file)


- Map: It would be good to allow the user to view customers near him on a map. Feel free to expand your ideas!
- Records: Allow for records to be sortable based on displayed fields
- Reports: They should be able to generate a report and share it with others through email.
- Chatter: User should be able to see chatter feed (think on what would give the best experience - consider a placement that does not hinder the main dashboard view)
- Search: Provide a search feature for any related items on the Customer record and allow them to be selected in search view..
- 360 View: Salesperson should have a 360 degree view of their customers: by listing all activities their customers had done, any issues escalated by them and also it would be good to indicate the key issues that requires their attention for the day

Sample Data:
- Please review the attached spreadsheet and all tabs for sample data. (Also here, as a google sheet.)
- Use this data in corresponding areas of the dashboard
- Feel free to add data to improve chart/data table or help convey an idea/visualization

Ideas for specific charts:
These are just to help you get started - be creative and think of better ways to design and represent data!
-- 
Assets: Pie chart (see spreadsheet for data, breakdown by Asset and Quantity)
-- 
Opportunities: Pie chart (see spreadsheet for data, breakdown by Stage and Value)
--
 Orders: Pie chart/Bar chart (see spreadsheet for data, breakdown by Fiscal Quarter and Value)
-- 
Others: Think of other visualization techniques and ideas such as charts, timeseries, map/geospacial or filtering. The dashboard data should allow for easy high level analysis of KPIs and ability to drilldown quickly on data that stands out. 

Target Audience:
- Sales Representative who needs to use this application to help him in his day-to-day sales activities

Judging Criteria:
- How well you plan the user experience and capture your ideas visually and data graphically
- Cleanliness of your graphics and design
- Your design should be possible to build and make sense as a mobile application AND a tablet application. We need to see both resolutions!

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
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.

How To Submit

  • New to Studio? ‌Learn how to compete here
  • Upload your submission in three parts (Learn more here). Your design should be finalized and should contain only a single design concept (do not include multiple designs in a single submission).
  • If your submission wins, your source files must be correct and “Final Fixes” (if applicable) must be completed before payment can be released.
  • You may submit as many times as you'd like during the submission phase, but only the number of files listed above in the Submission Limit that you rank the highest will be considered. You can change the order of your submissions at any time during the submission phase. If you make revisions to your design, please delete submissions you are replacing.

Winner Selection

Submissions are viewable to the client as they are entered into the challenge. Winners are selected by the client and are chosen solely at the client's discretion.

ELIGIBLE EVENTS:

2015 topcoder Open

Challenge links

Screening Scorecard

Submission format

Your Design Files:

  1. Look for instructions in this challenge regarding what files to provide.
  2. Place your submission files into a "Submission.zip" file.
  3. Place all of your source files into a "Source.zip" file.
  4. Declare your fonts, stock photos, and icons in a "Declaration.txt" file.
  5. Create a JPG preview file.
  6. Place the 4 files you just created into a single zip file. This will be what you upload.

Trouble formatting your submission or want to learn more? ‌Read the FAQ.

Fonts, Stock Photos, and Icons:

All fonts, stock photos, and icons within your design must be declared when you submit. DO NOT include any 3rd party files in your submission or source files. Read about the policy.

Screening:

All submissions are screened for eligibility before the challenge holder picks winners. Don't let your hard work go to waste. Learn more about how to  pass screening.

Challenge links

Questions? ‌Ask in the Challenge Discussion Forums.

Source files

  • Layered PSD files created in Adobe Photoshop or similar
  • AI files created in Adobe Illustrator or similar

You must include all source files with your submission.

Submission limit

5 submissions

ID: 30048333