Challenge Summary
Welcome to the Hestia B2B Find An Order Enhancement Contest. The goal of this contest is to update the "Find An Order" and "Online Order Status"screens/existing designs based on the provided requirements.
Round 1
Your submitted design solution for a review.
1) Find an Order Improvement Screen(s)
2) Find an Order Search Result Improvement Screen(s)
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 Improvement Screen(s)
2) Find an Order Search Result Improvement Screen(s)
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. Over the last few months the Studio Community has helped Hestia create a completely new user interface for the B2B Application.
For this contest we would like you to update the NEW "Find an Order" pages with some new requirements. Read the details below. Click around the attached Prototype (fol-prototype-find-an-order.zip) to get familiar with application and use the GUI Kit (Click this to download) to understand the existing UI design.
Find an Order Improvement Items
We recently completed the new design for "Find an Order" - we need to make some quick imporvements.
1). "Date Range" needs to support 3 month format.
- Three month range needs to be auto-populated into the date range fields (End Date should be today's day and Start date should be 3 months before that)
- We need new design for this, based on current style. Please check the prototype.
- We need you to stick with current calendar style, but make them updated using 3 columns format.
- We like how how the attached calendar works. The calendar need shows 3 months calendar and functions the way we want our calander to work. The calendar shows 3 months and highlights of those three months that timeframe you are referenceing. Refer to screenshot: Calendar.png
- By default 3 month value show in Date Range input.
- "Date Range" in the sidebar, and "Date Range" in content section (07_assist.png) need update. You should update/create new screens to explain this situation.
2). We attached a jpg wireframe of what we are thinking of for the left hand search area design - we need you to create/update to the correct graphics. We need to find a solution for OPTIONAL CHOICES. We think Optional Choices will be hidden until the user expands it.
If "Order" option selected at "Search For" section in the top, the select/dropdown will need reflecting the related options to help narrow the options. Screenshot: FindTransactionLeftSearch.jpg
Below is a breakdown of choices. Once the user selects a choice, they have to input the actual term they are searching.
Please create screens to explains these situations.
Orders – Ferguson PO#, Customer PO#, Order #, Job Name, Ordered By
Quotes – Quote #, Job Name, Quoted By
Credit Memo – Order #, Ordered By, Job Name, Credit Memo #
Cancelled – Cancelled by, Order #, Job Name
3). All inputs needs to remain in the sidebar after search performed.
- We need new screen to explain this.
- When a search in preformed currently, then click "Search” button, all the information is cleared from the fields (all the boxes are empty on the left hand side, we need to keep those populated so that the user can look over and see what was searched).
4). Search Result pages needs a way to indicate to a customer that a quote has been updated/changed.
Refer to latest design in find_an_order_quote_results_filtered.html and find_an_order_quote_results.html inside fol-prototype-find-an-order
- We like to see if there are any solutions for how we can notifiy the end user on the Homepage to let them know updated are available for them. (One idea is a badge/notification need the "Orders" Button on the homepage, see attached: Orders Badge.jpg, it’s circled in red)
- Please show us best design/placement
5). In search results pages, we need a function that will take the user to the beginning of order inquiry to start a new search.
- You can create new graphic or only text link on search result pages
- Show us the best placement
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 the Find an Order, Search Result, Homepage pages 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.