Isentia approached Matter to build a website that would bring their company into the modern era. As pioneers in the media industry, Isentia wanted that image portrayed to their online audience.
The previous site did not reflect the way the company had evolved with the times. The company wanted designs that kept to the existing brand guidelines but reflected the way Isentia had grown and advanced.
For this, our UX/UI developer dove deep into the brand guidelines and familiarised himself further with trends in the media and technology design space. The outcome was designs and layouts that played with the concepts in the original brand guidelines and reimagined what the site could look like.
There were two key questions going into this project:
How do we keep to the old brand guidelines but create something that has a modern look and feel?
Since content is so important, how do we design the backend to ensure the client is able to manage their own content easily without altering the layouts?
Isentia is a content-driven site and regularly releases new articles and needs to be agile to keep up with the industry. This meant Matter needed to design the backend to be easy for the client to change copy and images without interfering with existing layouts. This also meant that the design of the backend needed to be clear and intuitive. To ensure the site was easy for the client to manage, we developed the site in components which were reused across the site. These templates form the basis of the site and ensure that editing in the future is straightforward for the client.
A lot of the creative energy that went into the Isentia project was in rethinking the brand guidelines to create something modern and technological. Overall, we decided to use a clean look and feel, keep the background white and use the bright blue from the guidelines and the logo to bring the site to life. Further thought went into the way we used lines and layouts, images, icons and colours to keep the sight sleek and tidy.
Lines and Layouts
We used a grid format and worked in modules so that the site was easy to read and easy for the client to edit. The sections of the site are broken up by blue or white background panels. The blue is used to highlight key features and products. We also kept buttons, boxes and forms with rounded edges to reflect the edges of the logo.
We decided to use simple isometric images mostly using the white and blue from the guidelines to keep the clean and modern feel. The isometric design style is typical of technology graphic design so it keeps the modern tone. We added small amounts of extra colour and drop shadows to the designs to make them pop and appear as if they are floating.
We sourced icons for the client and used colours to segment the categories. These are used throughout the site to help guide users through the various categories and provide a further point of reference.
The Isentia site was built on WordPress and is hosted by WP Engine. The site was developed to be simple enough for the client to maintain and manage, while complex enough to support large quantities of content and facilitate growth in future years.
Some key aspects of the build included incorporating multi-language capacities, a number of custom post types and different post formats, and a number of integrations.
Custom post types and post formats
Isentia uses a number of custom post types and post type formats to ensure the fields are easy for the client to manage.
The different post types are:
- Team members
Within Reports there are also a variety of post formats. Each report type had slightly different features and CTA’s so required varied layouts. When the client selects the category for the post type, it pulls through the relevant template, keeping it simple for the client to use. The client can then further use tags within the category to add an extra layer of categorisation within the posts. The formats include:
- Case studies
- Thought Leadership
- Media Releases
Overall, we tried to keep the plugins and integrations lean where possible so there is less security risk and minimal site maintenance. However, there are a few integrations we used to create the site. More particularly, these included:
- WP Engines Geotarget plugin for multi-language through geolocation settings
- Created an integration with their ASX feed
- Marketo for forms
The Isentia website rebuild was a high-intensity project with rapid turn-around time. We enjoyed working closely with the client and look forward to continuing to work with them in updates and greater language capabilities.