Challenge Summary
Welcome to GE Transportation Command Center Design Concepts Challenge. The GE team has spent the last few weeks workshopping ideas and are now looking to utilize crowdsourcing to push beyond their workshop analysis and outputs!
For this design challenge, we are looking for modern, and futuristic screen designs that will help us create an amazing demo showcasing our transportation command centers potential user experience and interface.
We are looking to combine your design expertise with our workshop outputs and examples to create the command center user interface and flow.
Good luck!
Initial Command Center Designs for the following screens:
2). Dashboard - Default?
3). Dashboard - Outcome Trends?
6). Train Yard Information ?
8). Trains Yard - Notification Modal Window?
- As part of your checkpoint submission, you must upload your submission to Marvelapp so we can provide direct feedback on your designs.
- Please ask for a Marvelapp prototype link
- Make sure all pages have correct flow. Please number your files (00, 01, 02, 03).
Final Command Center Design screens combined with Checkpoint Feedback:
- As part of your final submission, you must upload your submission to Marvelapp so we can provide direct feedback on your designs.
- Please ask for a Marvelapp prototype link
- Make sure all pages have correct flow. Please number your files (00, 01, 02, 03).
Additional GE Challenge Rules
- Please refer to GE Official Rules attached to this challenge.
- To the extent there is any conflict between these Official Rules and additional Topcoder Terms and Conditions of Use referenced off the Website, these Official Rules govern.
- All winners from this challenge need print, sign and send back to us the IP Rights document from GE before eligible for the prizes.���
~
About GE Transportation
GE Transportation’s (https://www.ge.com/digital/industries/transportation) charge is to make our platform of integrated products a reality.
Challenge Problem
We need to quickly create a "command center" demo that captures our transportation ecosystem. This command center is critical to inform our users of real-time train information with a combination of key performance indicators (KPI), transportation network visuals and the integration of system recommendations driven by our GE Predix Platform (https://www.ge.com/digital/predix).
Challenge Questions to Consider
1. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across a physical landscape (United States and/or Africa)?
- See Screen 2 - rOS-Demo-Wireframes.pdf
2. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across a trend line graph?
- See Screen 3 - rOS-Demo-Wireframes.pdf
3. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network Velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across overall KPI averages (United States and/or Africa)?
- See Screen 2 - rOS-Demo-Wireframes.pdf
4. What is an effective way to indicate user action vs. machine or A.I. like actions?
5. Given human factors studies, what is the optimal digital/physical balance (screen brightness/color vs room brightness/color) for screen design and physical environment for 8hr shifts looking at one screen for the duration of shift?
General Requirements
- This application is going to be developed as a Desktop based application
- Screen Sizes: Desktop Standard (1280px x 720px)
- Color/Branding is open
- Font usage is open
- Please use the Wireframe GE header, GE logo and left navigation (but update it to work with your UI treatment)
Design Reference
- We are looking for futuristic UI treatments (see attachments)
- Color: When researching and creating your screens make sure to be careful and considerate with color. The user needs to be able to quickly identify and understand the data they are viewing and take action on it.
Downloadable Files
Wireframes.zip: Wireframes
Design-Examples.zip: Examples of UI treatments/guidance
Submission Requirements
Important: We are providing wireframes but are looking your design concepts! This is one of many ideas/solutions for this experience.
Reference: rOS-Demo-Wireframes.pdf
1). Login
PDF: page 1
- This is Login screen look and feel
- Need displays username, password, and Login button
- Goal is SSO login for our customers
2). Dashboard - Default
PDF: page 2 - The goal of this view is to help drive decisions around outcomes
- We are looking to capture a United States view with KPI indicators
- The map it showing (Velocity, Economy, Utilization, Capacity, and ETA)
- The user can toggle the filters (Velocity, Economy, Utilization, Capacity, and ETA)
- Turn the toggles on/off will turn the layers on/off
- The map zoom in and zoom out buttons will allow the user to zoom in/out
- When a user clicks into Rail Yard they will see Yard Details
- The "Show Outcome Trends" are is collapsed by default.
- Progress timeline - by default will show the current time. The user can slide/move this to see future information.
- Colors: What colors make sense for this type of information? (See Challenge Questions to Consider #5)
- Navigation: Base it on the wireframe (consistent GE look) but update it based on your UI treatment
- Navigation: Capture the active/inactive states
All KPI Charts are open to your interpretation. Remember these are wireframes.
Network Velocity
- Chart Type: Speedometer
- Max Value: 80, 90, 100
- Speed value in mph format
Fuel Economy
- Chart Type: Inline Fuel Meter
- Chart Values: Low, Medium, High
- Fuel Statuses: Very Efficient
Railcar Utilization
- Chart Type: Pie Chart
- Chart Value: Low, Medium, High
- Percentage Total in use displayed on the bottom
Yard Capacity
- Chart Type: Donut Chart
- Capacity Total in use displayed on the bottom
Average ETA Delay
- Text Information in hours, minutes
- Display different color for normal and delay statuses
- Number of on-time trains displayed on the bottom
3). Dashboard - Outcome Trends
PDF: page 3: We are showing how different KPI’s work/relate to each other
- This is the view when a user expands "Show Outcome Trends"
- We are looking to capture how to display this multi-line chart and show how the different KPI's work/relate to each other.
- Filter: a user can select a date range
- Filter: a user can also toggle the lines on/off
4). Dashboard - Outcome Trends 24hr Range
PDF: page 4: Capturing future views, trends, and potential alerts
- This view will capture the interaction of moving the slider 24 hours into the future
- Notice the heatmap changes and we start to realize future trends and alerts
- There are graphic alerts for “Velocity” & “Capacity” displayed on the map
- Note how the future trend line shows alerts and decreases based on conflicts
- User can sort the filter to see the specific KPI “Velocity” & “Capacity” filter buttons
- On the trend line, there’s a dotted line to indicate the present time
- When user dragging the line need able to see the future state
- User can see trend line prediction with “Critical” and “Warning” level
- When Trend line shows up, chart need to be disabled
- Also, there are “Critical” and “Warning” information placed on top of Trends chart
5). Dashboard - Outcome Trends 48hr Range
PDF: page 5
- Similar to the previous screen we are now adjusting for 48 hours in the future
- Note the potential alerts (we would like to capture these)
- See how different items on the map become more dense/increase of conflict within the "heatmap view"
6). Train Yard Information
PDF: page 6: System recommendations
- This screen is showing recommendations based on existing variable we know. The system is making recommendations that the user needs to select/drag drop for priority decisions.
- Note the system will be "smart" and able to help the user understand upcoming conflicts and suggest "fixes". The user will always need to make the final decision but we want a simple/smart user experience.
- Trains yard is series of railroad tracks for storing, sorting, or loading/unloading, railroad cars and/or locomotives.
- When a user zooms in and clicks a rail yard they will see details
- This view is capturing actions the user needs to take based on their selection of 48 hours in the future and the need to resolve conflicts
- Note in the detail view the bottom area changes to Rail Yard information/KPI's
- Rail Yard KPI's: Dwell Time, Crew Availability & Power Availability
7). Trains Yard - Re-route
PDF: page 6 & page 7
- This is capturing the drag and drop interaction
- After user done dragging the rows, there’s prominent button to let user Re-route Trains
- Click the button take user to next notification screen
8). Trains Yard - Notification Modal Window
PDF: page 8 & page 9
- Since the user is modifying Train Yard information this affects other Train Yards in the system.
- The user needs to notify other Train Yards of the changes (so they can plan accordingly)
- Think about options for dynamic and manual input to select other users.
- Also, how to capture the message from interaction on previous pages.
- We are looking for a better design/interaction. This notification/window should be intuitive and offer the user potential suggestions of what type of notification or alert is needed.
- We would like it to be dynamic and provide communication options (SMS, Phone, Email etc.) based on priority
- The interactions here are very important - really look to explore and improve this experience.
9). Trains Yard - Outcome Report
PDF: page 10
- A user can capture outcome reports based on their decisions/actions
- Create how buttons look for “Similar ETAs”, “Maintaining Fuel Economy” and “Increased Revenue”
10). Dashboard - Map No Issues
PDF: page 10
- Design screen for how the map will look with no issues
- Note how this is showing 48 hours in the future.
- KPI's will change but a future view could have "no issues"
Judging Criteria:
- How well do your design concepts align with the objectives of the challenge
- Our ability to create a demo from your concepts
- Design quality of your visuals/screens.
Submission & Source Files
Preview Image
Please create your preview image as one (1) 1920x1080px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Submit JPG/PNG image files based on Challenge submission requirements stated above.
Source Files
All source files of all graphics created in either Adobe Photoshop or Illustrator and saved as editable.
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.
For this design challenge, we are looking for modern, and futuristic screen designs that will help us create an amazing demo showcasing our transportation command centers potential user experience and interface.
We are looking to combine your design expertise with our workshop outputs and examples to create the command center user interface and flow.
Good luck!
Round 1
Checkpoint Submission RequirementsInitial Command Center Designs for the following screens:
2). Dashboard - Default?
3). Dashboard - Outcome Trends?
6). Train Yard Information ?
8). Trains Yard - Notification Modal Window?
- As part of your checkpoint submission, you must upload your submission to Marvelapp so we can provide direct feedback on your designs.
- Please ask for a Marvelapp prototype link
- Make sure all pages have correct flow. Please number your files (00, 01, 02, 03).
Round 2
Final Submission RequirementsFinal Command Center Design screens combined with Checkpoint Feedback:
- As part of your final submission, you must upload your submission to Marvelapp so we can provide direct feedback on your designs.
- Please ask for a Marvelapp prototype link
- Make sure all pages have correct flow. Please number your files (00, 01, 02, 03).
Additional GE Challenge Rules
- Please refer to GE Official Rules attached to this challenge.
- To the extent there is any conflict between these Official Rules and additional Topcoder Terms and Conditions of Use referenced off the Website, these Official Rules govern.
- All winners from this challenge need print, sign and send back to us the IP Rights document from GE before eligible for the prizes.���
~
About GE Transportation
GE Transportation’s (https://www.ge.com/digital/industries/transportation) charge is to make our platform of integrated products a reality.
Challenge Problem
We need to quickly create a "command center" demo that captures our transportation ecosystem. This command center is critical to inform our users of real-time train information with a combination of key performance indicators (KPI), transportation network visuals and the integration of system recommendations driven by our GE Predix Platform (https://www.ge.com/digital/predix).
Challenge Questions to Consider
1. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across a physical landscape (United States and/or Africa)?
- See Screen 2 - rOS-Demo-Wireframes.pdf
2. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across a trend line graph?
- See Screen 3 - rOS-Demo-Wireframes.pdf
3. What are the most innovative ways to visualize 5 KPI correlations with varying metric types and thresholds, “Network Velocity, Yard Capacity, ETAs, Fuel Efficiency and Railcar Utilization across overall KPI averages (United States and/or Africa)?
- See Screen 2 - rOS-Demo-Wireframes.pdf
4. What is an effective way to indicate user action vs. machine or A.I. like actions?
5. Given human factors studies, what is the optimal digital/physical balance (screen brightness/color vs room brightness/color) for screen design and physical environment for 8hr shifts looking at one screen for the duration of shift?
General Requirements
- This application is going to be developed as a Desktop based application
- Screen Sizes: Desktop Standard (1280px x 720px)
- Color/Branding is open
- Font usage is open
- Please use the Wireframe GE header, GE logo and left navigation (but update it to work with your UI treatment)
Design Reference
- We are looking for futuristic UI treatments (see attachments)
- Color: When researching and creating your screens make sure to be careful and considerate with color. The user needs to be able to quickly identify and understand the data they are viewing and take action on it.
Downloadable Files
Wireframes.zip: Wireframes
Design-Examples.zip: Examples of UI treatments/guidance
Submission Requirements
Important: We are providing wireframes but are looking your design concepts! This is one of many ideas/solutions for this experience.
Reference: rOS-Demo-Wireframes.pdf
1). Login
PDF: page 1
- This is Login screen look and feel
- Need displays username, password, and Login button
- Goal is SSO login for our customers
2). Dashboard - Default
PDF: page 2 - The goal of this view is to help drive decisions around outcomes
- We are looking to capture a United States view with KPI indicators
- The map it showing (Velocity, Economy, Utilization, Capacity, and ETA)
- The user can toggle the filters (Velocity, Economy, Utilization, Capacity, and ETA)
- Turn the toggles on/off will turn the layers on/off
- The map zoom in and zoom out buttons will allow the user to zoom in/out
- When a user clicks into Rail Yard they will see Yard Details
- The "Show Outcome Trends" are is collapsed by default.
- Progress timeline - by default will show the current time. The user can slide/move this to see future information.
- Colors: What colors make sense for this type of information? (See Challenge Questions to Consider #5)
- Navigation: Base it on the wireframe (consistent GE look) but update it based on your UI treatment
- Navigation: Capture the active/inactive states
All KPI Charts are open to your interpretation. Remember these are wireframes.
Network Velocity
- Chart Type: Speedometer
- Max Value: 80, 90, 100
- Speed value in mph format
Fuel Economy
- Chart Type: Inline Fuel Meter
- Chart Values: Low, Medium, High
- Fuel Statuses: Very Efficient
Railcar Utilization
- Chart Type: Pie Chart
- Chart Value: Low, Medium, High
- Percentage Total in use displayed on the bottom
Yard Capacity
- Chart Type: Donut Chart
- Capacity Total in use displayed on the bottom
Average ETA Delay
- Text Information in hours, minutes
- Display different color for normal and delay statuses
- Number of on-time trains displayed on the bottom
3). Dashboard - Outcome Trends
PDF: page 3: We are showing how different KPI’s work/relate to each other
- This is the view when a user expands "Show Outcome Trends"
- We are looking to capture how to display this multi-line chart and show how the different KPI's work/relate to each other.
- Filter: a user can select a date range
- Filter: a user can also toggle the lines on/off
4). Dashboard - Outcome Trends 24hr Range
PDF: page 4: Capturing future views, trends, and potential alerts
- This view will capture the interaction of moving the slider 24 hours into the future
- Notice the heatmap changes and we start to realize future trends and alerts
- There are graphic alerts for “Velocity” & “Capacity” displayed on the map
- Note how the future trend line shows alerts and decreases based on conflicts
- User can sort the filter to see the specific KPI “Velocity” & “Capacity” filter buttons
- On the trend line, there’s a dotted line to indicate the present time
- When user dragging the line need able to see the future state
- User can see trend line prediction with “Critical” and “Warning” level
- When Trend line shows up, chart need to be disabled
- Also, there are “Critical” and “Warning” information placed on top of Trends chart
5). Dashboard - Outcome Trends 48hr Range
PDF: page 5
- Similar to the previous screen we are now adjusting for 48 hours in the future
- Note the potential alerts (we would like to capture these)
- See how different items on the map become more dense/increase of conflict within the "heatmap view"
6). Train Yard Information
PDF: page 6: System recommendations
- This screen is showing recommendations based on existing variable we know. The system is making recommendations that the user needs to select/drag drop for priority decisions.
- Note the system will be "smart" and able to help the user understand upcoming conflicts and suggest "fixes". The user will always need to make the final decision but we want a simple/smart user experience.
- Trains yard is series of railroad tracks for storing, sorting, or loading/unloading, railroad cars and/or locomotives.
- When a user zooms in and clicks a rail yard they will see details
- This view is capturing actions the user needs to take based on their selection of 48 hours in the future and the need to resolve conflicts
- Note in the detail view the bottom area changes to Rail Yard information/KPI's
- Rail Yard KPI's: Dwell Time, Crew Availability & Power Availability
7). Trains Yard - Re-route
PDF: page 6 & page 7
- This is capturing the drag and drop interaction
- After user done dragging the rows, there’s prominent button to let user Re-route Trains
- Click the button take user to next notification screen
8). Trains Yard - Notification Modal Window
PDF: page 8 & page 9
- Since the user is modifying Train Yard information this affects other Train Yards in the system.
- The user needs to notify other Train Yards of the changes (so they can plan accordingly)
- Think about options for dynamic and manual input to select other users.
- Also, how to capture the message from interaction on previous pages.
- We are looking for a better design/interaction. This notification/window should be intuitive and offer the user potential suggestions of what type of notification or alert is needed.
- We would like it to be dynamic and provide communication options (SMS, Phone, Email etc.) based on priority
- The interactions here are very important - really look to explore and improve this experience.
9). Trains Yard - Outcome Report
PDF: page 10
- A user can capture outcome reports based on their decisions/actions
- Create how buttons look for “Similar ETAs”, “Maintaining Fuel Economy” and “Increased Revenue”
10). Dashboard - Map No Issues
PDF: page 10
- Design screen for how the map will look with no issues
- Note how this is showing 48 hours in the future.
- KPI's will change but a future view could have "no issues"
Judging Criteria:
- How well do your design concepts align with the objectives of the challenge
- Our ability to create a demo from your concepts
- Design quality of your visuals/screens.
Submission & Source Files
Preview Image
Please create your preview image as one (1) 1920x1080px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Submit JPG/PNG image files based on Challenge submission requirements stated above.
Source Files
All source files of all graphics created in either Adobe Photoshop or Illustrator and saved as editable.
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.
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.