Assignment 5 – Task 3: Pre-production documents

Mind Map

This mind map demonstrates the research and distribution of creative ideas at the beginning of the pre-production stage of the project.WP_20170310_14_38_00_Pro (1)



The project will involve the production of a 4 page website based around theme – Brighton as a digital hub.  The website will consist of the following pages:

  • home (introducing the website to the visitor with its purpose explained, accompanied by images)
  • events (listing the featuring digital events in Brighton with external website links, headings and images)
  • get involved (detailing visitors how they can get involved in the events and the digital sector. A video will be embedded to this page)
  • contact us (details visitors how they can contact the website owner. Address details will be visible here)

The project manager and web developer will be Kieran Collins (myself). I will be the only individual working on the coding of the website and the pre-production stages. I will have external support from the media team at Brighton Digital Festival who will agree to let me embed their video to my website. I will also receive online support from Rob Percival – an online web developer instructor who posts video tutorials to help students build their coding skills.

The following resources will be needed for this project:

  • Access to the internet – for research and testing the coding (provided by production studio)
  • Website development training – Rob Percival’s course – “The Complete Web Develop course” and W3schools training course have been purchased and I will use these resources to build my coding skills before and during the production of the website.


Contingency plan


Change of events

When starting a project, it is important to prepare in case of a change of events. By preparing for such events, the project manager can deal with any change effectively and implement a different strategy. This can save both time and money – two factors that often have a huge impact on the success and performance of the project.

Below is a contingency plan for my project outlining possible events, the likeliness of the event occurring and how I will manage the change of event:

contingency plan

If any change of event does happen, timescales will have to change. Testing is vital stage of the production stage. I will test my website build both during and after writing the code for the website. Timescales will be managed to ensure I have enough time to test the website after completion and make any necessary amendments. If I run out of time to do this, there could be errors in the website which would effect it’s performance qualities.


Mood board

This is a mood board created featuring various logos from companies in the digital sector. This will be used as an influence for creating my own logo, which will eventually be used as the logo of my website.

Moodboard logo designs



This is a wireframe created to plan the layout of the home page of my website. This will be used as a basis for when I am producing the coding for the home page.

Homepage Wireframe


Design Concepts

Wireframe – The home page wireframe can be seen above. The idea for this particular wireframe came from the websites I had seen in the past, and through research of coding techniques, I knew what I was capable of producing. For example, video backgrounds were too advanced for me to add to my website. I choose to create the layout with no scroll to enable the content to be clear and to make it easier for the visitor to view all information. At the time of creating this wireframe, I had not chosen any colour scheme. However, I could still add the elements of the website I was planning to use.

Mood board – This design was created to provide ideas on my own logo for my website. Within the mood board, there are many different logos from various digital organisations. I chose these particular logos because of their uniqueness and use of colours and text decoration. Brighton Digital Festival, Digital Meeting and Digital Festival all used a basic image within the logo to accompany the text. This particular feature was used when I created my own logo for my website.

Website Logo – the idea for my website logo came from influence from the logos on my mood board (as already discussed). The logo has a basic, yet clean feel to it. The consistent usage of the colour blue was used because of the city’s connections to sea and it is the colour of the city’s top division football team Brighton & Hove Albion F.C. The font is consistent through the title and the slogan. The small image of a laptop was created on GIMP using different shapes and filling in with colours that matches the text around the image. This has a relevance with the digital sector and suits the mood of the logo.BRIGHTON DIGITAL EVENTS LOGO DRAFT3

Visual Design – the general appearance of my website is important to it’s success. A poor appearance can limit a visitor’s activity and interest. My idea for the appearance of the website has come from the colour scheme chosen and through visiting several other websites during research in the pre-production stage. The background colour will be white so that images, text and other elements will look neat and so that the colour scheme will remain consistent. Blue and grey will be added to the navigation bar – blue block with gray hover feature. All text on the website is planned to be in black (apart from the logo) because this looks professional and it is clear to read.


Site Map

This is a site navigation map. It outlines how a user navigates around the website. Each internal page can be accessed through the navigation bar when viewing any page. The events page contains external links to other websites. These are separated with a white box and can only be accessed through the events page.

site plan


Assets List
  • Lenovo ThinkPad T410 laptop – purchased to write the coding for the website on and design concepts.
  • Software for laptop – including:  web browser, Notepad + + and GIMP (Web browser and GIMP can be obtained by downloading the software for free legally through the internet. Notepad + + has been purchased to write the coding for the website).
  • Hire of the production studio – all assets that belong to the studio can be used once the studio has been hired. (e.g. desk for work space, notepad, stationary)
  • Digital Assets 
    • Images to be used from the public domain and obtained through the internet
    • Website graphic to be produced internally by myself
    • Video made by media team at Brighton Digital Festival


Risk assessment

The below table is the risk assessment. It ensures health and safety standards are acknowledged and respected. It outlines all of the possible hazards, how could be harmed, possible scenarios and impacts of the hazard and the action that myself and other individuals in the production studio will need to take to ensure the hazard does not take place and cause any harm.

risk assessment



There are several reasons why this project will be successful. Firstly, there have been several purchases made already that have been planned to be used in order to complete the project. A laptop, software and training courses have all been purchased which allows myself to begin the coding and production of the website. All pre-production will be completed outlining the purpose and potential quality of the website. Timescales have been planned for both the pre-production and the coding stage of the project. This has allowed time for the project to be completed effectively and sufficiently. A risk assessment and a contingency plan have been completed in order to ensure that any changes in the future have been prepared for and as project manager I can deal with change accordingly.

An email conversation has taken place between myself and the media team at Brighton Digital Festival in my attempt at granting permission to use their video for my website. I am optimistic this will be achieved because my website is promoting their festival which can only help the recognition of their organisation. There should be confirmation in the coming days regarding the content permission.

The visual style of the website will keep the visitors interest in the content of the website. The font type and colour will be clear to read, the images will be an appropriate size and all elements will be positioned well, typically either left, right or centre and not positioned unevenly. This improves the appearance of the website making it look more neat, clear and professional. In addition to this, the colour scheme will be consistent and to represent the theme of the website (Brighton – Digital Hub).



The budget for this project will be £1052. This will be separated into different categories:

  • Equipment – £250
  • Studio hire – £450
  • Training courses and other resources – £100
  • Wages – £252 (£6 per hour – projected hourly rate x 42 hours)


Estimated Costs

ThinkPad laptop – £230

Notepad + + – £20 

Production studio hire – £420 (£10 per hour and 42 hours in the studio)

Transport – £25

Udemy Website Development Training Course – £45

W3Schools Training Course – £30

Project Manager Wages – £252


Total Costs – £1022

Projected remaining budget after estimated costs  – £30


Production schedule



production schedule.png



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s