Connect with Me:
Go Back
Viva Lifestyle Magazine
Website Redesign
Shabir created the concept of our website and sold the design to us while working as a student. He re-designed and implemented our new website and continued with us running our bi-weekly newsletters. He is highly technical, tremendously creative and conscientious beyond a fault. He always delivers on deadlines, and is creative and knowledgeable on any project we initiate.
Rebecca Legon
Director - Viva Magazine
Project Details
Date: May 2014
Status: Live
Responsive Icon
Viva is a quarterly lifestyle magazine with a print distribution over 20,000 around Manchester and Cheshire, holding an online presence attracting over 30,000 monthly visitors to their website. Viva covers Manchester's vibrant scene including celebrity interviews, food, music, fashion, beauty, health & fitness, art and events.
The Problem
The old website had a number of usability, accessibility, design, and contextual issues. It was generally outdated and had a non-responsive layout. It suffered from being over cluttered due to unconsidered content and advertising placement. It was essentially a wordpress blog with a very simple theme displaying recent posts on the front page.
An immersive and engaging reading experience, streamlined articles and a responsive interface. Making navigation between stories and related content easier. A new layout design using a content centric approach. Achieved with a user friendly moduler design, which enabled editors and writers to create and share content.
Category Module
The new category module on the home page enables flexibility and extends the homepage to be utilised by multiple categories. This module could be used to pull latest posts from any category or as many categories as required. It gives the user a stylistic overview of that category, while displaying 5 or 6 (it could be any number) latest posts in the category along with further link to that category.
Category Page Items
On individual category pages, posts are displayed in the following layout, and are also shown how they look on mobile devices. It could either have a single image as the featured thumbnail or a slider, giving an overview of the post.
Video Post
Video Posts are purposefully different than normal posts. The thumbnail is the actual video and is presented as a video player. Users don't have to open the post to view the video. It could also be dispayed in normal style like a standard post.
Probably the most important element of a news/magazine website is the article. The new layout enables legibility while maintaining a hierarchical contrast between elements and their significance.
Responsive Layout
All the elements perfectly adapt to smaller screens or window sizes while keeping the design of the elements the same. Only relative information is displayed on smaller devices, resulting in an optimised experience.
Rotate Your Device to Landscape
Thank You