The North Star Homepage Redesign

Shakil Islam
7 min readJul 28, 2020

--

Liberation Journalism

Reestablished in 2020, The North Star was first started all the way back in 1847 by the abolitionist Frederick Douglass because he was frustrated that the mainstream media would not take a clear stand against slavery. Nearly 175 years later, those frustrations remain. The mainstream media still refuse to clearly and boldly confront systems and institutions of oppression. In fact, mainstream media is often funded by the very people and corporations that we must confront.

“If there is no struggle, there is no progress. Those who profess to favor freedom, and yet depreciate agitation, are men who want crops without plowing up the ground. They want rain without thunder and lightning. They want the ocean without the awful roar of its many waters. This struggle may be a moral one; or it may be a physical one; or it may be both moral and physical; but it must be a struggle. Power concedes nothing without a demand. It never did and it never will.” ―Frederick Douglass

The process

Identify main points

  1. Establish the brand. The 175 year old newspaper needs a new PR (public relations). The name needs to be presented and consumed without any distractions. Use slogan to further introduce and describe the new newspaper.
  2. Establish the mission “Unapologetically fighting injustice in America with education and action”. The education aspect is extremely relevant, meaningful, and timely; especially as a member of the press in these uncertain times. Choosing to be purely reader funded and opting out of advertising is a commendable journalistic commitment.

Journalism is at a crossroad. As most of the leading newspapers and magazines in the country struggled to make the transition from print to online media, they ended up in the dangerous trap of producing content for clicks. And clickbait was birthed. We are opting out of this cycle and the only way to do it is to be fully funded and supported by our members. This allows us to be unbought and unbossed. It allows us to speak truth to power without fear of what advertisers or outside corporations might think.―The North Star

3. Keep the focus on the content.

Observations

Deconstruction of the user experience (UX) and user interface (UI) from top to bottom of the homepage.

  • The brand new logo is obscured with the links surrounding it.
  • The navigation is confusing with a mixture of categories and subjects. The dim links look inactive. Not clear of where the user is currently within the navigation. Not clear which is the primary navigation.
  • The strip of items below the navigation feels like a billboard display of flashy items that is distracting from the articles.
  • The next section is a cluttered collection of different types of articles and a small subscription box that gets lost within the loose grid structure. The tags on the images fight for attention from the headings of the articles.
  • The podcasts section is unfortunately broken.
  • The newsletter section is uninviting with excessive warning message.
  • More News section is a repetition of the articles above. Is there a lack of content? The article headings get lost next to their intro text. The Show More News buttons uncomfortably takes readers to a new page.
  • Most Read section looks regular.
  • Not clear on the significance for Join The Conversation section. Is it a section for provocation? Is it an in-depth analysis section? Are they opinion pieces? The low numbers of comments show an embarrassing lack of actual conversations that’s being had.
  • The footer seems to be a giant ‘I give up’ with the massive search field. The importance of social media presence is severely hidden in this section.

My design philosophies

In no particular order, here are few of my personal design philosophies that drive the feedback.

  • I tend to lean towards Minimalism design. Breakdown the design into its essential elements. Have purpose behind every element.
  • Keep it simple stupid (K.I.S.S.) goes a long way for helping the user get the most out of a product, in this case, the homepage.
  • Delight the user with the use of thoughtful and pleasing visually aesthetics.

The feedback

  • First de-clutter the logo and give it space for its reintroduction.
  • Use the space above the logo efficiently by adding the slogan, date, search, social media, and other important links. When scrolling, the expectation is to lock this bar and viewable at all times.
  • Use the space on the right of the logo to promote the mission of the newspaper of being only reader sponsored. In my opinion, this should be the most important thing viewers to notice in order to gain subscribers and supporters.
  • The navigation is divided into two sections. First, three main categories, then followed by a list of trending subjects mixed in with in-house subjects such as #InTheseTweets and #WomanCrushWednesday. Keep the links bright and highlight the News as the homepage. I would add drop-down menus for the different subjects within each of the three main categories.

