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

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to SunShot - Savenia App GUI PSD Kit Design Challenge!

We need to create a set of PSD files that contain all the UI elements from the new Savenia App in order to provide ready-to-grab graphics for further challenges.

Round 1

Submit your design for a Checkpoint feedback:
- Savenia-GUI-Kit-PSD(s): give us an idea of how you are going to present and package your GUI Kit - Contain as much information as possible for Review.
- Usage-Guide: create a PDF file with common usage information about the elements you group for the GUI Kit. It needs to explain how to properly use buttons, forms, styles, icons, fonts, etc.
- PNG/JPG Files: of any design items/inconsistencies you would like the Client to review and comment on.

Round 2

Final design plus any Checkpoint feedback:
- Savenia-GUI-Kit-PSD(s): final version of your GUI Kit plus client feedback.
- Usage-Guide: final version of the PDF file with common usage information about the elements you group for the GUI Kit. It needs to explain how to properly use buttons, forms, styles, icons, fonts, etc.
- PNG/JPG Files: of any design items/inconsistencies you would like the Client to review and comment on.


Challenge Details:
The primary goal of this challenge is to create a GUI Kit, which is a set of PSD files that contain all of the UI elements and graphics related to the Savenia App plus a PDF common usage guide. This GUI Kit should allow grabbing UI elements to be used in another design projects/challenges with the feature of letting customization for some UI elements such as button labels, texts and data.

General Guidance:
- Group/package each of UI elements in its own PSD folder layer with appropriate name.
- Categorize PSD's based on specific UI elements.
- Use the reference links below as guidelines for setting up your files.
- You might need to recreate some graphics if the PSD source is not available.

Supporting Documents:
- Savenia App Storyboard (Storyboard.zip).
- App workflow (Savenia Home Data Entry App v7.0.pptx).
- Savenia Labs Identity Guidlines (Savenia Labs Identity Guidlines.pdf).

Design Requirements:
- Browse, review and analyze all the Savenia App pages and the attached PSD sources. You need to capture all the possible UI compositions and represent them in your GUI Kit.
- Add the Savenia logo, title and GUI version/branding at the top of every PSD file you generate.
- Create Headers/Titles for the different sections to make it more useful for future designers.
- The look and feel of the GUI Kit should complement the Savenia App graphics.
- We are not looking for new items to be added, just all the current UI items to be consolidated and made useful for future designers.
- Provide a PDF that explains the common usage of the UI elements you gathered properly organized and easy to understand/apply. Imagine you’re designing pages from the new Savenia App. What information
you need to properly follow the same branding guidelines? Think about the best way to deliver this information.

- We also need you to capture the following elements from (Savenia Home Data Entry App v7.0.pptx):
-- Slide 7: Order and Audit. Missing how “checkbox” look
-- Slide 18 : Model Number.
-- Slide 38: 404 page.
-- Slide 48: How button selection look if there’s no images.
-- Slide 81: Comparison slider.
-- Slide 142: Checkboxes columns.
- Check App Workflow (Savenia Home Data Entry App v7.0.pptx) and see if you can find elements that are missing in our storyboard, the more elements you find the better chances you have to win the challenge (This will be considered as a Judging Criteria).

GUI Kit Sample:
The following structure is a raw sample you could start with. This obviously needs a proper analysis and improvement based on the requirements stated above.
- Savenia Home Page:
-- UI Elements.
-- Navigation.
-- Login and Registration overlay/popup.
- UI Elements:
-- Buttons
-- Forms.
-- Icons.
- Page Layout Element:
-- Tabs.
-- Tables.
-- Alert/Notification.
-- Container.
-- Modal Window.
- Secondary Page:
-- Text/parragraph style.
-- Page Title wrapper.
- etc, etc…

Note: This is for sample purposes, please analyze, add and categorized UI Elements from attached PSD Sources and the app exploration.

References:
Notice these are just for reference. DON’T COPY ANYTHING.
- Facebook PSD Kit
- Android PSD Kit

Target Users:
- Homeowners and realtors.

Judging Criteria:
- How well you design, plan and develop your GUI PSD Kit.
- Cleanliness of your graphics, design and ability to stay within the given design reference.

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
Add the PSD files, PDF, PNG/JPG screens and any notes to 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.

Stock Photography

Stock photography is not allowed in this challenge. All submitted elements must be designed solely by you. See this page for more details.

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: 30048516