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

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to Sunshot - Hot 4 Solar! Storyboard Design Challenge.
Hot 4 Solar! application purpose is to helping find potential customers who are most prepared to buy solar panels.

In this challenge we need you focussed on creating Hot 4 Solar! application screens and overall visualization to help sellers to able to see the areas where there is potential for solar panel sales.

We are looking for Design Concepts on what should the user see and experience when using the application! Read the design problem carefully and suggest the best solutions!

Good luck and we look forward to your design concepts!

Round 1

Submit your initial designs for Checkpoint Feedback
1). Home / Landing Page
2). Dashboard Map View
3). Dashboard List View

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). Home / Landing Page
2). Dashboard Map View
3). Dashboard List View
4). Accounts
5). Geographies
6). About Page

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)


The Purpose of this challenge is to come up with the the look & feel and flow for this web-based application. We are looking for the Topcoder Design Community to help us with planning our new "user experience" (UX).

Design Problem / Raison D'etre
You run a small business that installs solar panels on people’s homes. Today, one of your biggest challenges is the cost of acquiring new customers. It’s expensive and time consuming. Sometimes the cost of finding a customer who’s ready to buy, educating that customer or paying for a lead to that customer can cost between $1,000 and $2,000 for each new closed deal. You’ve got to prospect in many different neighborhoods and knock on a lot of doors. When you finally do contact a customer, they often need to be educated about solar for their homes. What do you do?

Hot 4 Solar is the tool for you. It’s a dashboard view of your area that’s built on a simple premise: People buy solar because their neighbors buy solar. Hot for solar collects the locations where people have already purchased solar installations (we either use lists of your deployments or collect them from public records) and then it provides you a view of geographies where solar is taking off. Additionally Hot 4 Solar and provides you with statistics of solar acquisitions and provides automated predictions of solar adoption by geography that help you decide where you will spend your time prospecting.

Solar acquisition is viral! Hot 4 Solar shows you which neighborhoods are “Hot for Solar.”

Design Ideas:
- We’re looking for modern, intuitive user interface application
- Focus on the design being a great user experience, think simple but effective solutions!
- Come up with design concepts that shows out-of-the-box solutions.
- Show all the screens and provide a user flow/click-path and navigation, so we can see how the interactions fit together in the application
- What should the priority features be?
- How quickly could user find information they need?
- Design Size:
-- Think about Desktop Responsive Fluid layout with minimum 980px width and height as required.
 -- Design should be effective for both desktop and tablet use
-- You can show your design on 1280px width.

Submission Requirements:
MVP:

In this first version, the product is very simple. We will be limiting the design to a single geography to build out the concept. We haven’t chosen that geography yet, but it’s likely to be a residential neighborhood in Connecticut.

1). Home / Landing Page:
- The user experience begins on our landing page.
- The landing page need presents the Hot 4 Solar message. The concept does not yet have a logo, iconography or style guide. Something here should present the value proposition.
- Big, open images, clean, simple layout.
- Links from the home page should include privacy policy, about and sign in.
- Signing in will take them directly to our dashboard page, which will show them one of two different views of their area: the Map View or the List View.

2). Dashboard Map View:
- The main dashboard shows the user a view of their chosen geography.
- It shows the locations of all known solar installations in that geography (each installation is represented as a dot on the map).
- Additionally, the dashboard shows key statistics to help users understand where solar is taking off and where it’s ice cold.
- Statistics on this page should be presented as graphs or charts off to the side or along the top.
- Statistics can appear and update as the user mouses over individual areas on the map.
- This view is a snapshot of where the action is in my state. The goal is to, at a glance, see which areas are taking off.

User Stories for Map View:
- As a user I want to easily see clusters of activity so I can decide where to spend my time prospecting
- As a user I want to easily see where activity is growing so that I can decide where sales cycles are likely to be shortest
- As a user I want to see predictions of where the next sales are likely to happen
- As a user I want to see predictions of where the next
- As a user I want to be able to distinguish between my installations and those done by other installers
- Extra credit: As a user I want to be able to mouse over individual installations to see statistics about that installation.

