development of website page 2 ( Top stories)

    Development of website page 2 ( Top stories)

To begin with, the 2nd page of my website includes mostly the use of imagery. the reason for this is because i wanted to create a 'storyboard' idea of the actual main story, being, 'Bethany's fashion trip to London'. I feel creating a moodboard/ storyboard of images enables the 'creative' idea of 'fashion' to be expressed. therefore, i have thought carefully about how i can emerge the creative idea into my web pages.

The images are taken of both location and portraits of the model. So, i have experimented with different images with unique compositions. The images are all taken, using different angles, such as mid shots, close ups etc...Plus, they have different colour tones and filters to them. So, they create a positive contrasting affect. using both colored images and black and white. As well as using photography techniques. Such as, 'low key' lighting in the photograph to create the 'Silhouette' affect made. Although, the audience can recognize this is a portrait of the model because of the structure of the silhouette. Contrast is given against the websites background colour ( pale blue). Therefore, both image and background stand out.

The regional idea is given, although the story is about a trip to London. This clearly stated in the small paragraph of text in between the images at the bottom of the page. It states, " Bethany Coyles from the North East". Therefore, they can still notice the website is from the regional company of 'Essence'. However, the story is about a National Trip. 

The web page is almost a photo journal, as the images are of the trip, rather than model images. This connects to the idea of regional magazines/ web pages. They tend to be more 'natural' in the style of pose. Whereas, National products are more aimed to be centre of attention. Although, i used amore serious image for my home page, as it engages the audience due to the eye contact made. 

I have experimented with different background shades and images layouts. the reason for this, was so i could find the best colour tones that would contrast and represent creativeness. As well as this, before i dragged the images into 'WIX', I added filters and edited the images in photoshop to make them more sharp, bold and of a higher quality. An example of this is changing the image into black and white.

I am pleased with my overall outcome for my 2nd page of my website. This is because it is simple, yet complex, in that it uses a lot of images and less text. This is a way of persuading the audeince to look at the rest of the website because it doesn't have a lot of text, which they have to read. Plus, the genre of audience i am aiming my web page at is of a young generation, so they would prefer to look at imagery, rather than read a lot of text.

website deconstruction

Development of website home page

        Development of website home page...


To begin with, i started the process of creating my Home page using the website template from 'Wix'. This supported the design of my template, in that i could select the style of template i wanted, using the 'search tool' and typing in the word, 'Fashion'. This came up with a variety of fashion templates that i could use to create my web page.


Moreover, once i selected my template i decided to use, i continued the process of designing this. The main technique to doing this was adding text by using the 'edit' tool. Also, dragging and dropping images into the the 'wix' template. This enables you to place images in the layout given and allow the layout to look spacious and proffessional.




Selecting fonts is the same as using the drop down list from 'Photoshop'. Also, selecting a fill colour and font colour is in the 'edit option. So, selecting edit, on each given area of the web page, you can change it's outlook.

Personally, i think the website 'wix' is helpful in that you can choose your template and create your website for any project. I only intend to create the first 2 pages of a website but 'wix' enables you to create all the pages from your navigation bar. Therefore, the webpage looks proffessional and appeals to the audience.

i like how i have used colours that connect to my magazine and billboard and make the whole product have a link.  This expresses the company, 'Essence'.

Development of billboard

        Development of Billboard...

Creating the billboard is one of the easiest processes for my media product so far. This is because the billboard does not consist of as much information as the the magazine itself. The Billboard is more of an advertisement to persuade the audience to read the magazine or attend an event. In this case, for my billboard i am advertising a fashion event. This may persuade the audience buy an 'Essence magazine' to find out more about the event or look on the web page. The reason why the audience know that the billboard advertise 'Essence' is because i have used the logo, in which i repeated in the pages of my magazine, in order for the audience to get familiar with it.

To create my Billboard, i began by creating an A4 international paper sized layer like i did for my magazine. Although, i used the idea of creating my double page spread, by rotating the page 90 degrees. This allowed the billboard to be landscape rather than portrait. So, it looks official.

