Challenge Summary
Welcome to the VELOS - FAST Widget Manager Challenge - Series Part 7 challenge.
In this challenge, we are looking for your production of a widget manager screen, based on the Velos style guide.
VELOS is a global leader of shipping services. This application will be used to optimize routes for trucks, help truck drivers with their task management, help dispatch personnel track their trucks’ location and status.
We’re looking forward to your submissions!
Round 1
Submit your initial designs for Checkpoint Feedback
1) Screen #1 - Widget Manager
2) Screen #5 - Tips Widget Configure Modal
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client.
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Your Final designs for all the required designs with all Checkpoint Feedback implemented.
All five (5) screens listed below as required for this challenge.
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client.
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
This is challenge #7 in a larger series of design challenges, which will be used to design new application interfaces, over several weeks.
We have provided rough sketch mock ups of the required screens. Basically this is a single interface screen design with some alternate state screens (drag / hover / tooltip / etc) and one modal form.
Design Considerations:
We would like you to consider the following while creating your design.
Use the provided base template - Your designs should fit exactly with the established style of the Velos application, per the provided reference screens.
Use Helvetica or Arial fonts in the styles established across existing screens.
Challenge Assets:
We are providing the following resources:
1. wireframes.pdf | these illustrate the required screens / flow to cover in this challenge
2. c3 final screens.pdf | these provide some idea of the elements which have already been established, plus typography & color usage
3. velos colors v2.png | this is the color scheme / hex values to use
4. 908.pdf | this is an old submission (before content / concept was updated) but the client liked the overall look of it, though they wanted the “my dashboard” side to stand out from the avail widgets side.. you can reference it but do your own design here
5. template.psd | this is the template to use for your screens AND we left a content layer in there for you to reference, if you like
Required Screens:
We need below screens to be designed for this challenge..
Screen #1:
All content seen in page #1 of the wireframes PDF. note that the icon styles are up to you but each widget & tab on the right side needs these three: clone, edit, delete
Screen #2:
Just a simple hover state for available widget selection (tip/lift history widget) as seen in page #2 of the wireframes PDF (note: do NOT include the hand seen in the WF! this is only shown to illustrate actions in the wireframe)
Screen #3:
Showing the drag state for a selected widget (tip/lift history widget) as seen in page #3 of the wireframes PDF (note: do NOT include the hand seen in the WF in your screens!! this is only shown to illustrate actions in the wireframe)
Screen #4:
Showing the tab naming popup as seen in page #5 of the wireframes PDF
Screen #5 :
This is the edit / configure widget modal which will popup over the content with options to save & cancel, as seen in page #7 of the wireframes PDF. The content required for this form is:
• “widget name” text input (default to “Tips/Lift History” in this text area and show the cursor in here / ready to edit)
• “regions / divisions to include” section with two drop selects - show the first one as “All Regions” selected (active) and the second one and “All Divisions” (grayed out / inactive)
• “trucks to include” section with a drop select and “All Trucks” selected
• “date range” section with “Over the past (drop select with “4 Weeks” selected)”
• “Alert” section with “Alert me by email if (drop select with “below” selected) (drop select with “3” selected) per hour”
• cancel & save buttons
WINNER NOTE: The winner will be asked to create one alternate view of screen #1, showing a different available widget group open
Target Audience:
- Business professionals (working on a desktop machine) managing their dashboard widgets
Judging Criteria:
- How well you cover all content included in the wireframes
- How well you visualize the data in a logical manner
- How well you incorporate any new elements so that they work seamlessly with the existing style tile
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:
Submit JPG/PNG for your submission files.
Source:
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file.
Final Fixes:
As part of the final fixes phase you may be asked to update the text in your design to reflect more accurate data. You may also 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.