Section 1. Objective and Planning

Our objectives are to create an interactive shopping website that is targeted at females, primarily at young women. We looked at websites such as Pretty Little Thing, Oh Polly and Femme Luxe to get inspiration. We plan on naming it pretty drippy ♥, with a picture of all the models on the front page and 4 pages (home, dresses, cosmetics, and help) and a search bar in the corner. For the relational database we plan on making 2 of them.One being a login system and the other being an active search-bar. The login-system will be relational because it will be joined by two tables.One containing the login details and the other containing user details.

RESEARCH

  • Firstly, because we planned on making a clothing website, we went onto popular websites amoungst our target audience to get inspiration as to what we want our own website to look like. We primarily used Pretty Little Thing, Oh Polly and Femme Luxe. After getting the inspiration we needed we started to actually build the website and make the project work.
  • The second thing we researched was how we could create a shopping cart that would save what the user had inputted into it and then calculate the price and give it back to the user. The first website we used was Shopping Cart Code Sample. We tried to use this as a guideline to base our code off but as you can see it was difficult to read and in all understand and there was nowhere that we could run the code to see the outcome of it before we could attempt to use it. We decided to use another website Shopping Cart 2. This one was far more easier to understand and there was bits and pieces from that code that we used to start to make our shopping cart. In the end, we decided to scrap the whole idea of making a shopping cart as it was too complicated to fit into our project and it didn't help us make the requirements of the project. We decided to go on a different approach.
  • Next we were trying to get the search bar to work, however we did not have enough time to finish it since we spent our time on other things, if we had more time or managed our time slightly better the website could actually work better.We decided to mention we had tried to research this part anyway. We searched sites such as W3Schools and GeeksforGeeks.
  • We then researched for how we could create the login form and make it relational. We got Login system

  • Section 2. The Process

    We made the mistake of worrying too much about the look of the website rather than the actual code and work that needed to be put in behind the relational database, and we ended up having a lovely website with a tiny search bar that did nothing thinking we were way ahead of everyone else. When we finally realised how behind we were we made a login button to make it relational, however it didn't properly work until the very end of the project. Our main complication was getting the login to actually save the inputted information. When we clicked on the login button nothing would happen. We also came across plenty of struggles such as not getting the search bar to indicate where the search would be located. What we planned on doing was typing in something into the search bar, that being the input, for example, 'blue dress' then when the submit button is pressed it will take you down to the section of the page that had a blue dress, that being the output. Which would show that the information inputted was saved. But that still didn't work for us. So we decided to leave that and come back to it at the end if we had time. The HTML, CSS and Java Script were all doable, the sqlite was the hardest part of the entire code.The relational database was indeed our downfall. We spent less time attempting to configure it and more coming up with ideas that will create a relational database which also fit in and can be applied to our website. We believe we started too complicated -for example we thought of ideas such as making a shopping cart and researched this however we soon concluded we had no time for such and that it was too complicated. Finally at the end of our project we realised our main problem for our login button not working. In our code we made it that the button was supposed to call a function when it was pressed, but we never actually made that function so nothing was happening. I think we were overthinking it so much that we didn't even realise that the problem was as simple as that. So we began to make changes to the project to try get the login button to save the information we need. Thankfully,we finally realised where we were going wrong and rectified the mistake in relation to the login button.However our sign up form which is meant to be our connection for the relational database still doesnt operate 100% successfully.However we still do have a relational database as our UserDetails table and LoginDetals table are connected joined by the use of ID. The project meets the brief's requirements, including the relational database, which we have two of (the search bar and login system).

    Snippets of our code

    Back to top


    Section 3. The Webpage

    How did we abstract our code?

    Well to make the the foot of the page we had the information, e.g(contacts, location and social media sections) all under one so we wouldnt have to use css for each seperate part, and instead for the entire footer as a whole.

    So for example, we wanted it to be listed in seperate parts (social media: instagram,snapchat,etc) would all have the same css. This made our code a lot easier for us because it prevented repetition.

    What data did we use?

    We used data from pretty little thing and our own personal input to decide the price of our products to make the most accurate predictions of what young women will appreciate.

    This is how we used computational and non-computational tools to collect, store, analyse and present our data.

    Back to top