Kollega.se
UX/UI
ABOUT THE PROJECT
Kollega is the independent journalistic branch of Unionen – the largest union in Sweden. In addition to their monthly magazine all members receive they also have an online newspaper where they publish new articles daily. I was assigned to help them do a complete redesign of the page and added challenge of making sure the news design was compatible with the 20 000+ articles in their archive.
Design approach
The design is deliberately subtle with the goal of putting the editorial content front and center. For Kollega, is was also important that had a professional and serious appearance as they often would handle sensitive subjects like discrimination and bad treatment of workers.
Article pages
To soften the contrast and lessen eye strain while reading, the page background is a very light grey while the text is sightly off-black . In addition the columns of body have their max width set so that the average characters per line is around 60-75 which is close to ideal length to maximize readability.
At the end of an article the editor can insert article recommendations promote further reading, and if the user keep scrolling the page has already loaded another article below based on what the user just read.
Typography
The main typeface is Newsreader, a classic serif that offers great readability while at the same time giving the publication a distinct journalistic look. The typface is used in two variants: Body text uses the normal style while larger text like most headlines used a variant called Newsreader 60pt which has more contrast between thin and thick lines in the letters.
In addition, Fira Sans – a modern sans serif used in buttons and fact boxes to add contrast and complement Newsreader.
Designing with old content in mind
At the time of the redesign, Kollega had over 20 000 articles in their archive and it was crucial they would still be available and look good after the relaunch.
To make this possible we analysed the content of a large number of old articles together with the development team and based on our findings I was able to make the redesign compatible with the existing content structure which allowed us to import the archive automatically without any manual work.