Under the Fair Packaging and Labeling Act, the FTC requires that all ‘consumer commodities’ bear a label with an accurate ‘statement identifying the commodity’. If revenue-generating commercial broadcasts (whether by radio, TV, or internet) are a ‘consumer commodity’, then they must be accurately labeled. That would seem to preclude ‘News’ that is not genuine, ‘Opinion’ that is not the author’s actual opinion, or ‘Analysis’ that is not at least arguably analytical. Note that in general the FTC only has authority over commercial aspects (pertaining to revenue) rather than speech. ―Accurate labeling rules under the FCC fairness doctrine

  • Below the top black header, start with a hero article that the viewers can consume without any distractions. Show only an attractive image, a substantial and impactful headline, and short descriptive intro text of the article.
  • Next is the superstar section with the podcasts. Currently, the majority of original content is coming from podcasts, so why not give them their due? Group all the podcasts in one space. Highlight one with a player and access to the latest episode.
  • Below the podcasts we get to the substance of the website, content (articles). The left most section is a list of articles in chronological order. Omit section heading since News is already highlighted in the main navigation. For better scan-ability and legibility the article headings are larger then the intro text. Reducing the size of the images makes room for 7 articles from only 3. Finally, show 7 more articles at a time below when clicking the view more button.

I would recommend to partner up with other content creators that align with the mission of the newspaper. This would provide one primary newspaper destination for readers to visit daily. See design to view examples of what articles from different sources would look like, very subtle.

  • Most Viewed section is similar to the original with slight aesthetic changes. To free up resources from mediating commentary, the comment are unnecessary. Omit intro text since article headings are sufficient enough to warrant further reading for this section. Change section header from Most Read to Most Viewed for better semantics. The numbering adds for a delightful visual interest. This list would be gathered from all three category types of articles.
  • Human nature tends to lean towards like minded thinkers and ideas. That’s why opinion pieces and sections are popular, which makes sense to replaced Join The Conversation with Opinion. To distinguish them from articles and in-depth pieces, the headings are in quotations. Profile pictures give a personality to this section and their opinion pieces. Have the profile picture be high quality portraits facing left as if looking towards the headings. Another alternative to pictures can be portrait illustrations (See design for an example). Along with the pictures, names are an additional identifier and good metadata for search engines. Omit comments for same reasons in Most Viewed section. Have the section header link to the Opinion page. Visitors can always view the Opinion page from the main navigation.

I would recommend to partner up with other influential and qualified people who are experts in their field in addition to in-house writers. Bring interest from celebrities’ interpretations on current events. Having others distribute through their mediums will increase readership and exposure for the newspaper.

  • An image makes the Newsletter section personable. Add a name to the newsletter, perhaps The North Star Newsletter at its simplest. Add FOMO (fear of missing out) statement to nudge reads towards signing up for the newsletter. The button text emphasize there’s no financial obligation in receiving the newsletter. Concluded with plain fine print to reassure readers are able opt out.
  • Finally, we reach the footer. As this would be on every page, the most optimal thing here would be to place the mission and call-to-action to subscribe with incentivized offer. Flank the mission with images of origin, issues, and the team, which gives it humanity and a sense of purpose. The background image gives an impression of unity, depth, and weight to the bottom of the homepage. Concluded with relevant links, social media, and legal text.

Final thoughts

The media’s the most powerful entity on earth. They have the power to make the innocent guilty and to make the guilty innocent, and that’s power. Because they control the minds of the masses.―Malcolm X

Education is the passport to the future, for tomorrow belongs to those who prepare for it today.―Malcolm X

I particularly enjoyed this redesign project because I genuinely believe in the above quotes. I see a lot of potential in The North Star. I love working on projects with big and aspirational missions towards the well-being of humanity.

--

--

Shakil Islam
Shakil Islam

No responses yet