Responsive Editorial

due February 14, 2020

With your team you’ll have a week to (re-)design an editorial website, for a magazine or newspaper of your choosing.

In this project you’ll be putting more information architecture, content strategy, and responsive layouts into practice. You’ll also be responsible for coding at least one of the templates using HTML and CSS so that you can properly demonstrate how the layout will change on different size screens.

Setup

Materials

Getting Started

  1. As a team, quickly decide on an existing publication that you’d like to design a website for. If they already have a website, you’ll be redesigning it. If they only exist in print, you’ll be designing their first website.
  2. Audit the existing content. It will probably be too time-consuming to perform an exhaustive audit, so focus on breadth as supposed to depth.
  3. Do some card sorting to figure out a sensible navigation for the content. Prepare cards with a subset of articles across a variety of sections of the publication. Each card should have a title and perhaps the first sentence or two of the article so that your test subjects will know what that content is about. You’ll want about 50 cards to perform a good set of open and closed card sorts.
  4. Once you’ve got a good handle on how the site will be organized, start sketching screens. I recommend working on mobile layouts first, as it will be easier to scale these designs up than to scale desktop designs down. Start with core parts of the site first, like an individual article or the subscription sign-up form.

Suggested road map

Monday

Tuesday

Wednesday

Thursday

Friday morning

Friday afternoon

Presentation (6 minutes)

Your presentation should answer the following questions:

  1. What variations on your design did your group explore?
  2. How does your design is improving the existing site being re-designed?
  3. What would you do differently next time?

Uploads

Give feedback to your peers!