top of page

Designing an Online newspaper experience for artistic Kids

The goal of this project was to create a website where the students of Marecollege can easily write articles, showcase their skills. The website should be appealing to young students of the college


My Design Process

The design process I usually use a modified form of Understand → Ideate → Prototype → Improve. I adapt the process based on the type of project. The process I used for this project is detailed below

Requirement Gathering


Visual Identity

Wireframes & Interaction design

High Fidelity


Requirement Gathering

The main stakeholders for this project are students and teachers. So the requirements were collected from their perspective. This helped me empathise with my end users. Once the requirements were collected, they were segregated into Functional requirements and Look & Feel requirements.

Group 237.png
Group 238.png
Group 231.png
Group 265.png


 Functional and Look & Feel requirements were ideated upon to come up with solutions.

Group 237.png
  1. WordPress was chosen as Content Management System (CMS) of choice as students were already familiar with WordPress.

  2. Two profiles can be made - One for Teachers with rights to publish (Approve) the articles and the second for students to create (write) a draft.

  3. The text editor in WordPress can handle all sorts of media including images, videos links, quotes etc. Custom fields can be added for specific media requirements.

  4. The printed version will be custom stylised so that the articles are truncated and would give a traditional newsletter like feel.

Group 238.png

Three style tiles were made to understand want kind of visual language is like by the students

Group 266.png

Visual Identity

The Bold retro look was liked by both the stakeholders, but there was some feedback that were needed to be taken care of before moving on to visual design

Group 246.png

The feedbacks were an opportunities to improve and were taken care of with new ideas

Group 267.png

Wireframes & interactions

The ideations, concepts and features were turned into hi-fi wireframes

Frame 487.png
Frame 488.png

Final Design

Home Page.png
Single Page.png

You can check-out the live website here

Like what you see?

Let's chat.

bottom of page