Scan Magazine Family, Editorial Online Magazine

2019/20, 2023

UX/UI

From online directory to editorial magazine family.

Scan Magazine is a unique showcase magazine focusing on various regions – Scandinavia, Southern Europe, Benelux, Germany. It appeals to all those who have a relationship with or a connection to these countries – be it through family, business, tourism, migration or investment.

The Start

The initial online version was pretty much “a web directory” of different businesses and everything connected to the area. Maybe not even a directory; it was a bit of everything - a business directory (with featured profiles), a “download this free e-book”, a “read our printed magazine”, and editorial articles, categories and destinations were a bit more digged in …

Initial home page had many sections, and it was difficult to find our what the website is really about. Ebook, magazine, directory search were the main focus.

Page of featured content, split into categories.

Article page when starting. Featuring small image and big block of text. — Article page

With the new version we wanted to turn into “editorial & news first” to move away from a directory and bring already published stories into the center of online version. Invite users to sign-up for a newsletter; keep space for advertisers.

Initially, editorials were categorized into for categories - business, design, education & travel. Each also distinguished by it’s color.

The Process

The categories and their colors were pretty much the only thing we wanted to keep; with the twist to the Business category, where finding a business in sector was still the main goal. The categorization per category (topic) and not destination was a main objective.

A rought wireframes for a website with approximate content sections distribution for homepage — Approximate content sections distribution for homepage

High fidelity wireframes for editorial/news website homepage

Design-wise, the new look was expected be more minimalistic, scandinavian, black & white so that images don’t get hidden in colors. With the only exception of color for categories. So, to not overuse the colors, only the category labels were colored.

Regions page showing categorized articles from the region — Regions page

A showcase of magazine covers arranged by years; the latest edition is showing additional description — Mobile layout for the magazine archive page

Simlar to regions, category page hightlight the articles from category — Category page layout

Business category features articles as also the search for a businesses based on location and category (and subcategory) — Business category was different from the rest. It was still keeping the "search" for businesses, but a lot of content was still editorial

The Process Again (2-3 years later)

While the first version was alive for a few years (with minor additional tweaks), and it was a big improvement from initial one (and the traffic grew quite a lot). There were still things that could be improved or have been “outgrown”. So …

More importance was brought to de destinations (along the topics), so regions pretty much became part of navigation (or a second navigation).

Home page of scan magazine. Navigation is based on categories and countries/regions. Contains one featured article and many smaller one above the fold. Weekly top section. Columns were moved a bit lower, and 'cover feature' article was added. — Home page of scan magazine. Regions became the primary block of the content among the categories. Columns were moved a bit lower, and "cover feature" article was added. Page is quite long, but the scroll rates are high.

Design for region/country, articles with photography, titles and category labels. The main article is bigger the rest are smaller. In the bottom there are also archived articles paginated. — Page for region/country

Article page - variant with images moved out of main text container (but other variant was considered). Length or text is adjusted.

Featured news were more exposed (ie bigger), design was adjusted to more “scandinavian design” look with focus on photography, (& we finally got rid of initial colors for categories).

No more titles over the images. Also, the ratios of images were unified, which gives better rhythm to editorial pages.

One more website was added (Cleantech) - but this one purposely build with more colors and arranged differently from the other (destination) related ones.

The Result

Family of editorial websites for web and mobile, each categorized by countries & regions as also four main topic blocks.

ScanMagazine, Discover Germany, Switzerland and Austria, Discover Benelux, Discover Cleantech