Project : WatchitWall

Project summary and evaluation:

In this project I used video editing, coding, photoshop and research to create a brand and a booking website. I used many skills throughout this project as it made up my final products which was we application. I used primary and secondary research to see what other outdoor cinemas look like and work and how immersive rooms operate.

Research helped me build the watch it wall brand as I understood what events we offered better when I experienced the immersive room and had more creative ideas after being there. My idea generation throughout the project is displayed in my research and preproduction PowerPoints that are linked below.

Research also allowed me to make an ideal layout for my web app. This made my building process easier as I had a design ready by the end of my pre-production research. The web app was the hardest part of the project as I had to change the fonts because after getting feedback the font, I used we deemed as outdated, and I was told that good typography would make my website more professional and aesthetic looking. I carefully chose my next fonts and watched videos on typography in web design to ensure my website looked more modern. After making these changes my website looked more professional and showed the modernness of the company. My second issue was the booking system as I created a basic form following a tutorial however I realised that I wasn’t getting enough information on the users activity or what they were booking for so I added more columns on my table to see the tickets bought, location and the movie they wanted to see. After adding that to my website I thought about the UX and how it would be bothersome putting in your location after going through the webpage, so I used parameters to collect the variable and post it into the PHP on request.

When creating the UI my main goal was making it accessible on different devices as the purpose was to have a booking application that can be used anywhere. I started by creating the computer design ensuring each function worked as desired and the user could interact with the website without any issues occurring like links leading to the wrong webpage. I added a burger menu as it will make the website easier to use on mobile devices therefore making the website accessible for everyone.

My building journey can be found in my build PowerPoint linked below.

Compared to my initial ideas I did not use an account system as my feedback data showed that it could be annoying receiving emails, and they might go as a one-time event so there would not be a point to having an account. I improved on this idea by making users book without having an account and only putting the key information needed for both the admin and user like their name and email.

My initial ideas:

After reading the briefing for the project I came up with my initial ideas. My first initial idea was the application I would be creating, I think a booking system that appears when you select a certain movie would work best since it is simple and easy to navigate. The process would be a user selects the event they would like to attend and then add their tickets into their basket and then check out. This works because users can easily spot the movie they would like to go to and instantly buy tickets.

 Also having a log in / sign up page will allow users to check their bookings and get exclusive offers. I would make this application with HTML, CSS JavaScript, PHP and MySQL. Another idea I have is the colour theme. Since the company use white-screen sheets for their screening I think the theme for the application should be beige and red since I link those colours to cinemas. Beige because the sheets and red because seats are usually red, and the colours could also be linked to popcorn which is commonly served at cinemas.

Also since the event will hold a large capacity i think giving each guest high quality wireless headphones will allow them to hear all the dialogue in the movie without any interruptions.

Research Portfolio :

Research portfolio WatchitWall.pptx

Preproduction Portfolio :

Assignment 3 preproduction portfolio.pptx

Build Portfolio :

Ass 3 - Task 3 - Build Portfolio (1).pptx

Final Website Code Folder

assignment 3