Continuing on from this, i found an image from google images, of the North east ( Newcastle bridge) that would advertise the regional idea of my magazine/ brand. Therefore, the reader does not mistaken the brand for being national. I done this by dragging the image into photoshop, selecting around the area with the 'rectangular marquee tool' and then using the 'edit copy, edit paste 'technique onto the layer i was working on. After this, i altered the opacity level of the image by altering the 'opacity percentage'. Changing it from 100% to 35%. I thought of this idea because i did not want the image to take the main focus away from the other features i intended to add to the billboard. Such as the main image and text. Also, because i wanted this image to be a background image.

Leading on from this, i then added the title 'Essence Fashion'. Using the font style 'Copper plate gothic Bold 'from the photoshop font, drop down list. The purpose of using this style of type, allows the text to stand out and be sharp and intense. So, it will be eye-catching to the potential target audience. I use the colour, 'White' from the 'colour chart' on photoshop. As this colour contrasts well with the blue sky colour of the background.

After this, i included my brand logo from my JPEG images pasting the image onto the Billboard layer and resizing it using the 'free transform tool' and holding down the 'shift key'.

The main image i chose is a wide shot with a different style of pose to the other images i have used in my product. Therefore, experimentation is proven using this technique. To use it on my billboard, i dragged the image into photoshop and using the 'Magnetic lasso tool', i selected around the model's figure, so i would not select any white background of the image, which i would need to erase when it is pasted to the billboard layer. Once the image was copied and pasted onto the layer, i again, used the 'free transform tool' to resize the image. Placing it to the left of the billboard so that i could allow the background to stand out and enable the billboard to look spacious.

Next, i used the 'affects drop down list', to create a double/ multiple exposure style in the main image. This is basically the background image looking as though it is projected onto the model image. Creating an unusual affect. Furthermore, i selected the filter 'lighten', this enlightened the entire billboard and the exposure inside the main image.

Finally, i included small text using the same font as previously used for the title. Such as, a metaphor as a form of language, 'The north east are taking the runway' and a quotation like 'The No1 fashion experience', a way of persuading the target audience to attend the fashion event by 'Essence fashion' in the north east.

Development of Double page spread

        Development of Double page spread

The double page spread was the most difficult design to create. this because the design is very detailed and complex. Whereas, the front cover and contents use a bigger JPEG image and less text on the page.

In my opinion, the double page spread is important  seen as the article is the main story However, the front cover and contents page are the build up to the double page spread. I have tried to include as many features of a 'fashion magazine as i could'. To show my knowledge of magazine features and how they should be placed on the pages. 

The page was made using an 'A4 international paper sized layer'. Then using the 'rotate 90 degrees' tool to turn the page, so that it was landscape, rather than portrait.

To start with, i created a banner at the top of the page. This includes information that an official magazine would use, advertising the brands online web page and persuading the audience to give us feedback by asking them to fill in a survey online. Therefore, in the future 'Essence magazine' can work on making the magazines and articles even better. This was created using the 'rectangle shape tool' and the 'fill tool' to alter the colour of the banner. Then i used the 'type tool' to highlight the text and then change the colour with the colour chart to white. To create contrast with the text and background. the reason i chose to use a deep grey for the background of the text was so that is would create a boldness within the type inside the banner and have a positive contrast with light coloured features used on the page. For instance, the background. Seen as though it's a pale green. A deep grey would work well with this shade.

I decided to make the background of the double page spread a deeper shade of light green to the front cover and contents page. the reason for this, is because the double page spread is a dominant page and includes the most information on it. So, in this case, the page stands out more and makes it a little more exciting than the first two pages. This again, was done using the 'fill tool' to create background colour, by selecting around the page and selecting the shade of colour from the 'colour chart'. Then altering the opacity levels to around about 40% to get that pale green shade.

'Da font' came in useful for my typography used for the text on the page, like the main headline and quotations. i downloaded the font, 'Cast force' for the spread typography. This was used mainly for the bold and intense type that i wanted to stand out. Downloading the font was straight forward by opening it from the 'safari downloads' and then installing it to my downloads on my desktop. Then opening the font in photoshop. So, it would be on my drop down list of typography styles. I also installed the font 'Fabulous_2' from 'Dafont'. This font style is cursive, relating to my theme of fashion. So, i used this for my article, as it is still readable.

I gathered logos from the internet of 'Google images', then dragged them into photoshop. After this, using the 'rectangular marquee tool' or magnetic lasso tool' to select the area of image and then copy and paste from the 'edit' options at the top of Photoshop. In this case, the image would be pasted onto the layer i was working on. So, then i could move onto resizing the image with the ' Free transformation tool', to the size i wanted it on the page.