One More User Story for Map View:
- As a presenter I want to be able to see what the solar adoption was in different periods of time so that I can demonstrate how solar is being adopted over time (the idea is that each solar installation will have a deployment date. If I’ve got a slider that allows me to show the cumulative adoption at each date, I can demonstrate how we make our predictions for future installations). As I slide the control tool on the slider forward in time dots appear until we’re showing the total of all installations done to date.

3). Dashboard List View:
- The main dashboard can be toggled back and forth between the map view and a tabular statistics view.
- Same data displayed but in a format that allows for people to rank areas of interest.  Something like this data:

Area zip code: 94113
Installation count: 30
Cost / Watt: $5
$ Projection: $3.50
Hotness: Red Hot

Area zip code: 94131
Installation count: 26
Cost / Watt: $5
$ Projection: $3.62
Hotness: Red Hot

- The view is sortable by each column. You sort by hotness, jump in your car and head to zip code 94113 to start signing up customers.

User Stories for Dashboard List View:
- As a user I want to easily the hottest areas in my geography so that I can make decisions about where I want to spend my time
- As a user I’d like to be able to sort on every column so that I can see the same information presented in different ways.
- As a user I want to see some scoring of how hot a given area is (this should be intuitive and numeric. Scale of 1 through 5, for example).
- As a user I want to be able to extract the List View to a CSV file.

Important Statistics:
These are the things an installer is likely to care about as they’re making decisions about where to prospect.
- Number of installations in a given area. A suggestion would be to show a count of all the installations within a five mile area of their cursor as they mouse over the map.
- Rate of installations in a given area. Are installations growing in that area, or have they slowed down?
- Our prediction of the likelihood of people to purchase in a given area.
- Average Cost / Watt for installations in a given area. This number tends to fall over time. Being able to see the current

4). Accounts:
- It should be possible to log in from the home page and see my view of the different geographies. - There will be paid accounts in the future. Each organization logging into their paid account should get access to their own content.
- If they’ve loaded their own dataset into Hot 4 Solar, they should be able to view their data and no one else should have access to it from a different account.

5). Geographies:
- It should be possible to toggle between geographies to analyze.
- User can see different place/geography by entering a zip code or type the city name.
- As a user I want the ability to focus the dashboard on a geography that I’m interested in.

6). About Page:
- The About Page will feature a description of the Hot 4 Solar project as well as links to other resources.
- Additionally, the About Page may host a blog section at some point in the future.

Technical and Aesthetic:
- As an aesthetic choice, we love D3 charts and graphs. They’re super-responsive and often beautiful. - They present line graphs, bar charts and the like very well and would be well-suited to present the statistics envisioned for this project.
- D3 for the charts is a preference. Not a requirement.
- Similarly, D3 can be used to render the maps. D3 maps are often gorgeous.
- A safer, more flexible, path might be to work with Google Maps or some other technology
- This is our pre-alpha application: http://maspring.webfactional.com All done with D3. Again, none of this is a requirement but it should give you some feel for how this is used.
- Some pretty D3 statistics charts: http://bl.ocks.org/Caged/6476579
- Here’s an example of mousing over a given area and updating statistics associated with the selected area: https://vida.io/documents/4vZ9mRGyepoyQxFcK
- Here’s a great example that gets at the spirit of the idea of showing changes on a map over time.. It marches forward in time and presents shows statistics as they change: http://helenjacksonanalytic.co.uk/EW_prop_price.html

Target Audience:
- Anyone who selling/installing solar products
-- Small installers: Help target customers
-- Larger installers (Solarcity): Help with the macro view in communities

Judging Criteria:
- Is the design styled to be appealing and desirable?
- Does the design convey the function and use unambiguously and intuitively
- Does it clearly convey what the app is supposed to let you achieve / what problem it is designed to solve.
- Is it consistent of IA, visual and interaction design throughout the site?
- Does the design perform the function it was designed for?
- Is the design easy to use and understand?
- Is the design possible to build with D3 javascript library?

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:

2016 TopCoder(R) 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: 30051649