On the Add page, add the following fields (all being optional):
- Color (Primary): . Not sure if you can have a multi select on a picker wheel but something similar is desirable).
- Color (Secondary):
On the Catalogue page, add values from new fields above. Also change the name of the page from Catalogue to "Product"
On the Order page, display the existing orders and give users the ability to create a new order (see the mockup with List of PO's at the top).
The the app will launch the Create PO screen (see Create PO mockup).
On create PO screen, add a text field for Company Name and Email Address. Then add a Delivery Date as a date picker wheel. Then a button to Add Product (instead of Start Scanning). This will launch the barcode scanner. After a product is scanned the app will open a Add Product Details screen (see mockup with 3 Button Polo at the top).
The user will have the ability to select the product color (picker wheel from the values that were entered for that specific product) and then add the quantity of each size from the sizes that were added and available. I chose the + and - buttons to give users an easy interface to increase or decrease the quantity, which should update the text box with the number in it. Users should also have the ability to enter a value directly in each quantity box. Then there needs to be an Add to Order button at the bottom. This will add all of the quantities for each size and multiply it by the price of the item. The user will be taken to the PO Summary screen (see mockup and this is the current order screen that you built) and the new product will be added to the bottom of the order.
The user can then click the Add Product button to add another product which will again launch the barcode scanner screen, allow the user to select color and quantity per size. At the bottom of the PO Summary screen, add a button for Finalize PO.
This will open a new a new screen that will have a back button and will have the wording to "Transmit PO and email to:" followed by a text box for a user to type an email address. Then there will be a button to "Submit" the order. This will cause an email to be sent to the email address with a list of all,of the items on the order, quantity of each size, Unit Cost and the Total Cost for each product, and then an order total at the bottom.
Ok I've update the Add Product mock-ups. I had to create three mockups that are really meant to be one scrolling screen. The arrow indicates that the screen continues to the next mockup.
For the Color(s)/Pattern section, the user must click on the square (it should say "Add"). Then I created a pop up to capture the pattern (picker) and colors (multi picker) and click Save. The colors that are selected should be used to fill the color(s) the box. Then the user can click on the next box with "Add" and continue entering the color options available for the product.
As you can see, I also wanted Gender options listed, as well adding Category (picker with values: Dress, Jeans, Button-up, Pants, Jackets, T-shirt, Sweater, Blouse, Skirt).
I will email wireframes.