Type
Website
Role
UX | UI
Agency
Fabrique
Redesigning for a new generation while respecting the old
Sijthoff Media is a leading Dutch media company specializing in high-quality journalism and professional content across various industries. Their portfolio includes well-known brands such as Adformatie, Business Insider, AG Connect, and Binnenlands Bestuur, each catering to a specific professional audience.
AG Connect is a leading platform offering in-depth insights at the crossroads of information technology, business, society, and career development. With a quarterly print magazine, exclusive member-only content, and industry events, AG Connect serves as a vital resource for IT professionals and tech enthusiasts in the Netherlands.
The purpose of the redesign
The redesign of AGConnect.nl aimed to modernize the platform to attract a younger audience while maintaining its familiarity for long-time readers. We focused on refreshing the visual identity with a cleaner layout, improved readability, and a more dynamic user experience—without alienating the existing audience. By streamlining navigation, introducing a more engaging content structure, optimizing for mobile use, and adding new features we created a platform that feels fresh and accessible to a new generation of IT professionals while preserving the credibility and depth that AG Connect is known for.
Old homepage
New homepage
Clarity and engagement
We started by analyzing the existing website, its structure, features, components, and visual style, along with its audience and AG Connect’s goals for the redesign. It became clear that the old design lacked visual hierarchy, with uniform fonts and color schemes making it difficult to distinguish key elements and sections. This insight shaped our approach, leading to a more structured and engaging user experience. We introduced a clearer visual style, content hierarchy, while including new features fitting for a modern and future proof article based website like AG connect.
Nostalgic and contemporary
The new design of AG Connect blends 80s-era hard- and software design with modern appeal, connecting both older users familiar with the era and younger users who are into retro aesthetics. The light gray background recalls vintage hardware cases and devices, while dark gray and orange, inspired by Dieter Rams’ Braun and others’ designs, add sophistication. Deep blue strengthens the brand’s trustworthiness, and IBM Plex, known for its readability and flexibility, links the design to IBM’s tech legacy, creating a timeless yet contemporary user experience.
Typography
BM Plex is a tech-inspired font designed by one of computing’s pioneers, blending innovation with readability. Its mix of clean sans-serif and elegant serif styles makes it versatile for both bold headings and in-depth articles. The sans-serif style is clean and suitable for large texts like headings, or smaller items like tags and menu’s. It’s serif style make is ideal for AG Connect’s (sometimes) long and in-depth articles due to it’s readability. This combination ensures a professional, readable, and tech-focused look that aligns with the platform’s identity.
Color
The old identity featured six arbitrary color schemes plus AG Connect’s default cyan, lacking clear differentiation. The redesign prioritized distinguishing regular, members-only, and partner content, reducing the palette to three colors: deep blue for general and members-only content, green for partner articles, and orange for calls to action. The AG Connect logo and primary color were refined to a deeper blue, enhancing professionalism and credibility.
Visual details
We incorporated dithering on select graphical elements to evoke a sense of nostalgia, as a nodding to the early days of IT. By using this technique subtly and sparingly, we maintained a clean, modern look while still introducing a touch of retro charm. This helped us balance the desire for a familiar feel for the existing audience with the need for a streamlined, minimalist aesthetic, that also appeals to a younger audience, ensuring the design remains both engaging and visually uncluttered.
Custom iconography
To accommodate the website’s new features and responsiveness, a custom icon library was created, with distinct icons designed for buttons and other UI elements. These icons are modernized interpretations of those originally designed for early computer systems by pioneers like Susan Kare, but without the technical constraints of the past.
A future-proof versatile design system
Given the tech-savvy audience of the website, it is accessed across various devices, including phones, tablets, laptops, and desktops. A key consideration was ensuring the design system could be adapted for future use by other Sijthoff Media outlets, such as Business Insider, Adformatie, and Binnenlands Bestuur. I developed a comprehensive design system where each component is easily adjustable for different screen sizes and column widths. For example, the article preview component was designed to work across 8, 6, 4, and 2 column widths in both row and column formats, with or without preview images, optimized for mobile, tablet, and desktop views.
Dismantling components for control and flexibility
Each component in the design system is built with a clear hierarchy, allowing for maximum flexibility and future use cases. For example, the article preview header enables designers and developers to easily adjust or toggle smaller elements like the category, meta data for reactions and reading time within a component, ensuring it adapts seamlessly to different screen sizes and page types.
Built for a dynamic grid system
As mentioned earlier, even a component like the article preview block was carefully designed to integrate with our grid system. It is fully adaptable across 8, 6, 4, and 2 column widths in both row and column layouts, with or without preview images. The component is optimized for mobile, tablet, and desktop views, ensuring a seamless experience across all devices.
New features to enhance usability and user experience
The redesign introduces several new features like a reading time estimate, a progress tracker to show how far along you are in an article, and an upgraded comment section to encourage more engagement with the audience. Additionally, the site now offers an index for easier navigation, along with options to share, save, or gift articles. A standout feature is the AI-powered text-to-speech functinality, allowing articles to be read aloud to users for a more accessible experience.
Custom subscription website
In addition to the main website, we also redesigned the subscription site to better highlight AG Connect’s various subscription options. With both digital and physical magazine subscriptions available, users often face different choices regarding type and frequency. The redesign simplifies this process by clearly displaying how each option impacts pricing and features, allowing users to easily compare and select the subscription that best suits their needs. This subscription website was also design as a part of the design system and can easily be modified for other outlets of Sijthoff media, like Adformatie and Business Insider.
