Challenge Summary
Welcome to the Hestia B2B "Find An Order" Redesign Contest. The goal of this contest is to update the provided screens/existing "find an order" design based on the provided requirements.
Contest Details Hestia is always looking to give their customers a better user experience by providing new and up-to-date features in their B2B Web Application. For this contest we would like you to redesign the "Find an Order" page into a 2 column layout with the left sidebar utilizing the "Find an Order" filter and the "Search Result" area in the right column We are looking for a better user experience when doing order searches. The current design is confusing (layout) and many users have difficulty using the filters. We are suggesting this 2-column layout but we are open to your design ideas. Click around the attached Hestia Prototype to become familiar with the application and the current "Find an Order" design and reference the provided GUI Kit so you use the correct "UI Design" while designing your new screens. Design Requirements: Look to improve the user experience of "Find an Order". Reference the provided wireframe for our initial ideas. 1). Find an Order Current Prototype Reference: fol-prototype-3.2/find_an_order_quote.html This area need to show. - Search Input - Search Button - Select Type Checkboxes, contains these options:Draft, Order, Quote, Canceled and Credit Memo. - Date Range Checkboxes, contains Start Date and End Date. Please use current looks of datepicker in provided GUI Kit. (defaults to 1 month from your initial date selection) - Narrow Results Area (or "Alternate Search") (This area is optional/not required and should have a checkbox or radio button) - Narrow Results Select/Dropdown contains value of Job Name, Ordered By, Order/Quote. - Narrow Results Input - Search Button 2). Search Result Current Prototype Reference: fol-prototype-3.2/search_result.html - Please create separate storyboards for before and after a user does a Search. - At first load, the search result area need to filled with some description or some visual icons explaining the "Find an Order" page. Feel free to create some graphics to support the area. - Make sure you follow the current 2 column grid design - Redesign the result page to fits within the NEW 2 columns layout - Create New icon to represent items with "Draft" status (new column) - Create New icon to represent items with "Submitted" status (new column) - Search Results need ability to delete items with "Draft" Status (checkboxes?) - Search Results "423 Results : You searched for orders from 02/27/10 to 10/28/2010" needs to still be displayed in new screen - Pagination need to still be displayed. - Display per page still need to still displayed. - We're looking user friendly solutions for this page, feel free to improve it. Show us your solutions! We will provide feedback/direction for Round 2 IMPORTANT - Keep things consistent. This means all graphic styles should work together. - All of the graphics should have a similar feel and general aesthetic appearance. - Please reference the provided GUI PSD Kit to help make your design consistent across the application. Target User - Potential Customer - Current Customer Judging Criteria - How well you update & create the Find an Order and Search Result graphics and keep things consistent with the current site design. - Cleanliness of your graphics and design - User Experience 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 All Requested Contest Submission Requirements stated above. Source Files 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 modify your graphics (sizes or colors) or modify overall colors.
Round 1
Your submitted design solution for a review. 1) Find an Order (at first load ) 2) Find an Order( showing search result ) Notes.jpg: Any comments about your design for the Client NUMBER YOUR SCREENS (01, 02, 03 etc.) - its easier to review with the client.Round 2
Final All requested items 1) Find an Order( at first load ) 2) Find an Order( showing search result ) Notes.jpg: Any comments about your design for the Client NUMBER YOUR SCREENS (01, 02, 03 etc.) - its easier to review with the client.Contest Details Hestia is always looking to give their customers a better user experience by providing new and up-to-date features in their B2B Web Application. For this contest we would like you to redesign the "Find an Order" page into a 2 column layout with the left sidebar utilizing the "Find an Order" filter and the "Search Result" area in the right column We are looking for a better user experience when doing order searches. The current design is confusing (layout) and many users have difficulty using the filters. We are suggesting this 2-column layout but we are open to your design ideas. Click around the attached Hestia Prototype to become familiar with the application and the current "Find an Order" design and reference the provided GUI Kit so you use the correct "UI Design" while designing your new screens. Design Requirements: Look to improve the user experience of "Find an Order". Reference the provided wireframe for our initial ideas. 1). Find an Order Current Prototype Reference: fol-prototype-3.2/find_an_order_quote.html This area need to show. - Search Input - Search Button - Select Type Checkboxes, contains these options:Draft, Order, Quote, Canceled and Credit Memo. - Date Range Checkboxes, contains Start Date and End Date. Please use current looks of datepicker in provided GUI Kit. (defaults to 1 month from your initial date selection) - Narrow Results Area (or "Alternate Search") (This area is optional/not required and should have a checkbox or radio button) - Narrow Results Select/Dropdown contains value of Job Name, Ordered By, Order/Quote. - Narrow Results Input - Search Button 2). Search Result Current Prototype Reference: fol-prototype-3.2/search_result.html - Please create separate storyboards for before and after a user does a Search. - At first load, the search result area need to filled with some description or some visual icons explaining the "Find an Order" page. Feel free to create some graphics to support the area. - Make sure you follow the current 2 column grid design - Redesign the result page to fits within the NEW 2 columns layout - Create New icon to represent items with "Draft" status (new column) - Create New icon to represent items with "Submitted" status (new column) - Search Results need ability to delete items with "Draft" Status (checkboxes?) - Search Results "423 Results : You searched for orders from 02/27/10 to 10/28/2010" needs to still be displayed in new screen - Pagination need to still be displayed. - Display per page still need to still displayed. - We're looking user friendly solutions for this page, feel free to improve it. Show us your solutions! We will provide feedback/direction for Round 2 IMPORTANT - Keep things consistent. This means all graphic styles should work together. - All of the graphics should have a similar feel and general aesthetic appearance. - Please reference the provided GUI PSD Kit to help make your design consistent across the application. Target User - Potential Customer - Current Customer Judging Criteria - How well you update & create the Find an Order and Search Result graphics and keep things consistent with the current site design. - Cleanliness of your graphics and design - User Experience 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 All Requested Contest Submission Requirements stated above. Source Files 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 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.