Proposal Summary
This proposal covers UI development to Update the PLP page and my order form of the website based on the shared design for the SCA webstore for Point Australia Pty Ltd-NS/SCA
Requirement
Update the PLP page of the website based on the shared design
- 1 The order form page should be changed as per the format provided.
Original order form format
- 2.Revised order form format
Our Solution
Order form Updates
1. Order form page-width width set to 100%
We have checked the revised format in the order form. As per the new format we need to increase the width to 100% of the screen in my account section and also need to add appropriate left and right paddings to my account section. Thus, the new changes will affect all the pages in my account section. So, there will be a slight variation can be seen in all my account sections like Overview, Billing, My Wishlist etc. A few Sample screenshots are added below.
Overview section after order form updates
Billing section after order form updates
My Wishlist section after order form updates
If the changes are acceptable, we can go with this.
2.Unit and stock message need to be aligned horizontally next to the item name
We need to move the unit and stock message to the right of the item name, for that we need to add some padding and CSS properties. We also noticed that 3 items in one page can be revised to more than 4 items in one page.
3. Need to display more than 4 item on a order form page
For desktop we can display up to 6 items we have done some corrections reduced image size, remove text paddings div hights etc.
A sample screenshot of order form after the updates is added below
Screen-width-1920 –up to 6 items
For laptop we can display Up to 5 items
Screen width-1440
Limitations/Terms and conditions
For the order form changes, there will be a slight variation in other my account sections as same as the sample screenshot provided.
My Wishlist section after order form updates
Overview section after order form updates
Billing section after order form updates
We can do one thing, we will first do all the changes as in the mock-up in SB first and you can see how the other page changes, so you can decide if any changes are required for other pages, if any changes required for other pages, we will consider it as extra.
- It is possible to display more than 4 items in the order form page.3 items in one page can be revised to more than 4 items in one page.
- Changes has been made only in specified screen width.
- We will develop a UI section based on the current theme and any additional changes to the UI or functionality will be considered extra.
- We have considered only the desktop grid view as per the mockup, we will change the mobile view accordingly. For more changes in the mobile view and other views like list view it will be extra.