Challenge Summary
Welcome to the Sunshot – Soluxify – SVG Icon Design Challenge! In this challenge we are looking to design some simple graphics designed all in SVG format with transparent backgrounds.
Round 1
Submit your Graphics for a Checkpoint feedback:
- Submit the first 20 graphics for checkpoint review.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Final Design plus Checkpoint feedback:
- Submit all graphics for final review.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Challenge Description:
In this challenge we need to design new graphics or update them for Soluxify client, the output should be in SVG format and with transparent background.
You are provided with client current graphics so you can understand what we are looking for.
Design Consideration:
- The design should follow flat design and material design style.
- Here is a guide to flat design philosophy http://www.hongkiat.com/blog/flat-design-resources/
- Primary design model http://www.google.com/design/spec/material-design/introduction.html
- All of Your graphics should be coherent with the rest of the design.
Supporting Documents:
- Current Client Graphics (grapchics.zip).
Challenge Requirements:
1. Logo:
- Please refer to logo.svg.
- Remove white background from around the letter and the 3 colored circle, name this .svg file "current-logo.svg".
- Design a new logo that spells out "soluxify" in full, using the colored circle as the letter "o" in "soluxify".
- This new logo design should be coherent with the style of your proposed design, name this .svg file "new-logo.svg".
- We will be calling this small 3 colored(yellow/green/blue) circle the small logo in the rest of this specification.
2. Thanks:
- Please refer to thanks.jpeg
- Use the idea of thanks.jpeg to create a heart shaped design that uses the same colors as the small logo that is coherent with the rest of your design style.
- Name this .svg file "thanks.svg".
3. Puzzle:
- Please refer to puzzle.jpeg
- Use the idea of puzzle.jpeg design to create a circle shaped design that uses same colors as small logo and also has a jigsaw puzzle like interconnection between the 3 layers.
- This design should be coherent with the rest of your design style.
- Name this .svg file "puzzle.svg"
4. 404:
- Design a 404 graphic spelling out "404" that uses the small logo in place of "0" and the rest of two 4s should have a coherent design.
- Name this .svg file "404.svg"
5. Avatar:
- Use flat deign color pallet and 3 colors of the small logo design a square female avatar. name this .svg file "avatar-female.svg"
- Wse flat deign color pallet and 3 colors of the small logo design a square male avatar. name this .svg file "avatar-male.svg"
6. Roof types:
- Please refer to flat-roof.png & inclined-roof.png
- Use the idea shown in "flat-roof.png" file to design a flat roof graphic using flat design color pallet that is coherent with the rest of your design.
- Name this .svg file "roof-flat.svg"
- Use the idea shown in "inclined-roof.png" file to design a inclined roof graphic using flat design color pallet that is coherent with the rest of your design.
- Name this .svg file "roof-inclined.svg"
- Use the idea shown in "inclined-roof.png" file to design a VERY inclined roof graphic using flat design color pallet that is coherent with the rest of your design.
- Name this .svg file "roof-veryinclined.svg"
7. Property types:
- Use the experience from roof types to design a graphic for property type "house" that is coherent with the rest of your design.
- Name this .svg file "property-house.svg"
- Use the experience from roof types to design a graphic for property type "condo" that is coherent with the rest of your design.
- Name this .svg file "property-condo.svg"
- Use the experience from roof types to design a graphic for property type "commercial" that is coherent with the rest of your design.
- Name this .svg file "property-commercial.svg"
- Use the experience from roof types to design a graphic for property type "land" that is coherent with the rest of your design.
- name this .svg file "property-land.svg".
8. Recycle:
- Please refer to recycle.png
- Use recycle.png to design a recycling sign using the 3 colors of small logo on these 3 arrows.
- This design should be coherent with the rest of the design.
- Name this .svg file "recycle.svg"
9. News Feed:
- Please refer to newsfeed.png
- Use newsfeed.png to design a news feed graphic using the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "newsfeed.svg"
10. Devices:
Please refer to devices.jpg
- Use devices.jpg to design an all devices graphic using flat design color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "devices.svg"
11. Team Work:
Please refer to teamwork-5.jpg
- Use teamwork-5.jpg to design a graphic showing the idea of team work using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "teamwork.svg".
12. Happy Team:
Please refer to teamwork-2.jpg & teamwork-3.jpg
- Use teamwork-2.jpg to design a graphic showing the idea of a happy team work using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- Name this .svg file "happyteam1.svg".
- Use teamwork-3.jpg to design a graphic showing the idea of a happy team work using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- Name this .svg file "happyteam2.svg"
- This design should be coherent with the rest of the design.
13. Tree:
- Please refer to tree.jpg
- Use tree.jpg to design a graphic showing the idea of a tree using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "tree.svg".
14. Sun:
- Please refer to sun.jpg
- Use sun.jpg to design a graphic showing the idea of a sun using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "sun.svg".
15. Earth:
- Please refer to earth.jpg
- Use earth.jpg to design a graphic showing the idea of earth using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "earth.svg"
16. Bulb:
- Please refer to bulb.jpg
- Use bulb.jpg to design a graphic showing the idea of a bulb using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "bulb.svg"
17. Efficient Bulb:
- Please refer to efficientbulb.jpg
- Use efficientbulb.jpg to design a graphic showing the idea of a efficient bulb using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "efficientbulb.svg"
18- Wind Turbine:
- Please refer to windTurbine.jpg
- Use windTurbine.jpg to design a graphic showing the idea of a wind turbine using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "windturbine.svg"
19- Panel:
- Please refer to panel.jpg
- Use panel.jpg to design a graphic showing the idea of a panel using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "panel.svg"
20- Gas:
- Please refer to gas.jpg
- Use gas.jpg to design a graphic showing the idea of a gas using flat desgin color pallet and the 3 colors of small logo on these 3 lines.
- This design should be coherent with the rest of the design.
- Name this .svg file "gas.svg".
21. Brain Bulb:
- Please refer to brain-bulb.jpg
- Use the idea of brain-bulb.jpg design to create a design that uses same colors as small logo.
- This design should be coherent with the rest of your design style.
- Name this .svg file "brain-bulb.svg"
22. Green bulb:
- Please refer to green-bulb.jpg
- Use the idea of green-bulb.jpg design to create a design that uses same colors as small logo.
- This design should be coherent with the rest of your design style.
- Name this .svg file "green-bulb.svg"
23. community:
- Please refer to community.png
- Use the idea of community.png design to create a circle shaped design that uses same colors as small logo and also has a jigsaw puzzle like interconnection between the 3 pieces. remove the words and man shaped figures from this design.
- This design should be coherent with the rest of your design style.
- Name this .svg file "community.svg"
24. design:
- Please refer to design.jpg
- Use the idea of desgin.jpg design to create a design icon
- This design should be coherent with the rest of your design style.
- Name this .svg file "design.svg"
25. engineering:
- Please refer to engineering.jpg
- Use the idea of engineering.jpg design to create an engineering icon.
- This design should be coherent with the rest of your design style.
- Name this .svg file "engineering.svg"
26. green-earth:
- Please refer to green-earth.jpg
- Use the idea of green-earth.jpg design to create a nice earth design
- This design should be coherent with the rest of your design style.
- Name this .svg file "green-earth.svg"
27. law:
- Please refer to law.jpg
- Use the idea of law.jpg design to create 7 icons each representing one of the icons in this image. use colors
- This design should be coherent with the rest of your design style.
- Name these .svg files "law1.svg", "law2.svg"... to "law7.svg"
28. homepage-1:
- Please refer to homepage1-1.jpg & homepage1-2.jpg
- Use the idea of homepage1.1.jpg and homepage1-2.jpg design to create a design of a light bulb that is powered by sun. the more creative and nice the better.
- This design should be coherent with the rest of your design style and specially the rest of homepage graphics
- Name this .svg file "homepage1.svg"
29. homepage-2:
- Please refer to homepage2.png
- Use the idea of homepage2.png design to create a design of multiple devices that are displaying a soluxify page with soluxify small logo showing on the browser. the more creative and nice the better.
- This design should be coherent with the rest of your design style and specially the rest of homepage graphics
- Name this .svg file "homepage2.svg"
30. homepage-3:
- Please refer to homepage3.jpg
- Use the idea of homepage3.jpg and homepage1-2.jpg design to create a circle shaped set of palms. these palms should be colored the same way small logo is colored, in 3 layers. top yellow, middle green and lower blue. the more creative and nice the better.
- This design should be coherent with the rest of your design style and specially the rest of homepage graphics
- Name this .svg file "homepage3.svg"
31. homepage-4:
- Please refer to homepage4.jpg
- Use the idea of homepage4.jpg to create a design of comparison idea showing a magnifier comparing and analyzing. through magnifier we want to see small logo. the more creative and nice the better.
- This design should be coherent with the rest of your design style and specially the rest of homepage graphics
- Name this .svg file "homepage4.svg"
32. howitworks-1:
- Please refer to howitworks1.jpg
- Use the idea of howitworks1.jpg to create a design of supportive community with the small logo in the center of the graphic
- This design should be coherent with the rest of your design style and specially the rest of howitworks graphics
- Name this .svg file "howitworks1.svg"
33. howitworks-2:
- Please refer to howitworks2.jpg
- Use the idea of howitworks2.jpg to create a design of two hands facing each other holding different electronic devises and sharing content
- This design should be coherent with the rest of your design style and specially the rest of howitworks graphics
- Name this .svg file "howitworks2.svg"
34. howitworks-3:
- Please refer to howitworks3.jpg
- Use the idea of howitworks3.jpg to create a design of a magnifier trying to find the best deals on a graph
- This design should be coherent with the rest of your design style and specially the rest of howitworks graphics
- Name this .svg file "howitworks3.svg"
35. illustration:
- Please refer to illustration.jpg
- Use the idea of illustration.jpg design to create a nice illustration graphic icon
- This design should be coherent with the rest of your design style.
- Name this .svg file "illustration.svg"
36. inspection:
- Please refer to inspection.jpg
- Use the idea of inspection.jpg design to create 4 icons each designing one of the icons showing in the image. use colors.
- This design should be coherent with the rest of your design style.
- Name these .svg files "inspection1.svg", "inspection2.svg", "inspection3.svg", "inspection4.svg"
- Name this .svg file "money.svg"
37. team bulb:
- Please refer to team-bulb.jpg
- Use the idea of team-bulb.jpg design to show a bulb with the details that would show a team work spirit. to lighten up this bulb.
- This design should be coherent with the rest of your design style.
- Name this .svg file "team-bulb.svg"
38. team:
- Please refer to team-tree.jpg
- Use the idea of team-tree.jpg design to create a tree showing the team spirit. we want this graphic to be detailed and nice just the the sample design.
- This design should be coherent with the rest of your design style.
- Name this .svg file "team-tree.svg"
39. worker 1 :
- Please refer to worker1.jpg
- Use the idea of worker1.jpg design to create a solar panel icon
- This design should be coherent with the rest of your design style.
- Name this .svg file "worker1.svg"
40. worker 2:
- Please refer to worker2.jpg
- Use the idea of worker2.jpg design to create a solar panel icon
- This design should be coherent with the rest of your design style.
- Name this .svg file "worker2.svg"
Target User:
- Soluxify clients who are looking to save power.
Judging Criteria:
- Creativity: Is your logo visually exciting and engaging?
- Relevance: Does your logo convey the brand aspirations?
- Quality: Does your logo look fresh, professional and clean? Is the composition/layout well done?
- Have you used typography in a meaningful way?
- Cleanliness and consistency of your graphics and icon designs.
- Quality of your icons.
- Simplicity.
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 SVG for your submission files.
Source Files
All original source files of the submitted design. Files should be created in Adobe Illustrator. Each icon should be a single layer, which is easy to apply color changes to.
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 and instructions.
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.