DNV GL is the leading provider of risk management and quality assurance services in many industries, like maritime, oil, gas, power and renewables. Operating in more than 100 countries, the company is also a global leader in certifying management systems across the sectors healthcare, food, beverage, automotive and aerospace.
In a previous project for DNV GL, we created a content hub in a magazine style. This website served as a platform to showcase the company's expertise. This look and feel had to be applied to the Technology Outlook, a microsite with articles about future trends and technologies. The reader should be guided through related topics, but also remain in the relevant sector and see a clear difference between articles about trends and those about specific technologies.
I accompanied this project from the very beginning, where we explored the navigation concept and different user journeys together with DNV GL. For that I created wireframes and user flows to visualize the ideas. In the next step I did the art direction by extending the existing corporate identity for the purpose of the project, as well as establishing a distinctive style for the use of images. Finally I did the UI and UX design for the website and supported the developers at the implementation. The work has been done in a short time frame, with the use of sprints and over the course of 6 months from kick-off to release.
The main purpose of our landing page is to lead the user into specific content funnels, while also showing some articles and offer a PDF download. The button in the introduction links directly to the overview page showing all articles. By choosing a sector the user is directed to a pre-filtered overview page.
On the overview page we offer different ways to navigate through all articles. Users can choose a single sector and multiple tags. By making a selection, the articles rearrange automatically and non-matching ones will hide. Each tag is related to one or more sectors. depending on the selected sector, articles may hide when not relevant. Below the normal articles there will always be special articles, that reflect the work by DNV GL on specific topics.
We designed two different layouts for articles. The first one is made for general articles and has images that remain sticky on the side and change while scrolling, depending on the content. With this feature content editors are able to tell stories in a more immersive way.
The second layout is for more text-intensive articles and has a chapter navigation, that gives users a quick overview and at the same time, enables them to easily jump between chapters.
We added some interesting details, like a slightly toned background for a papery-look, callouts, quotes and footnotes. The first article type has a head section with an image background and is staring with a drop-cap, while the second one has a smaller header with a serif font and an intro text.
The navigation can be accessed on the top right. Within the navigation a user can use the custom-styled tile search, jump into the articles by selecting a sector or a tag, read the letter from the CEO or download the PDF version of the outlook. We decided to put the footer in there, too. Pages can be long and this way the important links are quickly accessible.