RIT Reporter website

Redesign of RIT Student online magazine "Reporter.edu"

Project Overview

Project Type:          Individual
My Role:                  User Interface Designer
Project Duration:    4 Months
Platform:      Desktop Application
Project for:   Course- User Interface Design
Tools:            Adobe Illustrator, Sketch 

Problem

The first impression of the website gives a look that it is an article website with some random articles showing on a carousel. It is nowhere mentioned on the website that it is a RIT magazine website. It does not go with the RIT theme and style.  On the homepage itself, redundant and duplicacy of information is there. For example, In the featured section it shows 5 articles in a caraousel and you will see the same recent articles if you scroll below.

Target Audience

  • Age : 18+

  • RIT community includes students, faculty, and alumni.

  • Local students who are from Rochester area

  • Users who are interested in news, sports, technology, and entertainment.

  • Technical knowledge: Usage of Computer

Existing Reporter Website

1) The menu bar clearly defines the different category of the articles/ stories which can easily comm-unicate the user. The font size, right aligned and list view of the menu clearly displays the navigation of the website.

2) This section consists of social networking toolbar, links to print issues,destler dodge game and a Search box. 

3) This callout displays the cover of recent stories in a carousel. The 5 small circles at the bottom of this card depicts 5 stories. It is the primary content which user see when it first visit the website.

4) This callout is the personalized news section for RIT. For example giving the latest news or events happening at RIT.

5) This small cell shows all the recents tweets posted by the RIT Reporter’s website. There is a noticable “Follow us” button in this cell with a purpose of asking users to follow them on twitter.

6) This callout clearly shows different kind of stories. Every story displayed an individual card which communicated information through images and text. The first 5 stories displayed in this cell are the same stories which is displayed in a carousel. 

Sitemap

Themeboard

Reporter magazine is a completely student run website of Rochester institute of technology. This website is for RIT students, alumni and faculty who come from different parts of the world. Theme is diversity with a variety of patterns and colors.

Styleboard

Sketches wireframe

HiFi wireframes

Final Visual Design

1) Homepage

Homepage consists of a fixed bar menu which will stay on the screen even if you scroll down. All the articles are presented in a form of cards. First half of the screen consist of one big featured news which can be of any category or it may happen that it does not lie in any category. This is the reason there is a featured badge on the image instead of a category. Each article consists of an image, title, author name and date.

2) Category

This page comes up when the user selects any category from the navigation bar. Here there is an example shown if the user selects the sports category. Category page also consists of a fixed bar menu which will stay on the screen even if you scroll down. All the articles are presented in a form of cards. There is no big featured news in the category page. Each article consists of an image, title, author name and date. There is no category badge on the cards because category is already being selected.

3) Article page

This page comes up when the user selects any category from the navigation bar. Here there is an example shown if the user selects the sports category. Category page also consists of a fixed bar menu which will stay on the screen even if you scroll down. All the articles are presented in a form of cards. There is no big featured news in the category page. Each article consists of an image, title, author name and date. There is no category badge on the cards because category is already being selected.

4) Author page

This page comes up when the user clicks on the name of Author. Here there is an example shown if the user clicks on Mandi Moon. This page consists of complete author information. It also shows the list of other articles written by the author. On the right hand side, user can see the sponsored ad and the related articles.

5) About us page

This page comes up when the user clicks on the About section from the footer. This page consists of information about reporter. It also shows the list of staff members. On the right hand side, user can see the sponsored ad.

6) Search Results  page

This page comes up when the user clicks on the Search icon in the header. Here there is an example shown if the user types Destiny in the search bar. This page consists of list of articles according to the search. On the right hand side, user can see the sponsored ad.

Benefits from Solution

The first impression of the reporter website gives a look that it is an article website with some random articles showing on a carousel. In the solution, there is a proper RIT branding at the top which helps users to connect with the RIT. Solution tried to use RIT theme and style.  The solution also removed the redundancy and duplicity of information. The fixed bar menu has been created in the solution for easy navigation throughout the website. Category badge has been posted at the top of the image to make the user understand the category with ease. A solution does not bombard the user with the information. For example, Earlier there was some content below the title but it got removed from the solution to make it more clear and visually attractive.

For more information on this project, contact me!

Thanks for looking! Interested in more?

© 2018 Designed by PIYUSH CHAUHAN

HiFi Wire Homepage