Challenge Summary
Welcome to the “RWF - Responsive Widget Framework Design Update Challenge”. The purpose of this challenge is to combine several design elements from the two provided designs. We need you to merge and refine the design - Join NOW!!
Round 1
All requested updates for a checkpoint review
Round 2
All final updates plus any checkpoint updates
Challege Details
We are looking to create a mobile friendly (responsive) website that uses a widget framework. In our last challenge, [topcoder] design community created a couple of designs and we would now like to combine some of the features to create a final design concept for the RWF application.
In this new challenge, we need your help to combine several design and interaction elements from our 2nd and 3rd placement to our winning design.
Notes :
176626 : Base Design / 1st placement (you should follow branding guidelines from this design)
176649 : 2nd placement (combine several design elements and interaction concept into the 1st placement)
176667 : 3rd placement (combine the wizard style in this subs to 1st placement)
Requirements
1. Remove the following elements from winning design (176626)
- Remove refresh button (the page refreshes automatically.. no need for the button)
- Remove search functionality
- Remove detail dialog (01-2_RWF_Detail Dialog.png)
2. Add and combine design elements and interaction from 2nd placement (176649) to winning design (176626)
- Replace current widget menu from the base design with the one used in 2nd placement.
- Add "move" interaction (02_1_function.png, 02_2_function.png, 02_3_function.png, 02_4_function.png).
- Add "Resize" interaction (02_5_function.png, 02_6_function.png), Resize menu without disclosure, just a click on menu item.
- Add "Config" interaction (02_7_function.png).
3. Add & Combine design elements and interaction from additional placement (176667) to winning design (176626)
- After adding "config" interaction from 2nd placement, when the config button gets clicked, it should showing wizard instead of popover (07- 1 - widget settings.png, 07- 2 - widget settings.png, 07- 3 - widget settings.png)
- Wizard layout must contains following elements :
* Title as text on top left
* Dots to show progress through wizard next to title (1..n steps)
* Left and right arrow added on bottom for navigation
* Next button becomes Save
* Control to allow Preview to pop out of left side of Wizard
4. Add New Design interaction to winning design (176626)
- Add "Duplicate" widget interaction in the design.
5. Create UI example for the following items :
- Text entry
- Static text
- Drop down menu
- Checkbox
- Radio button
- Chart type is a vertical gallery
6. Revise the mobile version from winning placement (176626) to follow 2nd placement design (1776649)
- Mobile should be static - so the there would be no "+"
Source Files : All source files (Base design and 2nd/3rd placement) can be found from this Google Drive link https://drive.google.com/folderview?id=0BwfkY6SJxFPidEZxbW5Kb1pyV2c&usp=sharing
Target Audience
Our target audience is a business analysts from professional company that cames from various fields like retail, field mobility, transportation and logistic that care about supporting their mobility . This application will help them see and measure how their various applications, systems or technology is performing.
Judging Criteria
- How well you combine the elements to our winning design?
- Cleanliness of your graphics and design (very important!)
- User Experience!
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Please upload JPG/PNG images in a zip file with all requested contest requirements stated above.
Source File
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (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.