Analyzing an Online Magazine and an App - VICE

Vice is an online magazine about different news issues including music, fashion, travel, sports, health, impact, technology, food, gaming, opinions, elections, crime, culture and environment.

At the top is a menu with selections like VIDEO, SECTIONS, PHOTOS, MAGAZINE, TOPICS:ELECTION 2016, OPINION and so on. Thanks to wed design and programming, clicking on one of these different options will lead you to another 'page'. When moving the mouse on top of one of the different options, this is what will show up(below)

 In this case, the mouse is on top of the photos drop-down option. I like the layout of the page with the different colours present and different type of photos or designs. Having everything the same style would be boring and not attract the viewer to keep on looking at the website and by a click of a button the page will be closed and the viewer will look for something else. So we realize the importance of catching the viewers' eyes.

The audience for VICE magazine is literally anyone. Age is a bit of a factor which shows people who really look at the magazine. For example, a 13 year old wouldn't really bother to read about the news of the computer but rather chat with his/her friends. That's one good thing about this magazine, it is that it typically writes about anything in at the moment targeting everyone as a whole. Vice has also become popular with the videos that they do on interesting topics such as distribution of drugs, back stories of important people and so on.

When clicking on an article in a sub topic, a layout like this will appear.

  
In this case, the topic being discussed is how marijuana won the Election. I am not going to go into the topic but rather the layout, style, arrangement and layout.
On top,we still see the menu bar, just in case you are fed up of reading the article and might want to read another article instead. 
Then, being the largest in bold, with less spacing between letters is the title 'How Marijuana Won the Election'. Underneath the title is the writer of the article.
There then is the share menu, including Facebook, Twitter, Tumblr, Google+ and so on.
Underneath that obviously continues about the article with an image and text. Text also has underlined words. These are portrayed in bold to attract a bit more attention. When clicking on one of these, another tab is opened of another Vice article which has to do with what you click on. For example, when clicking on 'passed referenda' a different styles article came up as you can see below.

   

There is no grey background where there is no text like the top one, the text is bigger and in a different font. This is good in a way as for the reader not to get bored of the same layout, size, text, font and so on. Here, there is a good use of white space, a bit too much perhaps. I lie the design of the ;UP IN SMOKE' title. The effect ads interest into the page and makes it look a lot nicer.

Back to the ' How Marijuana Won the Election' article, we see the presence of ads. On the side we see a big part of advertisement of Green Valley Cordon Bleu.  Underneath the ad, we see MOST POPULAR. These are more articles of Vice, trying to keep the reader on their site and making it easier for them to know what is the most popular at the moment.

When it come to colour, simple colours like black, grays and whites are used on VICE.com . They focus more on the information than on the layout(however layout is good).
When it comes to Typography, they are different to that of a magazine. Titles are a classic black bold title.
The Articles on this site are a bit less formal than those on actual magazines, with more straight to the point wording.
When it comes to size of wording, it is a little larger than that of an actual magazine. They could do this maybe because it being on a screen, it is bigger as there are other things going on, such as bright colours from photos of other articles, ads and so on.

Underneath the article, there are TOP STORIES. Layout is simple with 3-centred columns, with many rows.

    

In these top stories, a few words lay underneath the photo describing what it is about.
As an online magazine as a whole, I think it is quite good design wise, not how i would design my own, but i still like the layout and design. I would have on the other hand done something different from the norm, layout wise..



Below are some different online magazines, but in a way have the same layout or style, obviously varying in content and images.
You will also realize that the style or 'playfulness' of the design layout varies according to how 'serious' the magazine is.For example, there is a clear difference in colour and layout between 'The Verge', and 'The Wrap' from 'The New York Times'. 
Type of content makes all the difference. 

ANALYZING THE VICE APP

When it comes to the Vice app, information will be the same and so will articles be the same. However layout and grids are different.\

Here is the homepage of the Vice app. We already notice that it is a one column grid app for android. Stories continue as you scroll down. Font of the title is a sans-serif font. It is also displayed in bold. 
Under the Vice logo, there are two 'links' which are MUST-READ and LATEST. 
When clicking on LATEST this is what came up.

