Create a desktop and mobile-based shopping website page with interactions (Hint: Use adaptive views)
Use iPhone template and solve following assignment.
1. Your Shopping page should have a hierarchical arrangement as uploaded before ( I will provide that). Keep one icon for cart as well. You can either download picture of a cart to use or make your own icon. Also, show a message ‘0 items in cart' on the home page.
2. Clicking on individual tab shows you the list of included menu as a modal window (scrollable) on the same page. Include ‘X' to close the modal window.
3. Log in and show welcome ‘Your Name' in top right corner. Include ‘Login' as a link; not as a button.
4. Include a logout linkin front of the welcome message. Make welcome message disappear and ‘Login' link active when clicked on ‘Logout'.
5. Only make the TVs and Microwave ovens in the ‘Appliances' dropdown list active.
6. By Clicking on TVs, you are taken on a different page with a list of TVs (Show 5 TVs). By Clicking on Microwave, you are taken on a different page with a list of Microwaves (Show 5 Microwaves). On these pages, include buttons ‘add to cart' for each TV and microwave in the list.
7. Clicking on each item in the list, a modal window appears which has an image carousel (4 pictures each) and scrollable properties of the product. Image carousel has left and right arrow buttons (semitransparent on image and functioning). The images are also scrollable to left and right by swipe action. There is a separate button ‘Add to cart' on this modal window. Use the same 4 pictures for all the TVs and Microwaves. Include ‘X' to close the modal window.
8. Every time you click on ‘Add to cart', increment the number by 1.
9. Make sure that you design a color scheme for your product and keep in consistent.
10. Create a splash screen for your iPhone prototype and app icon.