Challenge Summary
Welcome to the (Quick!) Hestia B2B Home & Merchandising Updates Contest. This contest is going to have a tight time-line and a quick $150 Milestone Round in preparation for a presentation this week. The goal of this contest is to UPDATE the provided Home Storyboard and create a few additional storyboards based on the provided wireframes and requirements listed.
Read the Contest Details carefully and let the Client know if you have any questions.
Contest Details Hestia B2B is always looking to give their customers a better user experience. Over the last few months the Studio Community has helped Hestia create a new user interface for their B2B Web Application. We are in the final stages of functional requirements and need storyboard updates and a few additional storyboards created. Some updates will be simple and some will require you to analyze the provided designs and figure out how to incorporate the requested items while keeping the overall graphic design consistent from screen to screen. Hestia B2B Home Page - Reference "Home-Sketch-Wireframe.jpg" - Reference "Home-Design.png" - Reference the provided "Merchandising" pages for graphic design reference on how the products and merchandising areas should look. The Hestia B2B Home storyboard needs to be updated according to the provided Home-Sketch-Wireframe.jpg. The "graphic design" should stay the same as the provided references - we are NOT looking for a new site design! We will need 2 versions of the Hestia B2B Home Version 1 - Include the right side Quick Order and OML box (you will need to edit/change the size of these areas to work within the new design and page layout) Version 2 - Remove the right side Quick Order and OML box - create a new Quick Order cartridge/module that fits within the new page layout. Header/Navigation - Use the provided Navigation (make sure it is consistent across your screens) - The storyboard content area should be 960px wide (see B2B-Home-DesignArea.png) - you will need to edit/move the navigation, product search, cart and my lists to fit the updated size. New Content Area - "Home-Sketch-Wireframe.jpg" content fits into "Home-Design.png" below the Product Search bar. - The reference areas are labeled A,B,C,D etc. A - This area links to the Specialty catalogs - This area can be separate or part of E Product navigation - Green catalog (need an icon - maybe use the one from the search results storyboard) - Lead Free catalog (need an icon) B - The FOO Banner goes here - Use "FOO-Banner.jpg" C - The Tools Banner goes here - Use "Tool-Flyer-Specials-banner.jpg" D - The Deal of the Day goes here - Use "Deal-of-the-day-banner.jpg" E - Product Navigation goes here - Existing! - Use the "Shop All Departments" navigation items F - Slideshow - The 1,2,3 refers to different slides - Edit the provided slideshow in "promotional_template.psd" to work in this area. - You MUST have numbers for the User to click and see each slide Slide 1) Services & Site Features - Use content from "Slide1-OrderSol_StateStuf_FNLnoBld.pdf" to create this Slide/link Slide 2) Information - Create a graphic for this Slide/link - Reference Hestia Link Slide 3) Seasonal/Situational - Use "Slide3-situational-seasonal.jpg" to create this Slide/link Slide 4) Branch Information - Create a graphic for this Slide/link - Reference Hestia Location Finder G - Categories - These items are links to those specific categories - We need product images that represent each of those categories - Find products here Hestia Product Catalog - Example of this type of navigation Reference Link H - Featured Products Carousel - Use the provided images labeled with "Featured-Product..." I - Featured Brands (Do not use logos in your submission - just names!) - This area would be multiple boxes of brand logos - Pull the names from here Hestia Product Catalog Footer - Keep the look of the Quick Links design but remove all the navigation items and just include: Copyright, Terms & Conditions of Sale, Terms & Conditions of Purchase, Privacy Policy. Additional Pages Residential Faucets Landing Page - Reference Residential-Faucets-Wireframe.jpg - Reference the provided Merchandising PSD files for how products, links etc should look graphically - Keep the navigation and footer consistent across screens A - Green Products - Create a graphic for this area B - Product Catalogs - Create a graphic for this area C - Specials - Create a graphic for this area D - Product Navigation - Reference the Product navigation used in "B2B-Search-Results-List.psd" E - Slideshow - Same design as the Slideshow used on Hestia B2B Home Slide 1) Eco Friendly Faucets - Create a graphic for this Slide/link Slide 2) Specific Brand of Faucets - Create a graphic for this Slide/link Slide 3) Lifestyle shot - Create a graphic for this Slide/link - Use image "T3405bn_A340bl-lifestyle1.jpg" Slide 4) Luxury Brands - Create a graphic for this Slide/link - Use the provided Residential Faucets images F - Categories - These items are links to those specific categories within Faucets - There will be links below the images (see "02_category_link_template.psd") G - Merchandising Boxes - Create links based on the content in the wireframe H - New Products Carousel - Create the design based on the content in the wireframe I - Merchandising Boxes - Create links based on the content in the wireframe - Note the Video Services and Site Features Landing Page - Reference Services-Site-Features-Wireframe.jpg - Reference the provided Merchandising PSD files for how products, links etc should look graphically - This page links from Hestia Home B2B (the Services and Site Features banner) A Services and Site Features Banner - Create this banner (does not need to be this big) B - Slideshow - Same design as the Slideshow used on Hestia B2B Home Slide 1) Organize Favorite Products to make reorders a snap - Create a graphic for this Slide/link - Reference the content in the wireframe Slide 2) It's 6AM - Do you know where your material is? - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. Slide 3) Save time on stock and service truck orders - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. Slide 4) Ordering Made easy - Just Plug, Point, & Scan! - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. C - Reference the content in the wireframe and the provided PDF's for content. D - Reference the content in the wireframe and the provided PDF's for content. - Note the Video's Resources & Requirements - Reference the provided PSD files. - You will need to work within this design to update and create your new pages. - The Wireframes are NOT to scale - you will need to assess the page size and the different wireframe areas as to what will work and look good. Judging Criteria - How well you update & create the new pages based on the provided design. - Cleanliness of your graphics and design - User Experience Stock Photography Watermarked comp photography from istockphoto.com is allowed in this contest. You must follow these instructions or your submission will fail screening: 1) You must include a completed Third Party Content worksheet. It belongs in your Submission folder/zip file -- NOT your Source folder/zip file. 2) Only use photos, and only use them from iStockPhoto. Other iStockPhoto artwork is not allowed. 3) Be sure to keep the watermark intact. If the image is cropped in such a way that the watermark is not visible, please be sure to include the entire image in your source files so we can see that it is a comp image from iStockphoto.com. Contest Deliverables Round One In Round 1 you only need to show 1 slideshow graphic per page. Hestia B2B Home v1 = Your submitted design solution for a review. Hestia B2B Home v2 = Your submitted design solution for a review. Residential Faucets Landing Page = Your submitted design solution for a review. Services and Site Features Landing Page = Your submitted design solution for a review. Round Two Hestia B2B Home v1 = Final Design. Hestia B2B Home v2 = Final Design. Residential Faucets Landing Page = Final Design. Services and Site Features Landing Page = 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 $150 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) $50 Round 1 winners and their design review from the Client.Contest Details Hestia B2B is always looking to give their customers a better user experience. Over the last few months the Studio Community has helped Hestia create a new user interface for their B2B Web Application. We are in the final stages of functional requirements and need storyboard updates and a few additional storyboards created. Some updates will be simple and some will require you to analyze the provided designs and figure out how to incorporate the requested items while keeping the overall graphic design consistent from screen to screen. Hestia B2B Home Page - Reference "Home-Sketch-Wireframe.jpg" - Reference "Home-Design.png" - Reference the provided "Merchandising" pages for graphic design reference on how the products and merchandising areas should look. The Hestia B2B Home storyboard needs to be updated according to the provided Home-Sketch-Wireframe.jpg. The "graphic design" should stay the same as the provided references - we are NOT looking for a new site design! We will need 2 versions of the Hestia B2B Home Version 1 - Include the right side Quick Order and OML box (you will need to edit/change the size of these areas to work within the new design and page layout) Version 2 - Remove the right side Quick Order and OML box - create a new Quick Order cartridge/module that fits within the new page layout. Header/Navigation - Use the provided Navigation (make sure it is consistent across your screens) - The storyboard content area should be 960px wide (see B2B-Home-DesignArea.png) - you will need to edit/move the navigation, product search, cart and my lists to fit the updated size. New Content Area - "Home-Sketch-Wireframe.jpg" content fits into "Home-Design.png" below the Product Search bar. - The reference areas are labeled A,B,C,D etc. A - This area links to the Specialty catalogs - This area can be separate or part of E Product navigation - Green catalog (need an icon - maybe use the one from the search results storyboard) - Lead Free catalog (need an icon) B - The FOO Banner goes here - Use "FOO-Banner.jpg" C - The Tools Banner goes here - Use "Tool-Flyer-Specials-banner.jpg" D - The Deal of the Day goes here - Use "Deal-of-the-day-banner.jpg" E - Product Navigation goes here - Existing! - Use the "Shop All Departments" navigation items F - Slideshow - The 1,2,3 refers to different slides - Edit the provided slideshow in "promotional_template.psd" to work in this area. - You MUST have numbers for the User to click and see each slide Slide 1) Services & Site Features - Use content from "Slide1-OrderSol_StateStuf_FNLnoBld.pdf" to create this Slide/link Slide 2) Information - Create a graphic for this Slide/link - Reference Hestia Link Slide 3) Seasonal/Situational - Use "Slide3-situational-seasonal.jpg" to create this Slide/link Slide 4) Branch Information - Create a graphic for this Slide/link - Reference Hestia Location Finder G - Categories - These items are links to those specific categories - We need product images that represent each of those categories - Find products here Hestia Product Catalog - Example of this type of navigation Reference Link H - Featured Products Carousel - Use the provided images labeled with "Featured-Product..." I - Featured Brands (Do not use logos in your submission - just names!) - This area would be multiple boxes of brand logos - Pull the names from here Hestia Product Catalog Footer - Keep the look of the Quick Links design but remove all the navigation items and just include: Copyright, Terms & Conditions of Sale, Terms & Conditions of Purchase, Privacy Policy. Additional Pages Residential Faucets Landing Page - Reference Residential-Faucets-Wireframe.jpg - Reference the provided Merchandising PSD files for how products, links etc should look graphically - Keep the navigation and footer consistent across screens A - Green Products - Create a graphic for this area B - Product Catalogs - Create a graphic for this area C - Specials - Create a graphic for this area D - Product Navigation - Reference the Product navigation used in "B2B-Search-Results-List.psd" E - Slideshow - Same design as the Slideshow used on Hestia B2B Home Slide 1) Eco Friendly Faucets - Create a graphic for this Slide/link Slide 2) Specific Brand of Faucets - Create a graphic for this Slide/link Slide 3) Lifestyle shot - Create a graphic for this Slide/link - Use image "T3405bn_A340bl-lifestyle1.jpg" Slide 4) Luxury Brands - Create a graphic for this Slide/link - Use the provided Residential Faucets images F - Categories - These items are links to those specific categories within Faucets - There will be links below the images (see "02_category_link_template.psd") G - Merchandising Boxes - Create links based on the content in the wireframe H - New Products Carousel - Create the design based on the content in the wireframe I - Merchandising Boxes - Create links based on the content in the wireframe - Note the Video Services and Site Features Landing Page - Reference Services-Site-Features-Wireframe.jpg - Reference the provided Merchandising PSD files for how products, links etc should look graphically - This page links from Hestia Home B2B (the Services and Site Features banner) A Services and Site Features Banner - Create this banner (does not need to be this big) B - Slideshow - Same design as the Slideshow used on Hestia B2B Home Slide 1) Organize Favorite Products to make reorders a snap - Create a graphic for this Slide/link - Reference the content in the wireframe Slide 2) It's 6AM - Do you know where your material is? - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. Slide 3) Save time on stock and service truck orders - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. Slide 4) Ordering Made easy - Just Plug, Point, & Scan! - Create a graphic for this Slide/link - Reference the content in the wireframe and the provided PDF's for content. C - Reference the content in the wireframe and the provided PDF's for content. D - Reference the content in the wireframe and the provided PDF's for content. - Note the Video's Resources & Requirements - Reference the provided PSD files. - You will need to work within this design to update and create your new pages. - The Wireframes are NOT to scale - you will need to assess the page size and the different wireframe areas as to what will work and look good. Judging Criteria - How well you update & create the new pages based on the provided design. - Cleanliness of your graphics and design - User Experience Stock Photography Watermarked comp photography from istockphoto.com is allowed in this contest. You must follow these instructions or your submission will fail screening: 1) You must include a completed Third Party Content worksheet. It belongs in your Submission folder/zip file -- NOT your Source folder/zip file. 2) Only use photos, and only use them from iStockPhoto. Other iStockPhoto artwork is not allowed. 3) Be sure to keep the watermark intact. If the image is cropped in such a way that the watermark is not visible, please be sure to include the entire image in your source files so we can see that it is a comp image from iStockphoto.com. Contest Deliverables Round One In Round 1 you only need to show 1 slideshow graphic per page. Hestia B2B Home v1 = Your submitted design solution for a review. Hestia B2B Home v2 = Your submitted design solution for a review. Residential Faucets Landing Page = Your submitted design solution for a review. Services and Site Features Landing Page = Your submitted design solution for a review. Round Two Hestia B2B Home v1 = Final Design. Hestia B2B Home v2 = Final Design. Residential Faucets Landing Page = Final Design. Services and Site Features Landing Page = 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.