wengchonc / INFO20003-A3-Group21

0 stars 0 forks source link

overview of report #2

Open wengchonc opened 1 year ago

wengchonc commented 1 year ago

The goal of this study is to improve the website for Music Swop Shop's online store. We examined four online stores for musical instrument sellers, including Music Swop Shop, by going through the primary features of online stores, and we discovered that each of the websites had certain problems. Music Swop Shop is the one with the worst issues out of the four. In the process of redesigning, we concentrated on addressing five issues that Music Swop Shop's website has: a lack of variation in font sizes, a lack of customization in terms of colour schemes or layout, an abundance of product information outside of individual product pages, inconsistent image quality, and messed-up alignment of body content due to sidebar making many white spaces. The previous Music Swop Shop website's overall design didn't meet the standards for what the majority of users would like, so we decided to entirely change it.

wengchonc commented 1 year ago

Reflection: As a result, our project did not go well. Some of the designs we planned during the redesign phase could not be built or programmed, particularly the parts of adaptation for the mobile version, and many other parts did not give out the desired outcomes. The menu icon is not where it should be, much of the text is positioned incorrectly when the screen scale is lowered, and several content containers are sticking out of the screen because they were unable to adapt to the screen scale. Despite the fact that we've already tried to resolve these issues, when the problems were discovered, there was not enough time to make a thorough adjustment, despite our best efforts to fix the text and blocks on select pages; thus, all pages besides the main screen had issues. I believe our issue this time was that we performed the screen ratio test too late, which left us without enough time to make adjustments and improvements. In my opinion, we should start building websites with mobile screen ratios first in future projects. Then adjust to a larger screen ratio since the mobile version of the website is rather straightforward, so that we may test the screen ratio after completion with more time.

wengchonc commented 1 year ago

Individual contribute(current state, so as reflection): Throughout the assignment, I have contributed a part of coding of the website including importing font style, making banner animation, a part of base styling and making part of mobile adaptation. In the report, we splitted the work so that I am in charge of the overview, list of code file and critical reflection.

wengchonc commented 1 year ago

both may need to make changes if u made any changes after this so remember to tell me, or u can just make the changes

wengchonc commented 1 year ago

List of code file(probably dont need the img, but i also add them in case): index.html: The html code of home page searchresult.html: The html code of search result page product1.html: The html code of product sample 1 product2.html: The html code of product sample 2 shoppingcart.html: The html code of empty shopping cart shoppingcart2.html: The html code of shopping cart with two items inside checkout.html: The html code of page to fill billing and information style.css: Import all the other css and font link colour.css: The css file with colour root typography.css: The css file with home pages’ font style layout.css: The css file with layout of nav and homepage’s remaining styles searchresult.css: The css file with all layout, colour and typography of search result page product1.css: The css file with all layout, colour and typography of product sample 1 product2.css: The css file with all layout, colour and typography of product sample 2 shoppingcart.css: The css file with all layout, colour and typography of empty shopping cart shoppingcart2.css: The css file with all layout, colour and typography of shopping cart with two items inside checkout.css: The css file with all layout, colour and typography of page to fill billing and information script.js: The js file with function used in the sites musicswopshoplogo.png: The logo image of Music Swop Shop photo1.jpg: The image of product sample 1 photo2.png: The image of product sample 2 photo3.png: The image of product sample 3 photo4.png: The image of product sample 4 photo5.png: The image of product sample 5 photo6.png: The image of product sample 6 photo7.png: The image of product sample 7 photo8.png: The image of product sample 8 poster_1_image.png: The image of scrolling poster 1 poster_2.png: The image of scrolling poster 2 poster_3.png: The image of scrolling poster 3 subcat1.png: The image of subcategories 1 subcat2.png: The image of subcategories 2 subcat3.png: The image of subcategories 3

wengchonc commented 1 year ago

I need to take a rest, Im really tired right now

wengchonc commented 1 year ago

IG me if have questions to ask me if i didnt respond before 11:30pm, it might be becoz ig delay or simply i missed the msg

wengchonc commented 1 year ago

nearly forgot repo link: https://github.com/wengchonc/INFO20003-A3-Group21 and live link: https://wengchonc.github.io/INFO20003-A3-Group21/