Challenge Summary
Welcome to Eaton PX 2.0 Icon Set Conversion Design Challenge
The goal of this challenge is to create 33 new icons set that fit the language of Material Design. These will be delivered as an Adobe Illustrator (.ai) file with 24 artboards (or more, if you submit “alternatives”). Each of the 33 artboards should be 24px by 24px. Duplicating the artboard from the template file below should do the trick!
We have provided guidance for inspiration on the 33 icons in the PDF that should be followed as closely as possible unless you have a suggestion for one of the items that asks for creative solutions. In the case of an item inviting ‘alternatives,’ please include any additional studies as a separate artboard.
We're looking forward to seeing your creative designs for Eaton Px 2.0 Icon Set.
1). Aeronautics
2). Airport
3). Automotive
4). Barometer
5). Carbon Neutral
6). Data Center
7). Desk
8). Electrical
9). Explosion Proof (_1 +_2)
10). Heat
11). Hospitals
12). HVAC (Heating, ventilation, and air conditioning)
13). Hydraulics
14). LEED (Leadership in Energy and Environmental Design)
15). Military
16). Municipality
17). Oil and Gas
Submission Notes:
- Submit PDF files contains all the icons with 24px x 24px size
- All separated PNG format with 24px x 24px size on a folder
- Submit a single PDF file containing all of the icons in a grid layout
1). Aeronautics
2). Airport
3). Automotive
4). Barometer
5). Carbon Neutral
6). Data Center
7). Desk
8). Electrical
9). Explosion Proof version 1
10). Explosion Proof version 2
11). Heat
12). Hospitals
13). HVAC (Heating, ventilation, and air conditioning)
14). Hydraulics
15). LEED (Leadership in Energy and Environmental Design)
16). Military
17). Municipality
18). Oil and Gas
19). Regional Grid
20). Room
21). Safety harness
22). Sports Stadium
23). Starter
24). Wall Station
25). Floor
26). Unlink
27). Server Rack
28). Demand Response
29). Micro Grid
30). Generator
31). UPS
32). One Line Drawing
33). Breaker
Submission Notes:
- Make sure you follow Submission & Source Files Delivery Requirements before you submit!
- Submit PDF files contains all the icons with 24px x 24px size
- All separated PNG format with 24px x 24px size on a folder
- Submit a single PDF file containing all of the icons in a grid layout
Guidelines/Rules:
- Refer to Material guidelines for icon creation specifications: https://material.io/guidelines/style/icons.html
- Please note there is a 2px buffer (padding) within the 24px x 24px grid. The icon should fit within this, e.g. an icon’s size might be 22px by 18px, centered in the 24 x 24px artboard.
- Material specification calls for a weight of 2px that can be decreased to 1.5px sparingly. After our own review of the existing Material icons, it’s clear even the in-house Material design team makes creative exceptions when the situation calls for more detail. So: We advise that icons attempt to follow the specifications provided by Google Material, but please divert from those specs sparingly if the situation calls for more detail.
- Material design does not specify when to use a filled icon compared to an outline. This will have to be a judgement call by the designer, but we suggest leaning to whatever’s more simple (our team can always circle/invert later).
- Ensure that all icons are designed in the provided AI template. Icons that need to be exported need to makes sure that the artboard is being exported as well. We have discovered that exporting the Material SVG icons do not provide the needed padding or the 24px x 24px frame. Please be aware of the spacing that is shown by the guide layers.
- Please read up on this particularly important Material Design specs (copied from the page linked above):
Note on the DP unit grid
Android expects product icons to be provided at 48dp, with edges at 1dp. When you create the icon, maintain the 48-unit measure, but scale it to 400% at 192 x 192 dp (the edge becomes 4dp). Any scaling done to the original will scale the image up or down proportionally. By maintaining the unit ratio, you preserve sharp edges and correct alignment when the scale is reduced.
See on Google Material Design Guidelines website
Please check the expected icon design execution by using Material Guidelines template:
Downloadable Files:
- 20171002- Icon References.pdf : 33 Icon Set reference
- system-icon-template.ai & system-icon-template-CS3.ai: Icon Template
Eaton PX 2.0 Icon Set Conversion Design Requirements:
For each icons below read the provided 20171002- Icon References.pdf for Icon reference images and the descriptions:
1). Aeronautics
Notes: Offer creative solution if you have one. This is Aeronautics at its broadest sense, not just aeroplanes or flight.
2). Airport
3). Automotive
Notes: Intended for broad ‘Automotive’ industry (like aeronautics above). If you have an alternative please submit that.
4). Barometer
Notes: The suggested icon is too detailed - try to think of a design to simplify this. (Barometers measure atmospheric pressure)
5). Carbon Neutral
6). Data Center
Notes: Open to creative solution.
7). Desk
8). Electrical
Notes: Please be creative. This means ‘Electrical’ in the broadest sense not just an outlet or a plug.
9). Explosion Proof (_1 +_2)
Notes: Please create 2 icons based oon the suggested in the first coolumn and one for the second (industry standard here: https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/EX-logo.svg/800px-EX-logo.svg.png) Append _1 and _2 to name.
10). Heat
11). Hospitals
Notes: There are existing building icons in Material library, this should not be more complex than those. Cross should be like Red Cross.
12). HVAC (Heating, ventilation, and air conditioning)
Notes: Please provide one without the circle or additional ideas.
13). Hydraulics
Notes: Please suggest alternatives!
14). LEED (Leadership in Energy and Environmental Design)
15). Military
Notes: The outline in the second example is not part of design language, but the icon is simple and clear.
16). Municipality
Notes: Material has a courthouse icon, that may satisfy this requirement
17). Oil and Gas
Notes: Please simplify but keep as pump.
18). Regional Grid
Notes: Please simplify number of lines if possible. Additional ideas welcome.
19). Room
Notes: Open to alternatives.
20). Safety harness
Notes: Please show the person in the harness, even if just bust. Combining a Safety Harness with this seatbelt icon should give an idea.
21). Sports Stadium
Notes: Feel free to suggest an alternative.
22). Starter
Notes: Usage will be for a motor starter. Feel free to suggest alternatives.
23). Wall Station
Notes: This would be for harvesting power from solar grids as well as charging stations (for now)
23). Wall Station
Notes: This would be for harvesting power from solar grids as well as charging stations (for now)
24). Floor
Notes: The example image is a CAD drawing of a floorplan. Please simplify into something legible. If possible, relate to ‘room’ icon.
25). Unlink
Notes: There is a “link” icon in the Material iconset (Column 2). Please try to match.
26). Server Rack
27). Demand Response
Notes: Demand Response is a Electrical Utility term used to describe redistributing power to areas in need. Be creative!
28). Micro Grid
Notes: A microgrid is a small-scale power grid that can operate independently or in conjunction with the area’s main electrical grid. Be creative!
29). Generator
Notes: A large generator for a Hospital, School etc. It would keep the building with power. Be creative!
30). UPS
Notes: An Uninterruptible Power Supply (UPS) is like a heavy-duty power strip. It has a battery to make sure whatever’s plugged in stays on through a power issue
31). One Line Drawing
Notes: Please see example for reference, but be creative! This is a typical electrician drawing or diagram.
32). Breaker
Notes: This turns on and off power to a building or device. Please be creative!
Target Audience:
- Internal Employee of Eaton
Judging Criteria:
- Creativity: Does your icon visually exciting and engaging?
- Relevance: Does your icon convey the functionality?
- Quality: Does your icon look fresh, professional and clean? Is the composition/layout well done?
- Cleanliness and consistency of your graphics and icon designs.
- Follow Google Material Icon Design Guidelines
- Follow Submission, Source Files Delivery Requirements explained below
Important! Submission & Source Files Requirements:
Preview Image
- Create a single PDF file (landscape-oriented page) that contains all of the icons in a grid for preview
Submission File
- 33 separate icon files as exported PNGs from the artboards in a folder, 24px x 24px in black-on-white is preferable.
- Numbering the icons based on challenge requirements
- Alternatives or additional icons should be named identically but with a _2, _3, etc. appended to the name.
- Create PDF files with landscape-oriented pages that contain all of the icons in a grid (something we can print and marked-up)
Source Files
- Final output should have a separate AI file (24px x 24px artboard with final icon) per icon.
- The icon grid from the attached template should be available on a separate layer than the final artwork.
- Alternatives or additional icons should be named identically but with a _2, _3, etc. appended to the name.
- 1 (one) AI file with landscape-oriented page that contains all of the icons in a grid
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics (sizes or colors) or modify overall colors.
The goal of this challenge is to create 33 new icons set that fit the language of Material Design. These will be delivered as an Adobe Illustrator (.ai) file with 24 artboards (or more, if you submit “alternatives”). Each of the 33 artboards should be 24px by 24px. Duplicating the artboard from the template file below should do the trick!
We have provided guidance for inspiration on the 33 icons in the PDF that should be followed as closely as possible unless you have a suggestion for one of the items that asks for creative solutions. In the case of an item inviting ‘alternatives,’ please include any additional studies as a separate artboard.
We're looking forward to seeing your creative designs for Eaton Px 2.0 Icon Set.
Round 1
For Checkpoint Round, we would like to review your initial 17 icons designs for these following pages:1). Aeronautics
2). Airport
3). Automotive
4). Barometer
5). Carbon Neutral
6). Data Center
7). Desk
8). Electrical
9). Explosion Proof (_1 +_2)
10). Heat
11). Hospitals
12). HVAC (Heating, ventilation, and air conditioning)
13). Hydraulics
14). LEED (Leadership in Energy and Environmental Design)
15). Military
16). Municipality
17). Oil and Gas
Submission Notes:
- Submit PDF files contains all the icons with 24px x 24px size
- All separated PNG format with 24px x 24px size on a folder
- Submit a single PDF file containing all of the icons in a grid layout
Round 2
For the Final Round, we would like to you to submit the all 33 icons designs with checkpoint feedback implemented for these following icons:1). Aeronautics
2). Airport
3). Automotive
4). Barometer
5). Carbon Neutral
6). Data Center
7). Desk
8). Electrical
9). Explosion Proof version 1
10). Explosion Proof version 2
11). Heat
12). Hospitals
13). HVAC (Heating, ventilation, and air conditioning)
14). Hydraulics
15). LEED (Leadership in Energy and Environmental Design)
16). Military
17). Municipality
18). Oil and Gas
19). Regional Grid
20). Room
21). Safety harness
22). Sports Stadium
23). Starter
24). Wall Station
25). Floor
26). Unlink
27). Server Rack
28). Demand Response
29). Micro Grid
30). Generator
31). UPS
32). One Line Drawing
33). Breaker
Submission Notes:
- Make sure you follow Submission & Source Files Delivery Requirements before you submit!
- Submit PDF files contains all the icons with 24px x 24px size
- All separated PNG format with 24px x 24px size on a folder
- Submit a single PDF file containing all of the icons in a grid layout
Guidelines/Rules:
- Refer to Material guidelines for icon creation specifications: https://material.io/guidelines/style/icons.html
- Please note there is a 2px buffer (padding) within the 24px x 24px grid. The icon should fit within this, e.g. an icon’s size might be 22px by 18px, centered in the 24 x 24px artboard.
- Material specification calls for a weight of 2px that can be decreased to 1.5px sparingly. After our own review of the existing Material icons, it’s clear even the in-house Material design team makes creative exceptions when the situation calls for more detail. So: We advise that icons attempt to follow the specifications provided by Google Material, but please divert from those specs sparingly if the situation calls for more detail.
- Material design does not specify when to use a filled icon compared to an outline. This will have to be a judgement call by the designer, but we suggest leaning to whatever’s more simple (our team can always circle/invert later).
- Ensure that all icons are designed in the provided AI template. Icons that need to be exported need to makes sure that the artboard is being exported as well. We have discovered that exporting the Material SVG icons do not provide the needed padding or the 24px x 24px frame. Please be aware of the spacing that is shown by the guide layers.
- Please read up on this particularly important Material Design specs (copied from the page linked above):
Note on the DP unit grid
Android expects product icons to be provided at 48dp, with edges at 1dp. When you create the icon, maintain the 48-unit measure, but scale it to 400% at 192 x 192 dp (the edge becomes 4dp). Any scaling done to the original will scale the image up or down proportionally. By maintaining the unit ratio, you preserve sharp edges and correct alignment when the scale is reduced.
See on Google Material Design Guidelines website
Please check the expected icon design execution by using Material Guidelines template:
Downloadable Files:
- 20171002- Icon References.pdf : 33 Icon Set reference
- system-icon-template.ai & system-icon-template-CS3.ai: Icon Template
Eaton PX 2.0 Icon Set Conversion Design Requirements:
For each icons below read the provided 20171002- Icon References.pdf for Icon reference images and the descriptions:
1). Aeronautics
Notes: Offer creative solution if you have one. This is Aeronautics at its broadest sense, not just aeroplanes or flight.
2). Airport
3). Automotive
Notes: Intended for broad ‘Automotive’ industry (like aeronautics above). If you have an alternative please submit that.
4). Barometer
Notes: The suggested icon is too detailed - try to think of a design to simplify this. (Barometers measure atmospheric pressure)
5). Carbon Neutral
6). Data Center
Notes: Open to creative solution.
7). Desk
8). Electrical
Notes: Please be creative. This means ‘Electrical’ in the broadest sense not just an outlet or a plug.
9). Explosion Proof (_1 +_2)
Notes: Please create 2 icons based oon the suggested in the first coolumn and one for the second (industry standard here: https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/EX-logo.svg/800px-EX-logo.svg.png) Append _1 and _2 to name.
10). Heat
11). Hospitals
Notes: There are existing building icons in Material library, this should not be more complex than those. Cross should be like Red Cross.
12). HVAC (Heating, ventilation, and air conditioning)
Notes: Please provide one without the circle or additional ideas.
13). Hydraulics
Notes: Please suggest alternatives!
14). LEED (Leadership in Energy and Environmental Design)
15). Military
Notes: The outline in the second example is not part of design language, but the icon is simple and clear.
16). Municipality
Notes: Material has a courthouse icon, that may satisfy this requirement
17). Oil and Gas
Notes: Please simplify but keep as pump.
18). Regional Grid
Notes: Please simplify number of lines if possible. Additional ideas welcome.
19). Room
Notes: Open to alternatives.
20). Safety harness
Notes: Please show the person in the harness, even if just bust. Combining a Safety Harness with this seatbelt icon should give an idea.
21). Sports Stadium
Notes: Feel free to suggest an alternative.
22). Starter
Notes: Usage will be for a motor starter. Feel free to suggest alternatives.
23). Wall Station
Notes: This would be for harvesting power from solar grids as well as charging stations (for now)
23). Wall Station
Notes: This would be for harvesting power from solar grids as well as charging stations (for now)
24). Floor
Notes: The example image is a CAD drawing of a floorplan. Please simplify into something legible. If possible, relate to ‘room’ icon.
25). Unlink
Notes: There is a “link” icon in the Material iconset (Column 2). Please try to match.
26). Server Rack
27). Demand Response
Notes: Demand Response is a Electrical Utility term used to describe redistributing power to areas in need. Be creative!
28). Micro Grid
Notes: A microgrid is a small-scale power grid that can operate independently or in conjunction with the area’s main electrical grid. Be creative!
29). Generator
Notes: A large generator for a Hospital, School etc. It would keep the building with power. Be creative!
30). UPS
Notes: An Uninterruptible Power Supply (UPS) is like a heavy-duty power strip. It has a battery to make sure whatever’s plugged in stays on through a power issue
31). One Line Drawing
Notes: Please see example for reference, but be creative! This is a typical electrician drawing or diagram.
32). Breaker
Notes: This turns on and off power to a building or device. Please be creative!
Target Audience:
- Internal Employee of Eaton
Judging Criteria:
- Creativity: Does your icon visually exciting and engaging?
- Relevance: Does your icon convey the functionality?
- Quality: Does your icon look fresh, professional and clean? Is the composition/layout well done?
- Cleanliness and consistency of your graphics and icon designs.
- Follow Google Material Icon Design Guidelines
- Follow Submission, Source Files Delivery Requirements explained below
Important! Submission & Source Files Requirements:
Preview Image
- Create a single PDF file (landscape-oriented page) that contains all of the icons in a grid for preview
Submission File
- 33 separate icon files as exported PNGs from the artboards in a folder, 24px x 24px in black-on-white is preferable.
- Numbering the icons based on challenge requirements
- Alternatives or additional icons should be named identically but with a _2, _3, etc. appended to the name.
- Create PDF files with landscape-oriented pages that contain all of the icons in a grid (something we can print and marked-up)
Source Files
- Final output should have a separate AI file (24px x 24px artboard with final icon) per icon.
- The icon grid from the attached template should be available on a separate layer than the final artwork.
- Alternatives or additional icons should be named identically but with a _2, _3, etc. appended to the name.
- 1 (one) AI file with landscape-oriented page that contains all of the icons in a grid
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.