There is a difference in picture layout, with no number going into the picture like before. There is also a difference in font in the article where the font of the article is sans-serif. I honestly do not know why they used the sans-serif font, as the online magazine font is a more suitable font for the app itself. 
However, the LATEST link is still a one column grid layout. This is very common for apps since the screen will be much smaller to read. 

Moving back to the MUST-READ link, we notice that the font of the article is serif, which is more suitable for an app and more appealing in my opinion. Font is modern and up to date. Here we see again, how the number becomes one with the illustration.

This is the article number 1 in this case, and we see a banner of white and black with the VICE logo in a circle.
There is also a difference in font in the article where the font of the article is sans-serif. I honestly do not know why they used the sans-serif font, as the online magazine font is a more suitable font for the app itself. 
One factor i really like about this, is that it tells you the estimated time to read the article. This is good to know if it it worth reading or not, as many people do not even bother reading an article if it is very long. 

Analyzing a Mojo's Magazine of 1998

Firstly, i'm impressed with the cover of the magazine for a 1998 magazine. Today we still use the same principle of colours. I noticed that the most colours used at once is 5. Almost 80% of the time, its always 4 colours on one 'message' or design. In this case black, white, grey and a bright gold-ish colour are used. I think they work very well together and are again impressive for 1998.

 The page i specifically chose to see in detail the layout, font, design, colours and messages is page 11. I chose this page because there are 4 different articles separated on the page and all with different fonts and styles to try to attract the viewer to read it.
All 4 different posts on this one page have a complete different layout. One with the photo of the top right, another with 2 photos top and bottom middle, another 2 photos bottom left and bottom right, and the last is a small article called 'Hollywood Babylon' and there is a photo on the top right.  
The bottom left article is the article which hits me the most. It consists of a big bold title ' Stones hit smalltime' and subtitled ' Jagger braves passive smoking scares for club dates'. The wording is not which attracts my attention apart from the big bold title. The thing which attracts me the most is how the two images have white writing on them as if they were communicating. The one on the left says "got a light, mac?" and the one to the right replies "just a leopardskin overcoat, Mick" where in the photo he is wearing a leopardskin overcoat. This gets me interested into why he said that. Although being the same design and font as the top left one, the photos help attract viewers. The background colour is also white unlike the top right image which is a very light yellow, more cream like beige. The top right image has a lot of words in bold, all celebrities at the time such as David Bowie, Tony Bennett, Frank Sinatra and so on. The editor does them in bold to attract readers to read the article by seeing a lot of celebrity names showing that it could be something important to read and not to skip it.  The bottom right image also used bold lettering for celebrities like Green Day, Marilyn Manson and so on. 

A particular ad which hits me is the 2-paged VOLVO V40 ad. Being on 2 pages it is quite large and only a bit of wording which makes you want to read it. there is a man looking at the car through the glass at the showroom. The writing says ' Now all you need is a wife and kids'. So it could be that it is targeting men in particular. 

The white lettering is placed perfectly and really stands out.

Taking more note into the layout of the page, I conducted some research on the basics of magazine layout. First comes the headline which consists of the title to the page or ad. This informs the reader about what they are about to read.

Underneath the headline comes the credits and introduction of the page along with (if desired) an image mostly placed top right. Obviously then comes the text itself, deciding on placing, size, font, colour and so on. Using a larger letter as the first letter of the whole write-up is usually used. The body is the largest part of any type of article. Information should be as interesting as the design of the headline and intro itself. What's the point of having great design and headline if the content is not good?  No matter if the design is the best, if the text is not interesting, you will lose many readers by time.

Pull quotes are an attractive design element to insert in your work. They add a sens of excitement and shows the most interesting parts of the article. Related to design, your pull out quotes should be big enough to pull the reader's attention, but this size should not be as big as the headline. You can emphasize the pull quotes with a different, playful font, frames and so on.


"Folio can consist of several elements. Page number is mandatory but others are optional. Others can be publication logo, date, month, section title, web page, but again do not over do it. Few elements are more than enough and you should repeat them all over the magazine. Unlike running heads, folios serve a bigger purpose and should be placed on almost every page. The reader should know in every moment at which page he is or to which page he needs to go." (taken from reference link below). 



REFERENCE: http://www.magazinedesigning.com/magazine-page-elements/