It made sense to use the same content as the publication itself, but by using all the coding of the website and spreading it across the full page, it would create an interesting aesthetic when the sleeve is wrapped around the publication.
To keep it consistent with the rest of the publication, it will be designed to A2 format and use 4 columns, this splits the page down into more manageable columns and creates a greater word count that can be displayed on the page.
As you can see here the two A2 pages which will be double sided printed are split into 4 columns. Within this I have placed the coding of the website. Each page is separated by a line spacing to make it more legible where the end of each page it.
This shows a closer view of the A2 page and showing what the type looks like on the page itself.
I realised when designing this that if someone was to look at it, they wouldn't understand it and it may seem a little boring. In terms of not understanding it, then the main publication explains it much more and shows visuals of each page to show how the code transfers to a design on a digital platform.
To make this product more interesting I thought about how I could introduce some colour to make it firstly stand out more and to engage the reader more. Thinking about web design and the website i specifically created, the main focus of it was my own work and displaying that. So the coding involves a lot of photography.
Representing the images within the products could make it more interesting.
By using a simple rectangular shape to represent a image and filling this with a solid colour, it instantly makes it more interesting and brings colour to the design. The shapes are placed within the code where a image is wrote within the code. On the front design of the product the title is printed too.
A close up to show how the rectangular shapes overprint the type within the design.
I liked this idea within the design and thought it made it more interesting and represents the idea of the website being printed more. The use of the rectangles wasn't that great though, they represent the images but look like they have just been placed there.
Looking back at dreamweaver and the coding of the website, when you look at an image on there it is represent as a outlined rectangle with a cross through the middle, much like a placeholder frame. This would represent the image better and tie it all in with the idea of transferring digital to print.
Still working in the same way as before the outlined rectangles are placed within the code in the relevant places. Looking at the design at a zoomed out view as before, still makes it relate back to the idea of design layout and digital design, so it relates to the subject better.
On closer view the design now works together much better, with the rectangles only being an outline it doesn't stand out as much and over take the hierarchy of the type, but the user can still see it enough to understand the representation of the rectangle and how it relates to the coding printed on the page.