Catchy quotes are used to persuade the audience into reading the magazine and a long shot of the model is used to show a different style of image to the rest f the magazine. I made a banner at the bottom of the page to advertise a chance to win £1000 worth of shopping vouchers. This links to the theme of my magazine and allows me to advertise the brand's web page, to gain a wider audience. The colour of the banner contrasts with the rest of the magazine page, allowing it to stand out. 

The outcome of my double page spread is positive because it includes many features and is persuasive to my audience. The article includes phrases and uses techniques that are in a formal style and in an interviewed style. Making the article look professional and to a high standard. Furthermore, i like how i have used many creative techniques that increase the affect of contrast, textures and intensity through colour. Enabling the spread to be eye-catching.

Double page spread article

Above is my article for my double page spread. I decided to install fonts from 'Dafont' for the article and header because i wanted the magazine to be identified as 'unique'. The article relates to the thought of the idea of the magazine being a 'regional' magazine because it uses phrases such as 'The North East's Fashion Company, 'Gossip UK'. This tells the audience that the magazine is based in the North East. In addition, the article also mentions 'Young girls today'. So, it advertises the fact the magazine is aimed at a female audience.

In my article, I included quotations of the model and facts about the model. The purpose of this is to engage the reader into reading the article. Plus, i included relevant companies and interview programmes to make the article sound realistic and official.

Finally, the fonts i used for the article are cursive and for the header Upper case. Therefore, the type can stand out and attract attention. The fonts are used were 'Cast force' and 'Handy cheer'. Cast force was used for the bold upper case header and Handy Cheer for the cursive font style in the article itself. These express the term 'Fashion'. So, i thought it would be a good idea to include them in my article.

The layout of my article is in Small paragraphs that are symmetrical on each side. This is because official articles are laid out like this to make them look neat and tidy. Also, i have used a drop cap. That is another feature used on official magazines. Allowing a professional affect to be made. Lastly, the line in between each side of the article, separates information and allows the article to look more spacious. The logo used at the top of the article, is repetitive as it is used on other pages of the magazine. This is a form of advertising.

Photoshop useful tools

Using 'Prezi'...

https://prezi.com/ctofwwgqyygu/useful-photoshop-tools/

Development of Contents page

                     Development of Contents page

The contents page was more complex to design than the front cover. This is because there is more information placed on the contents. The purpose of this is that it's one of the first pages of the magazine, so the contents needs to engage the reader, otherwise, the audience will not want to read the magazine. So, i have included the important and key information on this page of which the magazine consists of.

The main headline was created using the 'Type tool' on photoshop and selecting the font 'Aeroplane sky', which i downloaded from 'Dafont'. I then increased the size using the size adjustment tool, changing it to '60', so that it would stand out and be the biggest text on the contents page.

Below the main title, i used the phrase 'Contents' to identity the page. Making it in the font 'Starfish', which is cursive and relates to the creative theme of the magazine, being fashion.

Next, i dragged the JPEG logo image into photoshop and used the 'magnetic lasso' tool to select around the area and paste it onto the A4 international paper sized layer which i made to create the portrait page for the contents.

After this, i added the date the magazine was published next to the main title. This was to show the audience the magazine new and up to date.

The index consists of many background colours which i created using the 'shape rectangular tool' and the 'fill tool', to select the colour that worked best for the shape and with the rest of the colours on the contents page. I made the main colour for highlighting information in a 'maroon red' shade, as this contrasts with the light colours on the page. Furthermore, it meant i could white typography for the text in the index as well. Again, contrasting with other colours on the page.

The background colour of the contents is the same as the background colour of the front cover. This makes both pages connect together.

i have used bullets for important information on the contents page. This is because it is the key information used in articles and stories in the magazine. So, it alerts the reader of this. These were created using the 'circular shape tool' and the 'fill tool' of the colour 'white'

Other features like the banner was made using the 'fill tool' and the 'rectangular tool', which i fitted to the shape i wanted. In this case, long and thin. I used white text using the 'type tool' and the 'size tool' to resize the text to a smaller size. As i did not want the banner take up a lot of space. Seen as though, this would make the contents page look unprofessional and inappropriate.

