Skip to main content
All CollectionsWhat's New?2022
Media Database - Updated Look & Feel (UI/UX)
Media Database - Updated Look & Feel (UI/UX)

UI Tweaks & Improved Readability

Stefan avatar
Written by Stefan
Updated over 2 years ago

The following is an insight into our latest design updates to the media contacts database & what we usually consider when building new interfaces and functionality.

Available now!

Introduction

Since the launch of our new media contacts database, we have been collecting user feedback and building a list of tweaks that we felt would improve our user interface and user experience.

We want to share some of the changes that we've made and provide comparisons to really highlight the differences made - many will go un-noticed unless you know what to look for!

What changes have we made?

Many changes were focused on improving the readability of text throughout our database screens to ensure that all text can be read easily by users - especially any that struggle with their sight.

Despite having a white background in most areas of the system, we found that some text was either too small or faint to read - not great!

Therefore, we focused on updating the typography used across our recent modules - such as streamlining the font, font-size and font-weight and font-colour that we use.

Other areas of the UI have also been made more compact and digestible.

Some examples below...

Example Before/After Comparisons

Contact profiles have stronger/darker fonts to make all text stand out:

Associated records against a contact have adjusted column widths so more text can be shown where appropriate:

Recent articles have a stronger fonts and divider lines to more visible separate different articles. We've also condensed the tag size to fit more on the page:

Action menu items are now more compact, in line with our design and use stronger fonts to make them stand out more:

The system navigation menu also stands out more strongly:

Multi-select search filters are also more compact and the icon colour & size changed. Green is better suited to associate a 'positive' action by users - in this case selecting a filter - rather than the previous red:

Other Changes

This is a longer list of further UI changes and comparisons made across our database screens (Contacts, Outlets, Groups, Features).

One of the more noticable changes is the addition of icons to the filter headings for Contact & Outlet search pages:

The system navigation menu is now better suited to mobile users. The menu now displays the full height of the page and menu items/links are aligned centrally - to make them easier to reach/click.

Search filters are now more compact so you'll see more filters on the screen than before. We have also updated the 'Show More' link and converted check-boxes to switches:

Contact Position menus have been improved/fixed for desktop & mobile:

Contact records view:

Save to Group menu has been compacted to show more Groups and an updated 'New' button:

Feature search:

Outlet Features:

Outlet metadata:

Outlet metadata (mobile view):

Contact Comments:

Vuelio Score:

Political monitoring insights follow the same updated design:

Did this answer your question?