idasylven / project-news-site

News Site

Brief was to create a classic magazine or newspaper site. The site should contain a header with a name of the site, a logo and a navbar. The site were to have a big news section and a grid of cards with other news. Furthermore the site should be responsive for different screeens: on desktop sized screens there should be four cards in a row, two in a row on tablets and one card per row on mobile.

The problem

I had a very clear idea of my concept and the visual idea of the brief. I wanted to make a digital fashion magazine, with a somewhat traditional look but with a modern edge news approach. I created a logotype from a free svg-image, and added a decorative font from Dafont for the heading. The foundation is a classic news paper color scheme, but with polaroid looking news card and bold news images. I thought it was a fun idea to add a "song of the week" feature, and was very happy I managed to implement that. The site has a static hamburger menu nav bar for mobile display, and a traditional nav bar on bigger devices. Being a fictional project, the social media icons in the footer are currently just linking to their respective default landing page. The page has been made responsive with flexbox, re-sizing and re-arranging the news card differently according to the brief description. In terms of planning I learnt a massive lesson with this project: to always start by getting the technical aspects of the site to work properly - and not get carried away focusing on design details before the basic structure is functioning.

View it live

To view project live, please follow this link: https://cranky-booth-8b13f7.netlify.app/