The puff was created using 'Microsoft powerpoint'. Mainly, using the tool, 'shape'. This meant i could create a spikey 'puff' that would capture the audience's attention, rather than using the circular tool on photoshop like the front cover. This would create more of an impact when thinking of 'eye catching techniques.

Finally, the main image was dragged into photoshop from the file ' favourites', which i made of the best images from my photoshoot. I edited the photo in black and white using the black and white filter tool, increasing 'brightness and contrast levels' from the adjustments tools. Then using the 'magnetic lasso tool', i selected around the models figure and selected, 'edit copy' on the same layer. Then 'edit, paste' on the A4 international paper sized layer where my design was being made. Afterwards, using the 'Free Transform tool' and holding down the button on the mac key board, 'shift', i resized the image until i felt it looked in the correct position at the correct size.

I decided to swap the image layer with the title layer. Meaning the image layer was above the title layer. The purpose of this, is to make the image have a '3D affect', making a positive impact on the contents page.

Top fashion magazines and their main features

To the left are the top fashion magazines that are National. The difference with my product is that it is a regional fashion magazine, although the main features and conventions are the same as a National magazine. When designing my product i have to consider the features of an official national magazine, in order for it to be successful. Looking into the features of Masthead, sell lines, pull quotes, barcode and main images. These are what make the product official and professional. These features are what will capture the readers attention and engage them...

Codes to follow

My fashion product will consist of many features that attract my target audience of young females ( older teenagers- young adults)...

AS Reflection of front cover

Development of front cover

        Front cover of magazine




Using the software photoshop, i have started to design my front cover of my magazine. I began by using an A4 international paper sized layer to allow the front cover to be the correct size and portrait to look official.

Next, i selected the JPEG image i wanted to use on my front cover from my desktop, dragging it into photoshop. Using the magnetic lasso tool, i selected around the area of my model, enabling only the model to be pasted on the paper sized layer. After selecting the area, i used the edit, copy and edit, paste tool onto the layer and used the 'adjustment' tool to resize the JPEG to the correct scale. Although, i kept the 'shift' key down to prevent the image from being stretched or disorientated. I repeated this process with a few JPEG images from the shoot, which i liked best to see which image would work well, as a front cover of a fashion magazine. So, in regard to pose and facial expression, with the type of shot the image is ( close up/ mid shot).

After deciding which image i was going to use, i then moved onto experimenting with the background colour and adding filters to the image to see if it added a positive affect,  such as adding a 'black and white filter' to the image and selecting dark and light background colours using the 'fill tool', until i came to the conclusion of the colours that worked and contrasted best. In my opinion, the image looked best in colour, rather than black and white. Therefore, i removed the black and white layer. As for the background colour i chose a light turquiose green, as it is bright and suits the female gender i am targeting my product to. Plus, it enables the text on the front cover to stand out and contrast.

Afterwards, i moved onto adding typography to the front cover, considering, sell lines and organisation of where the text should be to prevent it from taking the main focus away from the main image. Using the website, 'Dafont', i downloaded a few styles of font to photoshop that would work well with the theme of my magazine ( fashion). So, in this case, i wasn't using fonts that already existed on the software of Photoshop. The main styles of font i downloaded, were, 'Fashion Victim',which was a cursive font and quite creative. In addition, i also downloaded the font, 'Aeroplanes in the night sky' and 'Long shot'. These enabled me to include a variety of different styles of typography. Representing experimentation. The colours used for the typography on the front page, are bold and deep. The reason for this is because my background colour behind the main image is light. So textures and a shift in colour is made.

The name of my magazine is 'Essence'. I chose this title because of it's definition behind it and because i want my magazine to be abstract and unique. Therefore, i have used bold typography is a large font, in order for the audience to recognise this is the magazine Title. The language i have included in my front cover is very persuasive and catchy. For instance, i have used alteration, emotive language, metaphors and emphasis, in order to persuade the audience to read the magazine. When creating quotes and bits of text, i considered my target audience and how the phrases will engage them. Some examples of language i have used are, 'Take a taste' and 'i live and breathe fashion', which is a form of alliteration. Moreover, 'The North East's biggest fashion show yet', this represents emphasis to persuade and engage my target audience.

