Challenge Summary
Welcome to the FAST!! Hestia B2B "Find Your Transactions" Update Contest. We recently updated the design of "Find Your Transactions" now we need your help updating and designing some new UX features.
FAST!! Milestone - Let us know if you have any questions!
Round 1
Your submitted design solution for a review.
Capture the "Find Your Transaction" Search Results/UX Updates steps for a client review
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
Final Design - All updated screens and UX steps
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 improve the "Find Your Transaction" user experience by adding and designing the requested updates.
User Experience Update/Background
This contest is focused on the Search Results of the "Find Your Transactions" page. Hestia customers would like to see all of their orders viewable by "Job Accounts". We currently do not mention anything about "Job Accounts" on the "Find Your Transactions" Search Results page. We need a way that when viewing the search results page customers can click a button that will reorganize/display the information where the orders are displayed by "Job Accounts".
Reference Files:
- Hestia.B2B.Find+An.Order.PSD.Update > Please Use this PSD as the base of your submission
- Hestia.B2B.Account.Payable > My Account Payable Graphic Source
Required UX Updates
1). We need a way to show Search Results organized by "Job Accounts".
2). When the (button/link/UX interaction) is clicked it will show Search Results by Job Account names (Main Account, Job Account 1, 2, 3, 4...).
3). The user can click on a Job Account, the Job Names tied to that Job Account will expanded below it alphabetically.
Reference Image: Hestia.B2B.Account.Payable screens
- Here is how the fuctionality/screens would work
--- Customer clicks "Show Job Accounts" interaction
--- They see just Job Account Names (Main Account, Job Account1, Job Account 2)
--- Customer clicks a Job Account Name, it opens and displays Job Names
--- They see below Job Account Names, Job Names ( Little Creek, Next Nob..)
--- Customer clicks a Job Name (Little Creek), it opens and displays all orders associated with that Job Name
--- They see below the Job Name Little Creek (Order #1, Order #2, Order #3) at this level they will have all the columns from the Search Results page
4). The user clicks on a Job Name, search result related to the Job Name will expand below it
5). All columns from existing search result design need to show all the information as previously and have all the same functionality.
6). Search result should grouped by their "Job Name". Refer to Hestia.B2B.Account.Payable/5. AP (a job name or 2 expanded).PNG
7). Users need to be able to get back to their original Search Results view
8). Modal pop-up window if the user tries to delete a draft or quote. The message asks the user if they are sure they want to delete the draft or quote
- You must use existing modal window design, refer to the provided GUI Kit
9). We need a button/link/interaction that will allow me to download the Search Result as a Spreadsheet.
- Show where this should be placed on the page
- The functionaliy of this user experience should be obvious to the user
Additional Information:
Expanding on what the relationship is of the accounts:
- All customers will have a MAIN ACCOUNT
- Some customers will use one or many JOB ACCOUNTs
--- Used for billing purposes
--- Job accounts are maintained and named in the backend by our company associates
- Some customers use the JOB NAME field on orders as a descriptor
--- Not officially a JOB ACCOUNT
--- Job names are maintained and named by the customer
--- There are sometimes misspellings or variants on a Job Names
Example:
ABC Plumbing Total Account breakdown:
- Main Account - $2,400
- Elm Street Hospital - $31,000
- Holiday Inn on Jefferson - $19,500
ABC Plumbing may break down the Job Accounts with specific Job Names to further identify what the order was for:
- Holiday Inn on Jefferson > this a Job Account
---- 2nd floor plumbing > these below are Job Names
---- Pools and spas
---- Restaurant
---- Pool & spa
---- Plumbing for 2nd floor
IMPORTANT
- Create screens/click-steps that explain the above user experience
- 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 make your design consistent across the application.
Target User
- Potential Customer
- Current Customer
Judging Criteria
- How well you update "Find Your Transaction" search results steps 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.