Here are screenshots from the finalised web app project. 

As part of the brief, we were asked to create a web app for a targeted audience that would be able to connect to a database. From the front end, the user should be able to view posts, register for an account and be able to post to the database. 

As a group, we have created SUBU (Student Offers for Bournemouth Uni), a play on SUBU, the Student’s Union of Bournemouth University. 

The website allows people to view, sign up for an account and post offers and discounts in the local area around Bournemouth. I think the idea is a strong one because it has a clear target market of University students and could be localised to other universities very easily. 

The group consisted of myself, Hallam and Robin and I feel that we worked well in a team. This was my first time building a website from scratch and I didn’t feel that confident with coding because it’s something i’ve never properly done before, however I got myself stuck in and being in a group helped a lot.  I do still feel as though I need more practise with code, especially CSS, as that is the area I struggled with the most I think. We used Bootstrap to help with the CSS so it wasn’t too difficult. Bootstrap is useful, but in review, it would look better if we had coded the CSS ourselves, as Bootstrap has become quite a generic framework to use. 

I enjoyed working with the database, I found PhpMyAdmin very easy to use, and PHP coding I found difficult but I found that after sitting down working it out logically helped me understand it.  

I believe we have met the requirements outlined within the brief successfully and overall I am pleased with the end result. 

After creating the new databases for users to post into about the businesses, we have linked this database to our existing code for the website. Using PHP, the final result now allows users to register for an account for the site, login and post to the website. 

Today, we added the PHP to allow the information from the database to be displayed to the user, similar to a Twitter feed, with the newest post appearing at the top. This allows the user to see the posts that other users have made to the site. We have also added the functionality to filter the posts by category. 

We have found an error in the text box that users post into, we found it does not allow certain characters, such as apostrophes. We will investigate further to solve this issue. Other than this, I think we need to just make it look slightly better using CSS, then the project will be complete. 

Here is some screen grabs of how the site is currently looking. We have combined the code that I had created for the “about the team” page with the code that Hallam created for the rest of the site.

The whole site now links together and has continuity between the pages. We’ve also added a sign up page where users can register, so they’ll be able to post information to the website for other users to see.

The next step is to start looking into PHP and linking it to a database, which I will be working on.

One of my colleagues from my group drew some ideas for the branding for the website. We wanted to base the overall brand something similar to the existing SUBU website, as it would be familiar to the users and the demographic of students. We shall be discussing which logo to use in further meetings. 

As part of our brainstorming session, I was given the role of transforming our hand drawn ideas about the layout into digital images. I used Inkscape to do this, which is a free vector graphics package. We will decide on a final layout for the page in a meeting in the near future. 

In our group meeting, we decided to brainstorm about what the “About the team” page will look like. To do this we drew a few page layouts which can be seen above.  We decided to keep it relatively simple. At the moment, we currently havent selected one particular layout to go with, that will be decided in the near future. I plan digitally draw out these layouts using Inkscape. 

Here a few screen grabs of vectors that I created in Inkscape to trace out some of the Facebook icons to be used as part of my poster. I did the same as I had previously done and used the layers tool to trace over images downloaded from Google. I then changed around the fill and stroke settings to change the colour of each element. I then grouped element together and added it to my poster.