Next, the layout of my magazine is organised and reflects an official fashion magazine. I have thought about placing text in the correct places, so it does not take over the main image from capturing the audience's attention. So, in this case, i have not included text to the left side of the page. This is because the main image is not centred, with it being a close up and i want this to be the main feature of the cover, as it's important. The model is featured in the magazine and therefore, the main image gives an indication of this. The idea of text only being on the right, leaves the cover looking spacious, rather than overcrowded. However, i have placed a puff at the bottom left of the page, to prevent it from looking bare.

Finally, i have thought about magazine convention when designing the front cover. Using a banner at the bottom of the page, to advertise the features within the magazine. As well as a puff as another form of advertisement. A logo, to identity the magazine. I plan to use this throughout my magazine pages to relate back to the brand of magazine. As this feature is how the audience recognise it.

Another convention i included was a date, issue number, price, barcode and web address. These are standard features of most magazines and are included to look official and professional. I placed the barcode in the right hand corner of the page, as it should not take over the sell lines and text on the page, seen as though it isn't as important. The other features such as date, web address, issue and price are in small text, for the same reason. The price is in British pounds, as it is a regional magazine in the UK.

Overall, i am pleased with the outcome of my front cover and will present my initial ideas in the header 'drafts'. Here, i will discuss why i changed particular features and how. I feel i have included the magazine conventions to the best of my ability in an organised layout. Using an image that is a close up, different styles of text, both upper case and lower case. as well as standard features of a front cover. Lastly, i have recognised what a good layout looks like in a magazine, from taking inspiration from official magazines. As well as linking the features to the theme of my magazine being fashion.

How this Research has pacifically helped my ideas and the codes and conventions i will challenge now

The research into Deconstructions has opened me up to the purpose and reasoning for pacific features in media products. I feel i am now confident with the terminology of the features included in a magazine, Billboard and website and why they are used. Allowing me to become more confident in designing my own product of a Billboard, Website and magazine. I will challenge the features in a positive way, increasing their outlook towards the target audience. By making the Fashion product as Unique as i can. Therefore, it has an identity. This is they key to fashion products appealing to the audience. 'Remembering' the colour scheme and title.

Website deconstructions (3)

      https://app.emaze.com/editor/@AWFFITRZ


I have used the website Presentation software, 'emaze', to create a presentation on 3 Website deconstructions. The reason for this is that is presents my view points and organizes my work in a presentable manner. Therefore, it is easy to indicate what my point is and the analysis of the deconstruction...

Billboard deconstructions (3)

Here is an example of a 'Fashion Billboard', there a various deconstructions on it which capture the audience's attention and engage them into the brand advertised...



BOLD TITLE- The billboard uses a bold title and it is clear to the audience what band is being advertised. For instance, with this billboard, we can see the brand is 'GUESS'. In addition, title uses upper case typography to stand out, as well as color tone. The colour used in the title is 'gold'. Therefore, this links to the idea of the fashion brand being successful and popular. It could also tell the audience that the brand is well liked. The idea of the black background, allows contrast to be made and the title to be a main focus in the billboard.

IMAGES- The 2 images on the billboard have been shot using high key lighting, allowing vibrancy to be created. Moreover, the composition of the images is interesting because the shot has been taken as a mid-shot, allowing the costume and props to be noticed in the images. the purpose of this is to advertise the products. such as the bags. We can notice the advertised product is a bag because of the way the models are holding the bag. It shows they are passionate about the product and is a good technique of persuading the audience to buy a Guess bag because they look nice.

LOGO- The logo used in the billboard is placed below the Title, so that the audience can recognize what to look for on a 'Guess branded bag'. In addition, the purpose of this is to allow the audience to also recognize other products that are made my 'Guess'. So, in this case, the billboard advertises the brand as well as the advertised product. Making people fascinated by it, in order to buy their fashion products.

Magazine deconstructions

AS REFLECTION...














The deconstructions i plan to use for my fashion magazine are the same as the ones above, which i used in my AS Music magazine. Although, i will not include features such as a 'band index' as this does not refer to the idea of fashion. The features i use will grab the audience's attention and persuade them to read the fashion magazine...


AN EXAMPLE OF VOGUE FRONT COVER DECONSTRUCTIONS...



VOGUE CONTENTS...



VOGUE DOUBLE PAGE SPREAD...