Challenge Summary
Welcome to the Hestia B2B "Page Conversions" Storyboard Contest. The goal of this contest is to review the provided Hestia B2B Application screens and convert them to the "New" User Interface (UI) graphics.
At the end of this contest the Client is looking to have a clean set of updated Storyboards capturing all the current page requirements and any new suggestions you might have to improve the User Experience.
Read the Contest Details carefully and let Hestia know if you have any questions.
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. Over the last few months the Studio Community has helped Hestia create a new user interface for the B2B Application. Hestia now needs to convert all the other areas of the B2B Application to the new look and feel. As part of this contest we would like you to analyze the provided screens, update them to the new look and see if there is any room for User Experience refinements. Site Tools Navigation Links View Accounts Payable - Reference "Accounts-Payable.png" - We need this page in the new design - No left side product list (reference 07-MyList-Sub-Categories.psd) Get a Copy of Statements - Reference "Account-Statement-01.png" - This screen needs some UX help - we are open to your suggestions. - The User is presented with a list of Accounts - They can select multiple accounts to have past statement emailed to them. - Once a User selected the accounts they wanted statements for they could then pick a time frame and hit "email" (see "Accounts-Statement-02.png") - We would like to change the "The following statements may be available" area to 30,60,90, over 90 day time periods. - No left side product list Manage my product codes - Reference "Manage-My-Product-Codes.png" - This screen needs some UX help - we are open to your suggestions. - Currently this page lists 1,2,3 items - the problem is these are all different items and not really a 1,2,3 step process. - There are 3 separate things you can do on this page - we need better organization/layout of these options 1) Upload codes to Hestia 2) Download codes from Hestia 3) Update a single product code - When a user does a search for a product code they see "Manage-My-Product-Codes2.jpg" - They can then select a product and they see "Manage-My-Product-Codes3.jpg" - No left side product list Orders Navigation Links View Purchase Summary - Reference "View-Purchase-Summary-Modal.png" and "View-Purchase-Summary.png" - A User clicks on "View Purchase Summary" link and they are presented with a Modal window (see "View-Purchase-Summary-Modal.png") - We need an updated "Modal" window design or this can be a normal web page - Once a User chooses a time period they are presented with their results (see "View-Purchase-Summary.png") - We need all this information in the new design - No left side product list (reference 07-MyList-Sub-Categories.psd) Upload a Product Spreadsheet - Reference "Upload-A-Product-Spreadsheet.png - We need all this information in the new design - No left side product list Quick Order "More" Page - Reference "Quick-Order-List.png" - A User arrives on this page from the home page when they click "+ More Products" under the "Start a Quick Order" area. - We need all this information in the new design - Keep the left side product list Additional Site Links "Help" Links - All of these "Help" pages should have a similar template Browse FAQs - Reference "FAQ.png" - We need this information in the new design - You can "Greek" this information - just show us how similar information should be displayed - No left side product list Contact Customer Service - Reference "Customer-Service.png" - We need this information in the new design - No left side product list Contact My Salesperson - Reference "Contact-Us.png" - We need this information in the new design - No left side product list Terms & Conditions - Reference "Terms-Conditions.png" - We need this information in the new design - You can "Greek" this information - just show us how similar information should be displayed - No left side product list Resources & Requirements - Reference the provided PSD files and design the requested pages in the "New" look - DO NOT redesign the site - keep things consistent. Judging Criteria - How well you create and update the requested Hestia B2B pages - Cleanliness of your graphics, design and ability to stay within the given design reference. - Usability enhancements (if needed) Contest Deliverables Round One View Accounts Payable = Your submitted design solution for a review. Get a Copy of Statements = Your submitted design solution for a review. Manage my product codes = Your submitted design solution for a review. View Purchase Summary = Your submitted design solution for a review. Any Help Page = Your submitted design solution for a review. Any additional pages you would like feedback on. Round Two All Requested Pages = Final Design. 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 fonts (sizes or colors) or modify overall storyboard colors.
Round 1
At the end of Round 1, the Client will choose five (5) Round 1 winners, each will win $100 as Round 1 Milestone Winners. These winners and any member who had a passing submission in round one will be eligible to compete in Round 2 for the additional $1250 in prizes.Round 2
Round 2 will start with the announcement of the Five (5) $100 Round 1 winners and their design review from 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. Over the last few months the Studio Community has helped Hestia create a new user interface for the B2B Application. Hestia now needs to convert all the other areas of the B2B Application to the new look and feel. As part of this contest we would like you to analyze the provided screens, update them to the new look and see if there is any room for User Experience refinements. Site Tools Navigation Links View Accounts Payable - Reference "Accounts-Payable.png" - We need this page in the new design - No left side product list (reference 07-MyList-Sub-Categories.psd) Get a Copy of Statements - Reference "Account-Statement-01.png" - This screen needs some UX help - we are open to your suggestions. - The User is presented with a list of Accounts - They can select multiple accounts to have past statement emailed to them. - Once a User selected the accounts they wanted statements for they could then pick a time frame and hit "email" (see "Accounts-Statement-02.png") - We would like to change the "The following statements may be available" area to 30,60,90, over 90 day time periods. - No left side product list Manage my product codes - Reference "Manage-My-Product-Codes.png" - This screen needs some UX help - we are open to your suggestions. - Currently this page lists 1,2,3 items - the problem is these are all different items and not really a 1,2,3 step process. - There are 3 separate things you can do on this page - we need better organization/layout of these options 1) Upload codes to Hestia 2) Download codes from Hestia 3) Update a single product code - When a user does a search for a product code they see "Manage-My-Product-Codes2.jpg" - They can then select a product and they see "Manage-My-Product-Codes3.jpg" - No left side product list Orders Navigation Links View Purchase Summary - Reference "View-Purchase-Summary-Modal.png" and "View-Purchase-Summary.png" - A User clicks on "View Purchase Summary" link and they are presented with a Modal window (see "View-Purchase-Summary-Modal.png") - We need an updated "Modal" window design or this can be a normal web page - Once a User chooses a time period they are presented with their results (see "View-Purchase-Summary.png") - We need all this information in the new design - No left side product list (reference 07-MyList-Sub-Categories.psd) Upload a Product Spreadsheet - Reference "Upload-A-Product-Spreadsheet.png - We need all this information in the new design - No left side product list Quick Order "More" Page - Reference "Quick-Order-List.png" - A User arrives on this page from the home page when they click "+ More Products" under the "Start a Quick Order" area. - We need all this information in the new design - Keep the left side product list Additional Site Links "Help" Links - All of these "Help" pages should have a similar template Browse FAQs - Reference "FAQ.png" - We need this information in the new design - You can "Greek" this information - just show us how similar information should be displayed - No left side product list Contact Customer Service - Reference "Customer-Service.png" - We need this information in the new design - No left side product list Contact My Salesperson - Reference "Contact-Us.png" - We need this information in the new design - No left side product list Terms & Conditions - Reference "Terms-Conditions.png" - We need this information in the new design - You can "Greek" this information - just show us how similar information should be displayed - No left side product list Resources & Requirements - Reference the provided PSD files and design the requested pages in the "New" look - DO NOT redesign the site - keep things consistent. Judging Criteria - How well you create and update the requested Hestia B2B pages - Cleanliness of your graphics, design and ability to stay within the given design reference. - Usability enhancements (if needed) Contest Deliverables Round One View Accounts Payable = Your submitted design solution for a review. Get a Copy of Statements = Your submitted design solution for a review. Manage my product codes = Your submitted design solution for a review. View Purchase Summary = Your submitted design solution for a review. Any Help Page = Your submitted design solution for a review. Any additional pages you would like feedback on. Round Two All Requested Pages = Final Design. 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 fonts (sizes or colors) or modify overall storyboard 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.